🌐 今日要闻
打破信息壁垒，走近全球前端。Hello World 大家好，我是林语冰。
欢迎阅读《Web 周刊》，上周 Web 开发圈的主要情报包括：
- ⚡️ 尤大官宣 Vite 8，第一个 Rust 驱动的稳定版本正式发布
- ✨ React 官网重写了 2 个 Hooks 文档，我学不动了
- 🤝 谷歌诚邀大家测评
focusgroup，"后 HTML5 时代"的新功能 - 📦 全新的 npmx 注册源网站上线，npm 官网惨遭"降维打击"
PS：本文附带甜妹解说的动画视频，粉丝请搜索哔哩哔哩@Web情报局。
🎉 每周热搜
Rolldown + Vite 稳定版首发
Vite 是 GitHub 第一 构建工具，提供了基于原生 ESM 模块的开发服务器，和打包优化的构建功能。
Vite 团队官宣 Vite 8 正式发布，这是 第一个 使用 Rust 打包器 Rolldown 驱动的 稳定版本，标志着 Rust 催生的"前端工业革命"日益流行。
Vite 8 除了把 esbuild + rollup 换用为 Oxc + Rolldown，该主版本还有下列亮点。
首先是开发体验，新增 Vite Devtools 开发工具，可以直接从开发服务器调试；支持浏览器控制台转发到 CLI 终端，方便 AI 分析。
然后，内置了 TypeScript 功能，支持 tsconfig path，解析路径别名；支持 emitDecoratorMetadata 选项，无需安装外部插件。
此外，@vitejs/plugin-react v6 主版本更新，集成 Oxc，不再依赖 Babel；.wasm?init 导入可以在 SSR 环境运行。
最后，新增 Vite Plugin 插件官网，方便大家搜索 Vite 生态的插件。
Vite 8 之前，为了避免反复造轮子，Vite 开发时使用 esbuild 快速编译，构建时使用 rollup 打包优化，但双打包机制"天衣有缝"，两种流程始终存在 不一致性。
为此，尤大组建 Rolldown 团队，换用 Rust 编写的 Rolldown 统一流程，它既兼容 Rollup 插件 API，又媲美 esbuild 的性能，构建速度暴涨 10 倍。
直至今日，我们终于拥有基于 Rust 的打包神器！
感谢尤大和 Vite 团队，感谢 esbuild、rollup 和所有社区贡献者～
🛜 官方情报
Vercel 重定向算法优化
Vercel 分享了一篇重定向算法优化的官方博客。
Vercel 采用 JSON 文件、Bloom filter 布隆过滤器，sharding 分片和二分搜索等优化技术持续迭代，实现了低延迟的百万静态重定向。
React 文档重写
React 官网中，useActionState() 和 useOptimistic() 这两个 Hooks 的文档重写了。
useActionState() 涵盖了表单集成、错误处理等内容，useOptimistic() 渐进式教学，提供了从简单按钮高到复杂购物车的示例。
这部分文档还更新了互动教程，可以边玩边读。
JS 七年之痒
Patreon 耗时 7 年把百万行 JavaScript 代码迁移到 TypeScript，历经三大时期。
前期，团队授权引入 TS，自愿使用；中期，团队手动迁移，奠定类型良好的基建；后期，团队采用 ts-migrate codemods（代码批改工具），进一步借助 AI 肌肉自动批改，程序员负责复杂架构和最终审核，有组织地迁移。
如果你也有大型项目想要重构，可以借鉴这种渐进式的迁移方案。
focusgroup 新功能公测
无障碍的常见场景之一，是使用 Tab 和方向键在子项中移动聚焦。现存技术的痛点在于，这需要开发者编写 JS 手动管理 tabindex。
目前，不同大厂的 UI 库反复造轮子，各自攻克最后焦点记忆、忽略禁用项、动态子项等技术难关。
为此，微软发明了 focusgroup 新特性，联手谷歌和 OpenUI 迭代这个"后 HTML5 时代"的新功能。
focusgroup 目前处于实测阶段，它可以为 tablist / menu 等复合部件添加键盘方向键导航功能，这是一种更符合人体工程学的纯 HTML 声明式魔法，可以消灭 JS "代码屎山"，简化无障碍开发。
html
<div focusgroup="toolbar" aria-label="Text formatting">
<button type="button">👍</button>
<button type="button">⭐</button>
<button type="button">❤️</button>
</div>现在，谷歌和微软诚邀大家测评 focusgroup，它们将根据大家的测评反馈继续完善这项新技术。
🚦 版本更新
Lightning CSS v1.32
Lightning CSS 是一个用 Rust 编写的 CSS 解析器 & 压缩神器，被 GitHub 第一 构建工具 Vite 采用，速度比用 JS 编写的同款工具快 100x 倍。
Lighting CSS 发布了 v1.32 次版本：
- 支持解析器标记
@import为外部导入，不会被打包 - 允许访问者添加依赖，实现文件监视或缓存
- 支持 CSS
mix-blend-mode新属性
Electron v41.0
Electron 是 GitHub 第一 跨平台桌面应用框架，地表最强 IDE VSCode 就是用它写的。
Electron 发布了 v41 主版本，主要包括：
- 新增了 MacOS 应用新功能，比如支持嵌入 ASAR 完整性摘要，提升安全性；新增
--disable-geolocationflag，禁用定位服务等 - 技术栈升级，Chromium 升级到 146.0.7680.65，Node 升级到 24.14
- 支持通过
login事件，实现 WebSocket 认证
reveal v6.0
reveal 是 GitHub 第一 HTML 幻灯片框架，允许我们使用 Markdown + Web 技术栈来写 PPT。
reveal 发布了 v6.0 主版本，主要包括：
- 使用 Vite 替代 Gulp 作为构建工具
- TypeScript 类型开箱即用，无需安装类型开发依赖
- 新增
@revealjs/react模块，支持使用 React 组件制作 PPT
Astro v6.0
Astro 是 GitHub 第三 的全栈框架或通用 SSG（静态站点生成器），它允许我们在一个框架中编写所有主流前端框架的组件，包括 React / Vue / Svelte 等。
Astro 发布了 v6.0 主版本，主要包括：
- 重写
astro dev，借助 Vite Environment API，开发服务器可以跑在非 Node 的生产运行时，包括 Cloudflare Workers，Bun 等，统一开发体验和生产环境 - 新增 Fonts API，支持从本地文件或谷歌等供应商配置字体
- 实时内容合集稳定，在请求时获取内容，发布后立即更新，无需重建
- 内容安全策略 API 稳定
- 实验性支持基于 Rust 的新编译器，未来有望取代基于 Go 的编译器；顺便一提，React 也爆料将上线基于 Rust 的 React Compiler
Prisma v7.5
Prisma 是 GitHub 第一 NodeJS ORM（对象关系映射），发布了 v7.5 次版本，支持 SQL 数据库的嵌套事务回滚行为，如果外部事务失败，内部嵌套事务也会回滚。
另外，Prisma 官网重做了。
Preact v10.29
Preact 是拥抱 DOM 规范的 React 替代品，发布了 v10.29 次版本，实现了 flushSync。
💡 前端信息差
Next 升级后遗症
去年，Next 爆出核弹级安全漏洞后，就鼓励用户赶快升级 fix bug 嘛。
结果嘞，部分用户反馈升级到 Next v16 后，请求跟延迟反而增加了。
由于 Vercel 是按请求收费，请求增加后，成本也会递增，导致经费增长、性能负增长的"消费降级"现象......
因此，部分用户选择回退到了 Next v15，部分用户被退回了 25% 的平台费用。
今年二月底，Next 团队终于找到"万恶之源"，这似乎与预请求有关，并且已经合并了实验性补丁 prefetchInlining flag。
js
// next.config.js
module.exports = {
experimental: {
prefetchInlining: true,
},
};如果你升级到 Next v16 后发现成本增长，但性能反而负增长，可以参考这个 GitHub issue，重新制定技术方案。
Fastify 之父分享 Skills
最近 AI 编程中 Skills 的应用挺火的，很多大神纷纷分享自己的 Skills。
Fastify 之父也是 Node 核心贡献者，也分享了自己的 Skills：
- Node 最佳实践，事件循环和异步错误处理等
- TypeScript 高级类型系统和
any消除等 - ESLint v9 扁平化配置等
最近 Node 开发圈爆发了抵制 AI 提交 Node 源码和开源贡献的反 AI 运动，但目前适当使用 AI 辅助编程还是可行的。
🛠️ 工具推荐
npmx：现代化 npm 注册搜索源
npmx 是一个类似 npm 官网的现代搜索源，旨在优化 npm 官网的设计和开发体验。
npmx 目前处于 Alpha 阶段，我替大家进行了人体试验，目前感觉良好。
首先，npmx 支持更机智的模糊搜索算法，比如搜索"Vite JS"，npm 会搜索出不准确的结果；而 npmx 即便输入的模块名不完全匹配，也能智能搜索出目标模块。
npmx 还支持模块 PK 跑分，帮助开发者挑选模块，比如这是 Vite vs webpack 的"对照实验"。
UI 和无障碍方面，现代化的 npmx 支持深浅模式和自定义主题等。
此外，npmx 支持在线查看模块打包后的源码，不需要我们自己去 GitHub 下载源码打包。
数据可视化方面，我们还可以在线免费下载统计图表，比如本文的这张 Vite vs webpack 的本月下载量。npmx 还支持编辑标注截图，用来发帖或写博客都挺高效的。
npmx 项目由 Nuxt 团队主席提出，团队成员包括 antfu 等前端大神。npmx 采用 VoidZero 和 Vite+ 全家桶构建，提供了更现代化的 UI 设计跟更棒的开发体验，还有更多隐藏功能，欢迎大家测评体验，真的超好用。
🙏 特别鸣谢
以上就是本期《Web 周刊》的全部内容了。
👍 感谢大家按赞跟转发分享本文，你的手动支持是我坚持创作的不竭动力喔。
😘 已经关注我的粉丝们，我们下期再见啦，掰掰~~
