共 6000 个封面，今年制作了2款供大家选择，希望大家喜欢！

微信打开这个链接 或者微信扫码领取

马上暴富 ​

马上大吉 ​

今年是非常跌宕起伏的一年，身体健康情况比较糟糕，刚过完年就生病，治疗贯穿了一整年。

不过最难的坎儿是迈过去了，说是涅槃重生也不为过，很幸运此刻还能在屏幕前码字。

健康 ​

2月突发了主动脉夹层，除了要首要治疗的主动脉问题，还引发了一系列的并发症需要治疗。

在 4 家不同的医院，累计住了 7 次院，小半年的时间都呆在医院里了😱。

做了 2 次介入 + 胸腹主动脉置换才算彻底把夹层导致的血管问题处理完。

希望在新的一年里能够健健康康的，回归正常的生活节奏。

工作 ​

由于健康问题，今年休假的时间比较多，工作是断断续续的，因此更多是负责一些重要不紧急的内容。

主要是 C 端访问链路 相关的优化和周边建设的工作。

写作 ​

杂七杂八一共输出 20 来篇，其中 13 篇是技术周刊。

周刊内容一直是古法自己搜集并体验整理的，比较费时间，今年空闲时间比较少，输出整理就少了。

相比前的量是少了很多嘿嘿，技术干货也比较少。

大概数据如下

红包封面还在制作中！

AI 给我的冲击也是非常大的，遇到的很多问题通过 AI 直接解决了，搜素引擎使用的频率大大下降，就没有过多的沉淀成文章了，下次遇到 AI 也自然而然的能解决。

明年计划多涉猎一些 AI 相关的内容去做输出了，以免落后于时代成炮灰咯😄，AI 一周一个样。

开源 ​

除了维护老项目，今年还开了一些新坑，不过与以往不同，新项目都是 AI 重度参与的。

写开源也是码代码最愉快的时候，随心所欲。

VitePress 博客主题 @sugarat/theme ​

持续维护的一个老项目

25 年一共发了 9 个版本，仍然是今年投入比较多的一个项目。

image-uploader - 动态图片下发 ​

固定图片链接，按需更换图片内容

我主要拿来上传微信群二维码，每周更新 1 次。

md-qrlink - 标题外链转二维码 ​

主要用在文章分发到公众号平台时的格式转换，将外链生成一个对应的二维码，方便阅读跳转。

echo-trails - 记忆的回响 ​

私人的相册APP，最初主要用来保存一下多个手机里的照片，将其同步到云端，同时也可以多设备共享管理与查看。

除了核心的图片功能，还添加了一些家庭日常用的小工具，静态资源存储使用的缤纷云，免费额度很高（50GB/月），达到收费后资费也非常便宜。

搞的第一个比较规矩的APP，之前都是做纯 Web，在手机上体验不是特别友好，因此尝鲜了一些新技术，结合 Native 开发，使端上有更好的体验。

这个项目后续也会持续打磨，边学新东西边往里加（AI 仍是开发主力👍🏻）。

最后 ​

“真刻骨铭心”的一年，最值得关注的还是健康，只有健康的体魄才能做自己想做的事。

希望新的一年能够平平安安，稳稳当当的度过。

Next ​

坚持写作，保持长期学习&分享的习惯，乐观积极的生活。

祝大家🐴年大吉，心有所悦，万事皆可成。

目录 ​

• 2025年度总结
• 2024年度总结 - 🕊
• 2023年度总结
• 2022年度总结
• 2021年度总结
• 2020年度总结
• 2020前端春招经验分享
• 前端备战之计算机网络
• 前端备战之操作系统
• 如何编写一份好的互联网校招简历
• 互联网校招相关名词

前言 ​

笔者维护的 VitePress 博客主题已经集成了非常多的功能，为便于在主题之外复用，因此有计划将其一部分功能分离出来，形成独立的插件。

现在又有AI加持，再已经有通用插件模板前提下，使用AI就能完成95%的插件工作量！

分离的 图片预览插件，效果如下：

组件样式实现参考了 Element Plus Image Viewer

接下来先简单介绍一下用法，再快速讲解核心原理。

插件开发基于之前创建的一个通用模板，vitepress-plugin-slot-inject-template，在模板的基础上，插件95%的代码由 Gemini 3.0 生成。

如何使用 ​

只需要 2 步：

1. 安装插件

pnpm add vitepress-plugin-image-preview

2. 配置插件

引入插件在 .vitepress/config.mts VitePress 配置文件中

import { defineConfig } from 'vitepress'
import { ImagePreviewPlugin } from 'vitepress-plugin-image-preview'

export default defineConfig({
  vite: {
    plugins: [
      ImagePreviewPlugin()
    ]
  }
})

实现原理 ​

这里只阐述关键点，细节与之前的公告插件类似，这里不做赘述。

VitePress 默认主题 Layout.vue 组件预设的一些插槽，只需将实现自定义组件注入到对应插槽为止即可。

所有的 slots 在 VitePress 文档里也有介绍

注入自定义组件 ​

利用插件的 transform 钩子，将我们的 <ImagePreview /> 组件插入到 Layout.vue 的特定插槽位置

图片预览组件我这里使用的是 doc-before 和 page-top 两个插槽。

使用 alias 保证引入组件的路径正确映射。

// 仅包含关键代码
const componentName = 'ImagePreview'
const componentFile = `${componentName}.vue`
const aliasComponentFile = `${getDirname()}/components/${componentFile}`
function ImagePreviewPlugin(options = {}) {
  return {
    // 添加alias
    config: () => {
      return {
        resolve: {
          alias: {
            [`./${componentFile}`]: aliasComponentFile
          }
        }
      }
    },
    transform(code, id) {
      // 筛选出 Layout.vue
      if (id.endsWith('vitepress/dist/client/theme-default/Layout.vue')) {
        let transformResult = code

        // 插入组件
        const slots = [options.slots || ['doc-before', 'page-top']].flat()
        for (const slot of slots) {
          const slotPosition = `<slot name="${slot}" />`
          // 添加 ClientOnly 目的是避免组件在SSG的时候被渲染
          transformResult = transformResult.replace(slotPosition, `${slotPosition}\n<ClientOnly><${componentName} /></ClientOnly>`)
        }

        // 导入组件
        const setupPosition = '<script setup lang="ts">'
        transformResult = transformResult.replace(setupPosition, `${setupPosition}\nimport ${componentName} from './${componentFile}'`)
        return transformResult
      }
    },
  }
}

插件配置传递 ​

采用虚拟模块的方式传递配置。

组件中导入配置：

import options from 'virtual:image-preview-options'

插件中处理虚拟模块：

const virtualModuleId = 'virtual:image-preview-options'
const resolvedVirtualModuleId = `\0${virtualModuleId}`
function ImagePreviewPlugin(options = {}) {
  return {
    // 省略其它无关代码...
    resolveId(id) {
      if (id === virtualModuleId) {
        return resolvedVirtualModuleId
      }
    },
    load(this, id) {
      if (id === resolvedVirtualModuleId) {
        return `export default ${stringify(options)}`
      }
    },
  }
}

核心交互实现 ​

图片预览的核心逻辑在于监听图片的点击事件，获取图片列表，并显示预览遮罩。

1. 事件监听：在 onMounted时，给内容的容器注册点击事件，在点击的时候获取容器中所有的图片元素，然后做后续操作。

onMounted(() => {
  const wrapperId = imagePreviewOptions?.wrapperId || '#VPContent'
  const docDomContainer = document.querySelector(wrapperId)
  docDomContainer?.addEventListener('click', previewImage)
})

function previewImage(e: Event) {
  const target = e.target as HTMLElement
  const currentTarget = e.currentTarget as HTMLElement
  if (target.tagName.toLowerCase() === 'img') {
    const selector = imagePreviewOptions?.selector || '.content-container .main img,.VPPage img'
    const imgs = currentTarget.querySelectorAll<HTMLImageElement>(selector)
    const idx = Array.from(imgs).findIndex(el => el === target)
    const urls = Array.from(imgs).map(el => el.src)
    // 省略其它逻辑
  }
}

2. 预览组件：参考了 Element Plus 的 图片预览组件的样式与功能，这部分完全由 AI 实现(Gemini 3.0)，还原度非常高。

插件模板介绍 ​

在开发插件的过程中，笔者把此类基于 slot 位置注入的插件分离了一个模板 vitepress-plugin-slot-inject-template

有相关诉求的朋友，可以基于此模板，配合 AI 快速的开发各种基于插槽就可以实现的组件能力。

最后 ​

插件完整源码 vitepress-plugin-image-preview

最后再感叹一句，AI 太牛逼了，效率起飞。

欢迎评论区交流&指导。

终于闯过最难的一关了，身体里的大患彻底刨除。

25年12月25日进行的胸腹主替换手术，时长约6小时，由心外顶尖医生"孙立忠"主刀，顺利拿下；近期状态恢复得还行，在这里记录分享一下相关细节。

病情回顾 ​

25年2月4日，突发胸&背&腰痛，急诊去医院做了增强CT；确诊为主动脉夹层B型，整个降主动脉几乎完全撕裂。

当时我就在想是不是要做胸腹主置换了，工作了几年生活刚好起来就发难了。

为什么跑上海来做手术 ​

最开始发病，急诊去了四川华西，但由于病情复杂，华西并没有给到可靠的治疗方案，给予常规止痛降血压治疗了1周，就给转到疗养医院（急性期内不让下床，让躺一个月）。

托朋友先去了北京安贞，找了朱俊明医生（顶尖的心外医生），得到的结论也是做胸腹主置换，让先床上躺够时间，等待血肿吸收。

于是在25年3月9日，就动身去了北京，线下面诊了医生，医生看过当下身体情况后，不是特别乐观，现在的状态不是很能支持这个手术，让考虑清楚再来找他。（安贞住院得排差不多1个月起的队）

3月14日的时候又突发心悸，120又拉到医院做了检查，病情又有所进展。

没招了，只好去最后一个选择了，上海德达医院，另一位心外科大佬“孙立忠”在这里坐镇。

"上海德达心血管医院" ，在心血管领域算是最后一站了，很多其他医院不收的复杂病例的都往这里跑。

这家医院是私立医院，有一些自主定价的额外费用不在医保范围内。

孙院长给了一个相对安全折中的治疗方案，难以操作的部分先通过介入处理，剩余部分再外科手术处理。

于是3月和9月做了两次介入，年底来复查的时候，未处置的部分进展过于迅速，就安排做外科手术，处理剩余病变部分。

术前 ​

1. 一顿检查+各项指标评估

常规的化验、各种超声、增强CT、脑部磁共振。

刚好也赶上年底病人相对较少，第四天就安排手术了！

2. 术前身体准备

备皮（头部以下，剃光光）；灌肠（使用开塞露Plus😱）。

3. 术前谈话告知风险

小概率会截瘫；术中大出血。

手术当日 ​

手术排在了第二台，上午没有排上，就安排了静脉补液。

下午大概 1:30 进的手术室，准备阶段我还清醒着，配合完整左右手的穿刺，还有背部脊柱侧的穿刺，说是术中必要的时候补充脑脊液。

这三针搞完，就准备推麻药了，医生告知准备睡觉了，松了一口气，不用醒着受罪了（非常有经验了，今年第三次全麻）。这次数了一下大概30次心跳左右就睡过去了。

晚上 7:30 左右手术结束，整个过程耗时6小时。

医生给到的答复是手术很成功，但肋间动脉质量差没缝合上，不过腰间的侧支循环供血比较好（前2次支架后长出了许多侧枝），有可能会起作用，不至于截瘫，一切要等我醒了之后活动一下才知道。

ICU观察 ​

ICU 里一共呆了3天，第四天早上转入普通病房。

① 第一天：

大概是第二天早上被ICU护士唤醒的，醒来后第一时间就是感受一下腿脚哈哈。幸亏还是好的，护士也松了一口气。

身体状态如下：

醒了之后嘴里插着呼吸管，左右手都被绑着，避免抓挠呼吸管；护士说下午才能拔，这期间就没法说话，拔完4小时才能少量饮水，下午拔完呼吸管后，喉咙肿痛，声音沙哑。

下午家属进来探视的时候，我问护士可不可以喝点有味道的甜水，让家属买，护士说他这有冰红茶，说可以喝一点点。（一共喝了3次，每次10ml）

最难受的就是吸痰了，不过这次痰少，只吸了几次。

除了呼吸管，身上还有引流管，鼻子里有胃管，脖子/手/脚上都有穿刺的针。

痛其实还好，没啥感觉，第一天听护士说给了吗啡，还有一个止痛泵，会不停地提供止痛药，也可以在痛的厉害的时候自己手动按。

不过这药有致幻效果🍄，眼睛一闭上就各种幻象，睡觉也是不断地梦，人睡得浑浑噩噩的。

② 第二天

早上在超声复查身体的时候，胸腔右侧有许多积液，后背又挨了一小刀，穿刺引流。

今天的护士隔一段时间就给我翻一下身，然后使劲的拍背让咳痰。（哎哟，要了老命了）

③ 第三天

由于一直没有通气（放屁），今天给了一个促进肠道的药，中午晚上吃了两次，我感觉肚子里已经有气了，醒着的时候就不停地用手揉，累了就睡。

没通气就不能吃东西，水的话一小时也只能喝几十毫升

这两天脑脊液量差不多达标了，晚上把背上脑脊液引流的针拔了，需要平躺6小时，没搞好的话说会引起头疼。

④ 第四天

一大早ICU 医生看了一下状态指标都还可以，就吩咐护士把身上能拔的管子和针都拔了，留了左腹部引流和脖子上输液的针，然后转到了普通病房，

普通病房休养 ​

12月29日早上转回的普通病房。

护士交接的时候发现，背上有比较严重的压疮，在ICU里躺太久，皮肤压伤了，建议尽量侧着躺，背上搞了一些贴贴保护。

早上给伤口消毒的时候才看见伤口长啥样：

1. 腹股沟有一处：伤口像个 T 字形，大概 6cm 左右，问了一下是用于建立体外循环的。
2. 胸腹主置换的刀口：从左背到左腹部完整的一刀，大概 4&50cm。

普通病房的床睡着非常不舒服，第一天有止痛泵还好，给人能整得迷迷糊糊的睡。

第二天止痛泵就用完了，白天没精神的时候就睡，伤口不算特别痛，但是两侧肩膀和左腰非常的酸胀，怎么躺都难受，只有特别疲惫的时候才能睡着，醒了就一身酸痛。

医生给搞了点膏药贴在几个痛处

第3/4天的时候状态稍微好点，肩膀不再酸胀了，偶尔床边坐坐，其它时间除了上厕所都是在床上躺着，在床上转辗反侧，滚来滚去。

第五天早上早床边坐了一会儿，突然腹股沟处的伤口刺痛，我赶紧上床准备躺一会儿，定睛一看伤口周围肿胀起来了，皮肤被撑得鼓鼓的。赶紧叫护士让医生过来看看。

医生来摸了一下，说有搏动，不排除“假性动脉瘤”的可能，如果确认是的话就得拉到手术室搞了。赶紧让超声来看看，由于当天还在元旦假期，只有一个超声医生值班，轮到我检查已经是过来好几个小时了。看完说里面没有血流信号，就把危险的情况排除了，说可能是血肿，内部伤口渗液，说会自行吸收。

次日就没下床活动了，担心给血肿搞大；早上医生查房，主任医生摸了一下说有可能是淋巴漏了，血管都是缝合过的不可能漏。

第七天早上查房发现腹部的伤口一直没有结痂，有脂肪液化的现象，说要挤出来，然后就由医生单独用手挤压伤口然后消毒，脂肪液化预估要挤好几天。

第八天继续搞脂肪液化的问题，但出现了小插曲，医生在用力挤的时候，我突然感觉腹股沟有一股热流，感觉什么东西破了一样，然后看到之前肿胀的位置变得更大了，给医生吓一跳，赶紧让超声第一时间来看什么情况。

让超声医生仔细看一下到底有没有血流，最后还是没有血流信号，不过下面的动/静脉都有一定程度受压，医生说得搞一下给里面东西抽出来看看到底是什么。

于是叫护士拿了一堆不同规格的针筒过来，先用 1ml 的扎了下去，抽出来是黄色的液体，医生松了一口气，确定就是淋巴液。

然后换成 10ml 的，这个针头明细感觉大一些，扎下去有明细疼痛，抽完后又准备换20ml的，我说哎要不就10ml的抽，20ml的扎着会更痛。医生赶紧说别担心，这次只换针筒不换针头，不用再挨一针，连着抽了2个20ml后，鼓包就消下去了，剩下的一点说让自行吸收，避免针头探太深，扎到动脉。

抽完就加压包扎了一下，说压几天，避免持续渗液。

第九天脂肪液化还是存在，导致伤口没法结痂一直渗液。今天医生说重新缝合一下这部分，然后就在病房里一顿操作，局部麻醉，先把原来的伤口剪开，然后消毒清理后，重新缝合，缝了6针，非常的紧实能感觉到，肚皮都绷紧了的感觉。

整个操作过程除了打麻药痛，缝合就是有感觉，但不痛，麻药劲儿过了之后才开始渐渐有点感觉，皮肤表面缝合的线至少要14天才能拆。

最后 ​

现在整体状态还不错，能够坐起来玩玩手机和电脑了（第一时间就把本篇小作文码了出来），快的话估计最多还有1周就会叫出院了，伤口拆线估计得回家自己找医院拆了。

上周六 ✈️ 到上海来复查一下身体情况，做了一些检查。

周一上午找了专家面诊，给了治疗建议，尽快手术处理，拖着就是定时炸弹，回家也是提心吊胆的。

来之前有做心理准备，只是比预期来得早一点。

周一下午就办了入院，这次是个大手术了，医生保守估计住院天数在20天左右。

这几天就搞各种检查，快的话这周就能把手术排上。

希望一切顺利！

大伙儿也多关注一下身体的健康情况，有问题及时就医。

欢迎来到第 128 期的【视野修炼 - 技术周刊】，下面是本期的精选内容简介

🔥强烈推荐 ​

1. Anthropic 收购 Bun ​

Anthropic 是 Claude 大模型背后的公司。

Bun 作者发布的阐述博客内容中翻：Bun 被 Anthropic 收购

2. Mole - Mac 垃圾清理工具 ​

一个终端工具，功能很丰富！

分析：

清理：

系统状态：

所有指令

3. React 高危漏洞 ​

React Server Components（RSC）出现了一个最高级别（CVSS 10） 的安全漏洞。

攻击者可以直接在目标服务器上执行恶意代码。

笔者没有跑 Next.js 应用，没有受到影响。

更多信息↓：

1. Cloudflare 本周又挂掉：因防御 React Server Components 漏洞，Cloudflare 遭遇 25 分钟服务故障

2. bug 如何产生和修复看这里： React Server Components RCE 漏洞分析

钻了原型链漏洞，修复只需加上 hasOwnProperty 就行！

3. 鱼皮阐述受到攻击：Next.js高危漏洞致服务器被黑，我已中招！

4. 如何发现和利用漏洞插件：Next.js无条件RCE漏洞 - 浏览器插件

https://github.com/mrknow001/RSC_Detector

🔧开源工具&技术资讯 ​

4. code996 ​

code996 是一个分析工具，它可以统计 Git 项目的 commit 时间分布，进而推导出项目的编码工作强度。

npx code996

5. Vite 8 发布 Beta ​

由 Rolldown 驱动。

6. 基于Web本地化的图片编辑器 ​

7. Gitmal - Git 仓库变成静态站点 ​

8. GitHub 分享卡片生成 ​

支持多种样式定制。

⭐️强力推荐关注 ​

周刊部分内容来源如下渠道，推荐大家关注。

• 阮一峰: 科技爱好者周刊 - 记录每周值得分享的科技内容，周五发布
• FRE123 技术周刊精选 - 技术周刊精选推荐信息流

欢迎来到第 127 期的【视野修炼 - 技术周刊】，下面是本期的精选内容简介

🔥强烈推荐 ​

1. tasuku - 极简 Node 任务处理 ​

import task from 'tasuku'

task('Task 1', async () => {
  await someAsyncTask()
})

task('Task 2', async () => {
  await someAsyncTask()
})

task('Task 3', async () => {
  await someAsyncTask()
})

在做 CLI 的时候可以用上，尤其需要处理多个异步任务时。

还支持嵌套，多状态展示等。

感觉和 @clack/prompts 和非常搭配。

收藏 ⭐️！

2. fkill - 强制终止进程 ​

进程大杀器，支持多种终止进程的方式👍🏻，跨平台可用。

import fkill from 'fkill'

await fkill(1337)
console.log('Killed process')

fkill('Safari')
fkill(':8080')

fkill([1337, 'Safari', ':8080'])

也支持 CLI 调用。

npm install --global fkill-cli

fkill 1337
fkill Safari
fkill :8080

还支持 交互式 CLI。

赶紧装上。

3. FileMock ​

免费的测试文件生成器，支持视频/图片/音乐/文档等多种格式。

收藏⭐️，基本覆盖了常见的文件格式！

🔧开源工具&技术资讯 ​

4. Valdi - 新的跨平台 UI 框架 ​

使用 TypeScript&TSX 编写 UI，可以直接编译成 iOS、Android 和 macOS 上 由 Native 渲染的视图应用，无 JS 中间层。

笔者拉仓库试了一下 Demo，效果如下。

感觉还行，就是才刚开源，文档还不是特别友好，项目初始化流程不是特别标准。

5. JavaScript 引擎大全 ​

包含上百种 JS 引擎的基本信息 ES 支持程度，性能等对比信息。

📚教程&文章 ​

6. 使用 Error.cause 进行错误处理 ​

使用 Error.cause 处理错误，保留更清晰的堆栈跟踪信息。

function fetchUserData() {
  try {
    JSON.parse('{ broken: true }') // ← This will fail
  }
  catch (parseError) {
    throw new Error('Failed to fetch user data', { cause: parseError })
  }
}

try {
  fetchUserData()
}
catch (err) {
  console.error(err.message) // "Failed to fetch user data"
  console.error(err.cause) // [SyntaxError: Unexpected token b in JSON]
  console.error(err.cause instanceof SyntaxError) // true
}

🤖AI工具&资讯 ​

7. GitHub Repo Visibility Analyzer ​

这个免费的工具可以对你的仓库进行分析，提供主题标签建议和其他推荐的行动项，帮助开发者更容易地找到你的项目。

提升你在 GitHub 搜索、Google 和大型语言模型（LLMs）中的仓库可见性。

⭐️强力推荐关注 ​

周刊部分内容来源如下渠道，推荐大家关注。

• 阮一峰: 科技爱好者周刊 - 记录每周值得分享的科技内容，周五发布
• FRE123 技术周刊精选 - 技术周刊精选推荐信息流

欢迎来到第 126 期的【视野修炼 - 技术周刊】，下面是本期的精选内容简介

🔥强烈推荐 ​

1. 🤫spoilerjs ​

一个框架无关的 Web 组件，用于创建带有粒子动画效果的隐藏文字内容。

<h1>
  Beautiful
  <spoiler-span>
    spoiler effects
  </spoiler-span>|
</h1>

⭐️！

2. 🏆 TypeScript 跃升至 #1 - GitHub 上最常用的语言 ​

2025 年 8 月，TypeScript 超越了 Python 和 JavaScript，TypeScript 现在是 GitHub 上最常用的语言 。

3. 中国法定假日查询库 ​

做复杂日历组件必备！收藏+1。

🔧开源工具&技术资讯 ​

4. type-flag - 类型化命令行参数解析 ​

my-script --name John --age 20

import { typeFlag } from 'type-flag'

const parsed = typeFlag({
  name: String,
  age: {
    type: Number,
    alias: 'a'
  }
})

console.log(parsed.flags.name) // 'John'
console.log(parsed.flags.age) // 20

5. Node v24 已经是最新的LTS 版本 ​

6. TypingSVG ​

生成由 SVG 驱动的打字动画。

7. 腾讯 TDesign 组件库的 uniapp 适配 ​

先收藏，uni-app 开发小程序可以考虑考虑。

8. Dayflow - 每日的电脑使用分析 ​

开源的 macOS 桌面应用，可以生成电脑屏幕一天的时间占用。它每秒截一次屏，然后交给 AI 分析，生成你一天活动的时间线。

本地使用阿里开源的 qwen 模型。

支持以视频的形式回顾屏幕历史。

windows 上印象也也有类似的工具（待我翻翻吃灰的收藏夹 再贴上来）。

9. image-dimensions ​

获取图片的尺寸信息，支持现代的js运行环境（浏览器、Node.js、Bun、Deno等）

import { imageDimensionsFromStream } from 'image-dimensions'

// example1
const url = 'https://sindresorhus.com/unicorn'

const { body } = await fetch(url)

console.log(await imageDimensionsFromStream(body))

// example2
const data = getImage()

console.log(imageDimensionsFromData(data))
// => {width: 1920, height: 1080, type: 'png'}

10. Biome v2.3 ​

Biome 是一个适用于 JavaScript、TypeScript、JSX等快速格式化工具，与 Prettier 有高达 97% 的兼容覆盖率，同时也是一个高性能的 linter。

现在支持 Vue、Svelte 和 Astro lint和格式化了！

11. Vercel 支持 Bun 运行时 ​

12. emoji-regex ​

提供匹配表情符号的正则

const emojiRegex = require('emoji-regex')

const regex = emojiRegex()

for (const match of text.matchAll(regex)) {
  const emoji = match[0]
}

⭐️！

⭐️强力推荐关注 ​

周刊部分内容来源如下渠道，推荐大家关注。

• 阮一峰: 科技爱好者周刊 - 记录每周值得分享的科技内容，周五发布
• 值得一读技术博客 - 每天进步一点点，每天分享有料的技术文章！
• FRE123 技术周刊精选 - 技术周刊精选推荐信息流

本次待的时间比上次短，比上次术后状态好不少。

上海这边天气很好呀，待了小半个月，只遇到过几次雨。

回家就连着下了几天雨 🌧，就连着家里躺了好几天。

在飘窗上靠着 “冲浪” 活动活动脑子（紧邻 🛏 方便随时躺下休息休息 😋）

又要待一段时间咯。

09-13 来上海复查病情又有点“新进展”，医生建议尽早入院治疗。

早治疗早康复，回家拖着也提心吊胆的，这次如果处理完，以后又是健康人了。

不过这次带了电脑💻，多个消遣方式。美中不足就是没有流畅的 WiFi（流量又要起飞了）。

没手术前，空闲时间多，能多产出一点哈哈😄（在医院里还是比较安心）

希望一切顺利吧。

大家都健健康康的！

欢迎来到第 125 期的【视野修炼 - 技术周刊】，下面是本期的精选内容简介

🔥强烈推荐 ​

1. nano-banana ​

这周超火的图片编辑模型，谷歌出品的 Gemini Flash，"直接替代 PS"。

可直接上 Google Gemini Web 段体验。

下面给2个案例和提示词（来源于 X 上大佬 @ZHO_ZHO_ZHO 分享）

1. 桌面 3D 手办

Use the nano-banana model to create a 1/7 scale commercialized figure of thecharacter in the illustration, in a realistic style and environment. Place the figure on a computer desk, using a circular transparent acrylic base without any text.On the computer screen, display the ZBrush modeling process of the figure. Next to the computer screen, place a BANDAI-style toy packaging box printed with the original artwork.

2. Cos 生成

Generate a highly detailed photo of a girl cosplaying this illustration, at Comiket. Exactly replicate the same pose, body posture, hand gestures, facial expression, and camera framing as in the original illustration. Keep the same angle, perspective, and composition, without any deviation

大家也可以参考文章 实测谷歌Nano Banana，探索更多玩法！

2. 现代 Nodejs 开发姿势 ​

挑一些实用的点：

1. 使用 ESM 替代CJS

2. 导入内置模块使用 node: 前缀以区分第三方模块 ,如 node:fs

import { readFile } from 'node:fs/promises';

3. 顶层 await

import { readFile } from 'node:fs/promises';
const config = JSON.parse(await readFile('config.json', 'utf8'));

4. 使用内置 fetch 替代第三方外部 HTTP 请求库

const response = await fetch('https://api.example.com/data');
const data = await response.json();

5. 使用 AbortController 终止请求

const controller = new AbortController();

setTimeout(() => controller.abort(), 10000);

try {
  const data = await fetch('https://slow-api.com/data', {
    signal: controller.signal
  });
  console.log('Data received:', data);
} catch (error) {
  if (error.name === 'AbortError') {
    console.log('Request was cancelled');
  } else {
    console.error('Unexpected error:', error);
  }
}

6. 内置测试模块node:test

// test/math.test.js
import { test, describe } from 'node:test';
import assert from 'node:assert';
import { add, multiply } from '../math.js';

describe('Math functions', () => {
  test('adds numbers correctly', () => {
    assert.strictEqual(add(2, 3), 5);
  });
});

# Run all tests with built-in runner
node --test

# Watch mode for development
node --test --watch

# Coverage reporting (Node.js 20+)
node --test --experimental-test-coverage

7. 监听自动重启和环境管理

{
  "name": "modern-node-app",
  "type": "module",
  "engines": {
    "node": ">=20.0.0"
  },
  "scripts": {
    "dev": "node --watch --env-file=.env app.js",
    "test": "node --test --watch",
    "start": "node app.js"
  }
}

8. 导入映射

这个吊，之前都没了解到👍🏻，完美替代 alias

package.json 中添加 imports 字段

{
  "imports": {
    "#config": "./src/config/index.js",
    "#utils/*": "./src/utils/*.js",
    "#db": "./src/database/connection.js"
  }
}

import config from '#config';
import { logger, validator } from '#utils/common';
import db from '#db';

3. PongHub - 开源服务监控平台 ​

基于 GitHub Action 基础能力，自动部署GitHub Pages和定时数据更新。

下面是笔者部署的自己的！

https://health.sugarat.top/

🔧开源工具&技术资讯 ​

4. SSR 渲染 Check工具 ​

一个简单的工具，可帮助检查目标 URL 页面，哪部分内容是服务端渲染哪部分是CSR渲染。

5. difit - Diff CLI ​

GitHub风格本地 Diff 工具

npx difit

6. image-js - 图像处理库 ​

支持在 Node.js 和浏览器中运行，用于调整大小、裁剪、过滤、颜色调整以及许多其他高级操作的库。

👍🏻比较高级

7. 免费HTTPS证书申请 - 90天 ​

收藏！

8. 图片转成像素画 ​

9. 国内SVG Logo资源 ​

10. 各种定价页的设计参考 ​

收藏！迟早有一天会用上。

⭐️强力推荐关注 ​

周刊部分内容来源如下渠道，推荐大家关注。

• 阮一峰: 科技爱好者周刊 - 记录每周值得分享的科技内容，周五发布
• 前端 RSS - 根据 RSS 订阅源抓取最新前端技术文章
• 值得一读技术博客 - 每天进步一点点，每天分享有料的技术文章！
• FRE123 技术周刊精选 - 技术周刊精选推荐信息流

2月份夹层导致的并发症，6月复查严重了，需要手术治疗

捋一下时间线 ​

6月29日 入院（泌尿外科）

7月14日 感染新冠（天天都呆在医院里也染上了，离大谱），到现在咳嗽没好

7月17日 手术（住进去还给我拖了半个月，手术耗材要层层审批，审批了7个工作日实在离谱，人都拖死了）

7月18日 出院（做完手术第二天就赶出院了，也没出院带药，也没输液消炎）

7月21日 开始发高烧

7月22日 感染科门诊，开了一堆检查，结果是尿路感染，急性肾损伤（当天白天几乎无尿，无尿就惨了-喝了几瓶水，报告出来立马就跑急诊安排输液消炎，打利尿剂了）

7月23日 通过急诊又入院（感染科，一天输 3 次抗生素）

7月29日 出院（出院带药需要自费去外面购买，医院没有）

病情 ​

2月夹层之后，报告就提示有左肾积水，但当时策略以保命为主，住院华西的医生说不用管这些，后面就没特别关注这个。

肾也是个 BUG 器官，当发现有相关症状的时候问题都是比较严重了

6月复查的时候发现 左肾积水（尿积肾里无法正常排出） 比较严重了（夜尿多，泡泡多），到手术指标了，就立马住院了。

入院后排查是腹部残余夹层导致血管比较粗压迫到左侧输尿管，导致输尿管狭窄

治疗 ​

手术 ​

治标就是放置一个输尿管支架，给撑起来，向下图这样，一年一换。

抗感染治疗 ​

二次入院就是针对性的输抗生素，1天3瓶输了7天，就出院改口服药了。

药是真贵，自费外部购买，线下还非常难买到。

现状 ​

身上 DeBuff 叠满了，出院诊断还有不少小毛病，需要慢慢调养（比如贫血，营养不良啥的）。

费用 ​

连着 2 次住院自费差不多1个w。

药不能停 ​

开了一堆药和营养品，一天药钱得花个小200￥。

后续 ​

多休息休息调养身体，补充点营养，长点肉（本来就瘦，这次住院又瘦了7-8斤）。

欢迎来到第 124 期的【视野修炼 - 技术周刊】，下面是本期的精选内容简介

🔥强烈推荐 ​

1. figlet.js - 终端生成 ASCII 艺术字体 ​

var figlet = require("figlet");

figlet("Hello World!!", function (err, data) {
  console.log(data);
});

  _   _      _ _        __        __         _     _ _ _
 | | | | ___| | | ___   \ \      / /__  _ __| | __| | | |
 | |_| |/ _ \ | |/ _ \   \ \ /\ / / _ \| '__| |/ _` | | |
 |  _  |  __/ | | (_) |   \ V  V / (_) | |  | | (_| |_|_|
 |_| |_|\___|_|_|\___/     \_/\_/ \___/|_|  |_|\__,_(_|_)

还有 CLI 版本支持

收藏起来，写CLI能用上！

2. state-in-url ​

将状态信息存储在URL中，便于持久化当下的用户操作后的页面数据，也便于分享复现。

目前支持Next，React Router，Remix。

3. 语法高亮组件 ​

原生的 web component，用于代码高亮。

import 'syntax-highlight-element';

<syntax-highlight lang="js">
const a = 1;
</syntax-highlight>

使用非常简单！基于 CSS 自定义高亮API实现。

🔧开源工具&技术资讯 ​

4. log-vwer - 轻量的日志监控面板 ​

用于监控 Node.js 应用程序日志的仪表板，实现应用自托管。

使用也比较简单，支持多种日志存储方式！(数据库，文件，内存)

// Import the necessary tools
const express = require('express');
const { setupLogger, viewerMiddleware } = require('log-vwer');

// Create your Express app
const app = express();
const PORT = process.env.PORT || 3000;

// This is an async function to make sure we connect to the database *before* starting the server.
async function startServer() {
    // === Part 1: Set up the logger ===
    const logger = await setupLogger({
      serviceName: 'My Awesome E-Commerce App',
      store: 'mongodb',
      mongoUrl: 'mongodb://localhost:27017/my_app_logs',
    });

    // === Part 2: Activate the dashboard ===
    // This tells your app: "When someone goes to /_logs, first check the password, then show the log dashboard."
    app.use('/_logs', myAuthMiddleware, viewerMiddleware(logger));

    // Start your server only after everything is ready
    app.listen(PORT, () => {
      logger.warn(`Server is alive on port ${PORT}. Ready to rock!`);
      console.log(`Log dashboard is live at: http://localhost:${PORT}/_logs`);
    });
}

// Run the function to start the server!
startServer();

5. 网站链接检测 ​

可以检测网页中的外链，死链等情况。

6. 小恐龙二维码生成 ​

Chrome 同款风格

7. 3D 拟物图标资源 ​

8. Biome V2 ​

宣称是首个无需依赖 TypeScript 编译器(tsc)、却仍能提供类型感知规则的 JavaScript 和 TypeScript 代码检查工具。

😛趣图 ​

⭐️强力推荐关注 ​

周刊部分内容来源如下渠道，推荐大家关注。

• 阮一峰: 科技爱好者周刊 - 记录每周值得分享的科技内容，周五发布
• 前端 RSS - 根据 RSS 订阅源抓取最新前端技术文章
• 值得一读技术博客 - 每天进步一点点，每天分享有料的技术文章！
• FRE123 技术周刊精选 - 技术周刊精选推荐信息流

欢迎来到第 123 期的【视野修炼 - 技术周刊】，下面是本期的精选内容简介

🔥强烈推荐 ​

1. Node 18 早已停止支持，官方建议直接上v22 ​

还没有升级的官方建议跳过 v20 直接使用 v22，剩余更长的生命周期，更多的新特性支持！

🤡 公司里主流还在用 Node 16，基建拉胯，XS！

2. Oxlint 1.0 发布 ​

Oxlint 的第一个稳定版本已经发布！它的性能比 ESLint 提升了 50 到 100 倍 ，支持超过 500 条 ESLint 规则。

支持 0 配置直接启动使用。

npx oxlint@latest

提供更清晰的诊断信息

尝鲜，笔者项目也准备迁一下试试

🔧开源工具&技术资讯 ​

3. 🍊 Orange ORM ​

简洁的 ORM 库，支持 TypeScript 和 JavaScript，以及 CommonJS 和 ESM。

4. darkmodejs - 深色模式工具库 ​

利用 matchMedia API 及其监听器，结合 prefers-color-scheme 媒体查询实现。

使用也超简单！

import darkmodejs from '@assortment/darkmodejs'

function onChange(activeTheme, themes) {
  switch (activeTheme) {
    case themes.DARK:
      console.log('darkmode enabled')
      break
    case themes.LIGHT:
      console.log('lightmode enabled')
      break
    case themes.NO_PREF:
      console.log('no preference enabled')
      break
    case themes.NO_SUPP:
      console.log('no support sorry')
      break
  }
}

darkmodejs({ onChange })

5. 逼真的颜色混合工具 ​

6. 依赖可视化分析工具 ​

antfu 大神的又一力作。

npx node-modules-inspector

多种视图下查看依赖的情况。

📚 教程&文章 ​

7. 速率限制交互式指南 ​

文章介绍了 4 种常用的限流算法：令牌桶、漏水桶、固定窗口、滑动窗口。

每种算法都提供了可交互的 Demo 方便理解。

令牌桶	漏水桶

⭐️强力推荐关注 ​

• 阮一峰: 科技爱好者周刊 - 记录每周值得分享的科技内容，周五发布
• 前端RSS - 根据 RSS 订阅源抓取最新前端技术文章
• 值得一读技术博客 - 每天进步一点点，每天分享有料的技术文章！
• FRE123 技术周刊精选 - 前后端技术周刊精选推荐信息流

欢迎来到第 122 期的【视野修炼 - 技术周刊】，下面是本期的精选内容简介

🔥强烈推荐 ​

1. HDRify - 发光 HDR 图片制作 ​

可以将普通图片转为 HDR 图片。

前段时间刷屏（闪瞎iOS）的青蛙图制作！

2. qnm - node_modules分析工具 ​

🔧开源工具&技术资讯 ​

3. Glow UI - 开源SVG图标 ​

收藏！

4. 在线的图片编辑器 ​

支持在线添加滤镜，裁剪的 WebGL 驱动的编辑器器。

📚教程&文章 ​

5. 面向 JS 开发的 Go 学习指南 ​

看一下 Hello World 对比。

涵盖了基础入门的知识。

6. CSS 聚光灯效果 ​

看上去十分nb，收藏一下

🤖AI工具&资讯 ​

7. Arc 浏览器停止开发 ​

“浏览器公司” 解释停止开发 Arc 的原因。

转向开发新的浏览器 Dia （AI浏览器），不再为 Arc 开发新功能

笔者拿这个一直作为主力浏览器，贼好用哎。

Dia 浏览器 先排上队了。

⭐️强力推荐关注 ​

周刊部分内容来源如下渠道，推荐大家关注。

• 阮一峰: 科技爱好者周刊 - 记录每周值得分享的科技内容，周五发布
• 前端 RSS - 根据 RSS 订阅源抓取最新前端技术文章
• 值得一读技术博客 - 每天进步一点点，每天分享有料的技术文章！
• FRE123 技术周刊精选 - 技术周刊精选推荐信息流

是什么 ​

MD标题外链转二维码

如图给 markdown 内容中带连接的标题下插入一个二维码和连接内容。

方便用户阅读时扫码直接访问或者复制链接。

已支持能力

• 自动解析 MD 文档，识别带超链接的标题
• 自动在标题下方生成对应的二维码和链接文本
• 提供原始预览和转换后预览的对比视图
• 支持一键复制转换后的内容(会将图片以 base64 形式通过img标签导入)
• 自动保存编辑内容到本地缓存
• 移动端提供便捷的预览切换功能

体验地址：

1. https://aicoding.juejin.cn/aicoding/work/7510906446952071202
2. https://atqq.github.io/md-qrlink/
3. GitHub：https://github.com/atqq/md-qrlink

发公众号的话，搭配 微信 Markdown 编辑器（https://md.doocs.org/） 效果更加。

为什么搞这个 ​

微信公众号的个人的文章无法直接跳转第三方的外链，文章通常会是外链转脚注，将相关链接放在最后。

但周刊类型的文章外链较多，不太方便用户 CV 跳转。

之前在其它公众号有看到过类似的展示，就想着复刻过来！

怎么搞得 ​

用 Trae（Claude-3,7-sonnet）生成核心代码（99%），人工主要在一些特定的样式问题上做了介入。

技术原理 ​

Vue 3 + Vite

• Markdown解析: markdown-it
• 二维码生成: qrcode和qrcode.vue
  • 前者负责复制的时候 base64 二维码内容生成，后者负责预览里的二维码渲染
• 本地存储: localStorage API

人工介入部分 ​

1. 布局的样式，AI 每次在修改其它问题的时候会把我已经调整的布局扔掉用新生成的覆盖
2. 复制到 markdown：HTML 标签在复制到微信里的时候 微信会做标签的转换，一些布局样式转换后被丢了。这块需要人工介入在微信的规则下做一下调整。

我的 Prompt ​

第一轮对话的“提示词”

使用Vite Vue实现一个md 格式转换项目，将Markdown中标题是超链接的提取出来，
放在标题下方 并在左侧生成对应的二维码图片

支持预览原Markdown和转换后Markdown内容

总共进行了 15 轮的连续对话，就达到了这个效果。

其中部署 GitHub Pages 的 GitHub Action 脚本也是用其生成的。

最后 ​

现在有了 VibeCoding 的编码方式，出 Demo 非常的快，效率比人工高 N 倍。

可以快速验证想法。

顺便推荐一波此类型的在线工具

• NoCode：https://nocode.cn/
• Bolt：https://bolt.new/
• V0：https://v0.dev/
• Lovable：https://lovable.dev/

Trae 整体体验我觉得还行，3$ 的首月体验还可以接受，大模型都一样，这比 Cursor 便宜太多了。还没搞上AI IDE 的可以试用一波，每天也有些免费额度。

读者有发一些奇思妙想的应用想法，也可评论区来一波。

不多说了“两个字” AI NB

欢迎来到第 121 期的【视野修炼 - 技术周刊】，下面是本期的精选内容简介

🔥强烈推荐 ​

1. Rolldown-Vite ​

https://voidzero.dev/posts/announcing-rolldown-vite

祖师爷官宣 Rolldown 版本的 Vite 的使用 rolldown-vite。

拿 VitePress 验证一下速度，看看提升。

笔者 mac m1 的设备，大约 500 多篇 md，验了一下大概3s的提升有🤭！

感觉存量项目切换还是得折腾一下，笔者跑 VitePress 改了半天才跑起来

2. 对话月影 - AI风口下做啥 ​

https://mp.weixin.qq.com/s/MqB5zMcZ7pMIj6UMPUeuTA

贴几个比较认同的一些观点：

1. “专业性永远重要。你只有对很多东西掌握到足够的深，才能判断AI输出的正确性。”

2. “不要自我设限，别给自己贴上‘前端工程师’的标签，你是解决问题的工程师。”

3. “AI不是让你的活变少，而是让你的价值更大。”

3. snapDOM - 捕获DOM为图像 ​

https://zumerlab.github.io/snapdom/

将任何 HTML 元素捕获为可缩放的 SVG 图像。

官网提供了各种场景的 Demo，效果还是不错。

H5 生成海报分享又多一个选择！

🔧开源工具&技术资讯 ​

4. ForesightJS - 预测鼠标意图库 ​

https://foresightjs.com/

通过预测鼠标将要经过的位置，以此来做数据的预加载。

5. Text2SVG ​

https://github.com/JiuRanYa/text-to-svg

将文本转为 SVG ，可以用来制作文字 Logo。

比如下面这两个 “sugar”。

不过好像不支持中文。

6. MD标题外链转二维码工具 ​

https://github.com/ATQQ/md-qrlink

本文就可以看见这个效果

将Markdown文档中带超链接的标题提取出来，在标题下方显示对应的链接和二维码图片。

这对于需要在微信公众号等不支持外部链接的平台发布文章时特别有用，读者可以通过扫描二维码访问链接。

笔者新鲜打造的，使用 Trae（Claude-3,7-sonnet）生成，人工微调

🤖AI工具&资讯 ​

7. 通义灵码 AI IDE ​

https://lingma.aliyun.com/

阿里推出的 AI IDE 内置自己的大模型。

没上手使用，感兴趣的可以下载试试，目前免费

笔者估计后面腾讯百度美团这种的 AI IDE 推出公测应该也不远了

⭐️强力推荐关注 ​

周刊部分内容来源如下渠道，推荐大家关注。

• 阮一峰: 科技爱好者周刊 - 记录每周值得分享的科技内容，周五发布
• 前端 RSS - 根据 RSS 订阅源抓取最新前端技术文章
• FRE123 技术周刊精选 - 技术周刊精选推荐信息流

欢迎来到第 120 期的【视野修炼 - 技术周刊】，下面是本期的精选内容简介

🔥强烈推荐 ​

1. NoCode - 一句话，呈所想 ​

美团推出的 Web 网站生成平台。对标 Bolt，V0。

目前免费，可以体验体验，效果还可以，支持部署！

2. 直接获取输入框value的number类型值 ​

常见的通过 $input.value 获取的是字符串类型

但浏览器还支持 $input.valueAsNumber API，支持获取数字类型

<input id="number" min="1" max="10" type="number" />
<button id="btn">获取</button>
<script>
    btn.addEventListener('click', () => {
        const numberValue = number.valueAsNumber
        console.log(typeof numberValue, numberValue)
    })
</script>

API 支持程度非常高。

小知识，记下了！

🔧开源工具&技术资讯 ​

3. prompt-kit - AI组件库 ​

一套为 AI 应用打造的灵活且高质量的组件库。

基于 Shadcn/UI 打造。

4. Next BConvert ​

免费本地批量转换图像、音频和文档的工具.

5. jsPad ​

多框架支持的在线 Playground

📚教程&文章 ​

6. Chrome 137 开发者工具的新变化 ​

使用 Gemini 直接修改DOM的CSS样式

通过 Gemini 直接询问数据分析效果

国内要直接使用，得车腾一番才能开启AI助手的功能

7. JavaScript 30年 ​

Deno 团队精心梳理了一条时间线，生动呈现了 JavaScript 的发展历程：从最初在 Netscape Navigator 中崭露头角，到衍生出 JScript 等分支，再到标准化进程的推进和 Node.js 的横空出世，直至今日取得的辉煌成就。

8. TS GO 实现预览版 ​

npm install -D @typescript/native-preview

npx tsgo --project ./src/tsconfig.json

🤖AI工具&资讯 ​

9. 免费的 AI 图像处理工具 ​

功能丰富，体验了一下效果也还可以，也是纯本地运行。

收藏+1

😛趣图 ​

⭐️强力推荐关注 ​

周刊部分内容来源如下渠道，推荐大家关注。

• 阮一峰: 科技爱好者周刊 - 记录每周值得分享的科技内容，周五发布
• 前端 RSS - 根据 RSS 订阅源抓取最新前端技术文章
• FRE123 技术周刊精选 - 技术周刊精选推荐信息流

欢迎来到第 119 期的【视野修炼 - 技术周刊】，下面是本期的精选内容简介

🔥强烈推荐 ​

1. console支持的格式化字符串 - 小知识 ​

大家初学 js 或者其它语言的时候通常打印函数支持接受一些格式化参数

比如 C 语言

printf("Hello %d\n", 123);
printf("Hello %s", "world");

js 的 console.log 也支持。

在 Node 侧还可以使用 %j 替代 JSON.stringify

console.log('value: %j', { name: 'xm' })

有时候这样书写比模板字符串或者+拼接 看上去更直观，书写更有趣😏

2. ANSIS 4.0 - 终端调色盘 ​

支持 Bun, Deno，体积和速度相比 chalk 要快。

import ansis, { bold, fg, hex, red, rgb } from 'ansis'

console.log(ansis.bold('file.txt'))
console.log(red`Error: ${bold.cyan(file)} not found!`)
console.log(bold.bgRed`ERROR`)
console.log(fg(208)`Orange`)
console.log(rgb(224, 17, 95)`Ruby`)
console.log(hex('#FF75D1').bold.underline('Pink'))

🔧开源工具&技术资讯 ​

3. uni-app x 支持鸿蒙 ​

至此，uni-app x 已经完成Android、iOS、鸿蒙、Web、微信小程序等主流平台全覆盖。

虽然但是，低成本的开发多端，uni-app 仍是一个很不错的选择👍🏻！

4. color-convert ​

颜色转换函数。

import convert from 'color-convert'

convert.rgb.hsl(140, 200, 100) // [96, 48, 59]
convert.keyword.rgb('blue') // [0, 0, 255]

支持在 rgb、hsl、hsv、hwb、cmyk、ansi、ansi16、 十六进制字符串和 CSS 关键字之间转换所有方式。

收藏！

5. mono-jsx - 服务器端 JSX 运行时 ​

服务器端 JSX 运行时，无需构建步骤即可将 <html> 直接返回

// app.tsx

export default {
  fetch: req => (
    <html>
      <h1>Welcome to mono-jsx!</h1>
    </html>
  )
}

🤖AI工具&资讯 ​

6. LinkSumm - AI 总结网页内容 ​

直接粘贴 URL 链接即可，多模型可选。

😛趣图 ​

⭐️强力推荐关注 ​

周刊部分内容来源如下渠道，推荐大家关注。

• 阮一峰: 科技爱好者周刊 - 记录每周值得分享的科技内容，周五发布
• 前端 RSS - 根据 RSS 订阅源抓取最新前端技术文章
• FRE123 技术周刊精选 - 技术周刊精选推荐信息流