前端周刊第 422 期

📢 宣言

我已经计划并开始实践：每周逐期翻译《前端周刊》内的每篇文章，并将其整理发布到 GitHub 仓库中，持续更深度的分享。
欢迎大家访问：https://github.com/tuaran/frontend-weekly-digest-cn
顺手点个 ⭐ star 支持，是我持续输出的续航电池🔋✨！

推荐语： 本期内容从 popover 新特性、HTML 未来调查，到 React 的粒度更新与 Nuxt SSR 性能优化，应有尽有。无论你是 CSS 魔术师、React 工程师，还是正在找寻新技术风口的探索者，这期周刊都值得你细细阅读。

博主点评： 我们正处在一个「工具演进+标准重构」的前端关键节点：Popover、shape()、scroll-driven UI、React RSC 等新趋势悄然落地。本文精选内容不仅覆盖了重要发布，还囊括实战演示、标准动态与框架演进。记得收藏，不然很快就跟不上节奏了！

🧭 Web 开发

• popover=hint 是什么？：探索 HTML 中 popover 的新特性及其增强提示体验的方式
• 性能鸿沟如何弥合：前后端工程师必须联手：分析前后端在性能优化中的分工与协作策略
• 影响 HTML 2025 的走向：欢迎参与设计调查：HTML 标准的未来，由你共创
• 什么是 JSON Web Token（JWT）？：用通俗语言解释 JWT 的工作机制与用途
• 一切都关乎可访问性焦点与 Compose：聚焦 Jetpack Compose 的可访问性焦点处理

🧪 Demo 演示

• 列表动画重排：View Transition + Kick Flip：用现代动画 API 实现酷炫的列表重排
• 我们研究了100个开发者工具落地页，2025年真正有效的设计长啥样？：总结开发者工具落地页的设计规律
• 用 React-Three-Fiber 实现动感图像动画：三维动效与 React 的融合演练
• Three.js 实例化渲染：同时渲染多个对象：提升 WebGL 渲染性能的利器

🚀 新版本发布

• React Native 支持 Node-API：React Native 跨语言扩展的新里程碑
• NuxtLabs 正式加入 Vercel：前端生态进一步融合，加速 Jamstack 落地
• Stack Overflow 的新时代：AI 时代下的 Stack Overflow 战略变革

🎨 CSS

• 用 :has() 重构 Every Layout 侧边栏并优化选择器性能：现代选择器带来的新布局思路
• 深色模式邮件设计指南与最佳案例：教你打造适配暗色主题的邮件模板
• 获取元素在父元素中的索引位置：CSS 中也能获取索引位置的小技巧
• 滚动驱动的粘性标题效果：打造随滚动变化的标题效果
• CSS Shape 的进阶玩法：shape() 的闭合与移动操作：继续探索 shape() API 的强大能力
• 光影设计：CSS 中的 3D 视觉魔法：让光照为你的页面带来真实空间感

💡 JavaScript

• 2025年5月 TC39 全体会议总结：前端标准的下一步走向
• 2025 年了，jQuery 还有必要用吗？：一场经典库的存废讨论
• Patreon 国际化改造背后的4个“翻译不了”的词：语言背后的文化与设计挑战
• 后 React 世界中，Hono 给微框架指出了新路：轻量框架的新可能性
• new Date("wtf")：你真的了解 JS 日期对象吗？：用互动问答挑战你的 Date 知识

📚 理论探讨

• JavaScript 的作用域提升机制是坏的？：对传统编译优化的一次质疑
• JS 中 string.slice() 有毒？：深入探讨 slice 的潜在坑
• JavaScript 错误处理完全指南：异常处理从入门到进阶

⚛️ React 相关

• 借鉴 Clojure，React 实现更细粒度更新：用函数式思维优化组件更新
• 用代码讲述 React 的历史：回顾 React 的演进之路
• 如何测试 React Server Component：测试 RSC 的实用方法与最佳实践
• React Bits：面向创意开发者的动画组件库：用最小成本做出视觉吸引力强的动画
• React + TypeScript：写出更好代码的 10 个模式：实用的工程化实践总结
• React Router 的新治理与 Server Component 支持：前端路由系统的新阶段

🍃 Vue 相关

• 优化 Nuxt 的服务端渲染（SSR）性能：让 Nuxt 页面加载飞起来
• Nuxt 的未来会怎样？：社区对框架演进方向的深入讨论