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

💬 推荐语
本期围绕"工程依赖、平台边界与新能力落地"。Web 开发部分从 Web 依赖体系的结构性问题、浏览器 API 与 Web API 的边界谈起,延伸到反框架主义(优先原生 Web API)、AI 时代的界面与交互范式(AG-UI),以及 Tailwind 团队在 AI 影响下的组织变化观察;同时补上按钮这一"最基础控件"的工程化最佳实践。工具与 Demo 则一边回顾 ViteLand 生态动态、讨论 npm 的潜在安全强化路径与 Bun 的基准表现,一边用加速度计动画与可无限平移画布、像素到体素的视频特效给到可直接复用的灵感。CSS 与 JavaScript 栏目覆盖 anchor positioning、@scope、视图过渡与 Temporal 等新能力,以及一则 jsPDF 高危漏洞提醒,适合年初做一次"能力盘点 + 工程卫生"更新。
🗂 本期精选目录
🧭 Web 开发
- Web dependencies are broken. Can we fix them?:Web 依赖体系正在"结构性失灵",文章从版本、发布与可用性角度讨论为什么会这样,以及可能的修复方向。
- Not All Browser APIs Are "Web" APIs:并非所有浏览器提供的 API 都是"Web 标准 API",梳理概念边界与使用时的兼容性/可移植性风险。
- Don't ship another chat UI. Build real AI with AG-UI:别再复制粘贴聊天框了------用 AG-UI 把 AI 能力做成更贴合任务流的真实交互。
- Anti-frameworkism: Choosing native web APIs over frameworks:"反框架主义"视角:在合适场景下优先选择原生 Web API,降低复杂度与依赖成本。
- Tailwind Creator Says AI Played a Role in Downsizing:Tailwind 作者谈 AI 在团队裁员/缩编中的影响,作为工具生态与行业变化的一个侧面观察。
- Building Better Buttons:从可访问性、交互细节到组件封装,系统讲清"把按钮做好"需要考虑的关键点。
- WASI 1.0: You Won't Know When WebAssembly Is Everywhere in 2026:WASI 1.0 的意义与趋势判断:到 2026 年 WebAssembly 可能"无处不在"但不一定被显式感知。
🛠 工具
- What's New in ViteLand: December 2025 Recap:ViteLand 2025 年 12 月动态回顾:生态进展、发布与值得关注的变化。
- How GitHub could secure npm:探讨 GitHub 还能如何加强 npm 的安全性(供应链、身份、发布流程等)。
- Bun Joins the Microservice Framework Benchmark: Surprisingly Fast JavaScript Runtime:Bun 参与微服务框架基准测试:从结果看表现亮眼,并讨论其适用边界。
🧪 Demo
- Beyond the Mouse: Animating with Mobile Accelerometers:不止鼠标输入:用移动端加速度计驱动动画交互的实现思路与注意事项。
- Infinite Canvas: Building a Seamless, Pan-Anywhere Image Space:实现可无限平移的画布/图片空间:坐标系、拼接与交互处理的完整拆解。
- How to Create a Pixel-to-Voxel Video Drop Effect with Three.js and Rapier:用 Three.js + Rapier 实现"像素转体素"的视频坠落特效,包含渲染与物理结合的关键步骤。
🎨 CSS
- Popover Context Menus with Anchor Positioning:结合 Popover 与 Anchor Positioning 实现上下文菜单定位,让弹层对齐更稳更易维护。
- 4 CSS Features Every Front-End Developer Should Know In 2026:面向 2026 的 CSS 新能力盘点(适合做团队知识同步与技术债清单)。
- How to @scope CSS Now That It's Baseline:当
@scope进入 Baseline 后,如何在项目中落地作用域样式与渐进增强。 - Future CSS: :drag (and Maybe ::dragged-image?):展望拖拽相关的 CSS 选择器/伪元素设想:
:drag以及可能的::dragged-image。 - Bad CSS-Dad Jokes (VI):Bad CSS Dad Jokes 第六弹:用冷笑话的方式记住 CSS 小知识。
- Responsive Hexagon Grid without Media Queries:不写媒体查询也能做响应式六边形网格:利用现代布局能力实现自适应。
- Effortless animations with CSS view transitions:用 View Transitions 做"几乎不费力"的过渡动画:从 API 到实践的简洁路径。
- Text Styles for this blog:一份"博客排版样式"实践记录:字号、行高、节奏与可读性权衡。
💡 JavaScript
- 2025 JavaScript Rising Stars:2025 年 JavaScript 生态"上升之星"榜单:用数据看趋势与工具热度变化。
- Streaming JSON in just 200 lines of JavaScript:用约 200 行 JS 实现 JSON 流式解析/处理:适合大数据量与边读边用场景。
- Critical jsPDF vulnerability enables arbitrary file read in Node.js deployments:jsPDF 的高危漏洞提醒:在 Node.js 部署场景下可能导致任意文件读取,需及时评估与升级。
- Date is out, Temporal is in:
Date的时代要过去了吗:用 Temporal 处理日期时间的优势与迁移建议。 - Simplifying JavaScript Prototypes in Constructor Invocation with Simple Words and Diagrams:用更直观的文字与图示解释构造函数调用时的原型链与
new行为,适合查漏补缺。 - React has finally solved its biggest problem: The joys of useEffectEvent:围绕
useEffectEvent讨论 React 对"闭包陈旧/副作用"痛点的改进方向与用法。 - Moving beyond RxJS: A guide to TanStack Pacer:走出 RxJS:TanStack Pacer 入门与对比,帮助评估新一代数据流/异步编排方案。