📢 宣言 :每周更新国外论坛的前端热门文章,推荐大家阅读/翻译,紧跟时事,掌握前端技术动态,也为写作或突破新领域提供灵感~
欢迎大家访问:github.com/TUARAN/fron... 顺手点个 ⭐ star 支持,是我们持续输出的续航电池🔋✨!
在线网址:frontendweekly.cn/

💬 推荐语
这一期有两条主线并行的感觉。一条是关于视觉与动效的边界:GSAP 的鼠标拖尾和滚动驱动 SVG 地图动画都在展示 Web 动画的上限在不断被抬高;CSS 居中在 2026 年的新解法、sibling-index() 的数学布局思维、跨文档 View Transitions 的隐坑,则说明 CSS 平台能力本身也在持续进化------而且这些进化的重点是让你少写 Hack,多写"本来就应该这样"的表达。
另一条主线是工程基本功的回潮:Blob API 的文件处理让前端不再绕道走、Agent-Ready Web 提醒你网站正在被模型消费而不仅仅是人类浏览、TypeScript 6.0 迁移要求整个团队重新审视 tsconfig、call/apply/bind 的内部机制让你从"会用"回到"真懂"、Angular Signal Forms 和 React useOptimistic 则在讲同一个道理------表单和异步状态不是"事件补丁",而是有结构的数据流问题。
如果把这一期压缩成一句话:前端的两端都在被重新定义------一端是视觉表现力的上限,一端是工程体系的底层,中间那块"过得去就行"的舒适区正在消失。
🗂 本期精选目录
🧭 Web Dev
- Testing Safari on a Budget:预算有限的情况下怎么测 Safari?这篇给出了务实方案,对独立开发者和小团队尤其值。
- Made With Gsap: Building a Fun Gravity-Based Mouse Trail:用 GSAP 实现带重力感的鼠标拖尾效果,把物理感受写进交互里。
- Creating Scroll-Driven SVG Map Animations with GSAP:滚动驱动 SVG 地图动画,适合数据可视化项目的交互动效参考。
- Howto Use the Blob API for File Processing, Downloads, and Memory-Safe Frontend Applications:Blob API 的文件处理、下载和内存安全实践,前端处理二进制数据不该每次都绕后端。
- Google wants to make the web agent-ready:Google 想让 Web 为 Agent 做好准备------你的网站正在被模型消费,而不仅仅是人类浏览。
- npm Invalidates Granular Access Tokens as Mini Shai-Hulud Sweeps the Registry:npm 大规模作废粒度访问令牌,安全问题值得所有依赖生态的开发者关注。
🎨 CSS
- The State of CSS Centering in 2026:CSS-Tricks 对居中的年度回顾,2026 年的居中已经远不是 flex/grid 二选一的问题了。
- Advanced Tree Counting: Mathematical Layouts With sibling-index() And sibling-count():sibling-index() 和 sibling-count() 带来数学级布局能力,CSS 正在长出真正的"数据结构感"。
- Cross-Document View Transitions: The Gotchas Nobody Mentions:跨文档 View Transitions 的那些隐坑,终于有人系统写了。
- Choosing CSS Selectors for Production: Specificity, Modern Pseudo-Classes, and Maintainable Styles:生产环境的 CSS 选择器该怎么选?从 specificity 到现代伪类到可维护性,一次性讲清楚。
- A few ways of specifying per-theme colours in only CSS:只用 CSS 就能实现多主题色彩配置的几种方式,轻量且务实。
💡 JavaScripts
- The History of Date in JavaScript:从 Date 的坑到 Temporal API 的诞生,理解了历史才能真正用好 Temporal。
- How to track user behavior with JavaScript (without bloating your site):不拖垮性能的用户行为追踪方案,适合对 bundle size 敏感的团队。
- cli-to-js --- Turn any CLI into a JavaScript API:把任意 CLI 工具转成 JavaScript API,命令行和代码的边界正在被重新打通。
- JavaScript Invocation Mechanics: Understanding call, apply, bind, and arguments from the Inside Out:call/apply/bind 的底层 invocation 机制,从"会用"回到"真懂"。
- Angular Signal Forms: From event pipelines to signal-driven state:Angular 表单从事件管道向 Signal 驱动的范式转换,对 Angular 生态是一次重要的写法升级。
- TypeScript 6.0 Migration: What Changed and How to Adapt Your tsconfig:TypeScript 6.0 迁移实战,tsconfig 有哪些变化、怎么适配,这是每个 TS 项目都绕不开的升级。
⚛️ React
- Rockpack --- a CLI that scaffolds a React + TypeScript project in one command:一个脚手架 CLI,一键搭建 React + TypeScript 项目,带 SSR、Webpack、ESLint 10、Jest 和 AI 友好的 CLAUDE.md,适合追求开箱即用的团队。
- React Server Components in TanStack:TanStack 生态里的 RSC 实践,不替你做架构决策,但给原语让你自己搭。
- How to build advanced forms in Next.js using a rule engine:用规则引擎在 Next.js 中构建高级表单,把表单逻辑从组件里抽出来,做结构化表达。
- React useOptimistic: Production Patterns for Instant UI Updates:useOptimistic 的生产级模式,让乐观更新的 UI 即响应用起来更稳、更可维护。
结语
本期最值得关注的是这种"两端分化"的趋势。视觉端,GSAP、CSS 新能力、View Transitions 在持续拓展表现力边界;工程端,Blob API、Temporal、TypeScript 6.0、Signal Forms、useOptimistic 在提醒我们------基础扎实才是持续交付的底牌。
不管你手里用的是哪个框架,第 467 期真正值得看的是:视觉表现力和工程体系这两端能不能同时握在手里,而不是二选一。