本周 React #267 : Bun, Next-Intl, Grab, Aria | Worklets, Teleport, Voltra, AI SDK, Screens | State of JS, Temporal
Source: Dev.to
大家好！
你们得习惯了：又是一周充满 AI 内容。从 MCP 到 Agent Skills 再到 AI 专用 CLI，我们已经不知道该往哪儿转了。
我们很高兴再次在 State of JavaScript 2025 调查中位列前 5 名通讯。感谢你的信任！
顺便说一下，我们很想听到你的反馈——你喜欢这份通讯的哪些方面，2026 年我们还能怎样改进？只要 回复 即可告诉我们！ ❤️
💡 订阅 官方通讯，每周收到一封邮件！
React Performance, v2
让 React 应用在关键地方更快。
来自 Steve Kinney 的高级性能课程，专注于诊断真实瓶颈并使用现代 React 19 模式修复缓慢、卡顿的 React 应用。
- 🚀 现代 React：Suspense、transitions、deferred values、hydration、server actions
- 🔍 更快调试：使用 React DevTools 与 Profiler 找到不必要的重新渲染
- 🧠 智能优化：Memoization、virtualization、code‑splitting、optimistic UI
- ⚡ 流畅体验：了解 React Fiber 如何对工作进行优先级排序，以保持应用响应
⏱ 4 + 小时 • ⭐ 4.8 评分
🏫 来自 Frontend Masters
快速链接与要点
- 💸 PostHog – 1 年代理的 8 条经验教训
- 👀 React DOM PR – 支持
SubmitEvent.submitter - 👀 React.dev PRs – 重构
useOptimistic、useActionState和useEffectEvent的文档 - 📜 React 的 ViewTransition 元素 – Chris Coyier 对比 “ 与原生
document.startViewTransition()API - 📜 为什么 Inngest 从 Next.js 迁移到 TanStack Start – 将本地开发时间缩短了 83 %
- 📜 逆向工程 Figma Make – 从二进制
.fig文件中提取 React 应用 - 📜 GitHub Copilot CLI 的动画 ASCII 横幅 – 使用 React Ink 将可靠的动画组件渲染到终端 UI
- 📜 AI 能真正调试复杂的 React/Next.js 问题吗？ – Claude Opus 只修复了 3 个真实 bug 中的 1 个
- 📜 React 设计系统库 MCP – 利用实验性的 Storybook MCP 服务器
- 💸 大规模构建 AI 语音代理 – ElevenLabs 的高管实战手册
软件包与发行版
| 软件包 | 版本 | 亮点 |
|---|---|---|
| Next Intl | 4.8 | 预编译 → 更小的包体（预编译 ICU 消息） |
| Bun | 1.3.8 | Bun.markdown API + Bun.markdown.react() – 比 React 替代方案更快 |
| React Grab | 1.0 | 直接从网站为编码代理选择上下文 – 提示速度提升至 3 倍 |
| shadcn/ui | – | RTL 支持，统一的 Radix UI 包 |
| React Aria | 1.15 | 新的 render‑prop、Agent Skills、失焦时约束日期 |
| Gatsby | 5.16 | 新增对 React 19 和 Node 24 的支持 |
| Rspress | 2.0 | 文档框架 – 主题样式、AI 原生、Shiki 高亮、性能优化、新插件 |
| React Three Fiber | 10.0 alpha | 向后兼容，WebGPU 支持，TSL 钩子，新调度器 |
| Travels | 1.0 | 快速、框架无关的撤销/重做库，提供 React 集成 |
| Prefill | – | 为 React 组件提供偏函数应用 |
| Meteor | 3.4 | Rspack 集成，构建速度提升 4 倍，包体缩小 8 倍，扩展的打包功能 |
| ESLint React | 2.9 | 提取 React RSC 子插件，新 RSC 预设 |
| Rsbuild Plugin React Router | 0.1 | 行为更接近 React Router 官方的 Vite 插件 |
| React Router | – | 🤖 Agent Skills |
| React Composition Patterns | – | 🤖 Agent Skills |
视频
- 🎥 Toby Mey – “Next.js 16 中应该把 Auth 放在哪里？”
- 🎥 Remotion – “使用 AI 创建动态图形 – 初学者简易教程”
💸 赞助
Meticulous – 自动化端到端 UI 测试
仍在手动编写测试吗？Notion、Dropbox 和 LaunchDarkly 已经采用了一种他们无法想象没有的全新测试范式。由前 Palantir 工程师打造，Meticulous 能自主创建一个持续演进的端到端 UI 测试套件，实现几乎全面的覆盖，且开发者无需投入任何努力——这是其他任何方式都无法实现的。
工作原理
- 每次测试运行都实现几乎全面的覆盖
- 无需创建测试
- 无需维护（真的）
- 零 flaky（确定性浏览器）
🤨 好奇吗？ 预约了解更多
React Native 多线程幕后
Vision Camera V5 × React Native Worklets – Worklets 已从 Reanimated 中抽离，成为一等的多线程原语。它们已集成到即将发布的 Vision Camera V5 中，使实时帧处理系统能够直接在 Camera 线程上运行。
- 📦 Worklets 0.8 – Bundle Mode 预览 – 允许在 worklet 中使用第三方库和网络请求（需自行开启，未来可能成为默认）。
💸 停止手动搜索组件 – 在 Radon 中尝试 Element Inspector，让 React Native 应用开发更快。
文章
- 📜 构建 Voltra：渲染器 – Widgets & Live Activities 库的创建者讲解了受 React DOM SSR 启发的自定义渲染器。
- 📜 2026 年提升移动应用下载量和留存率的 5 条建议
包
- 📦 Teleport 1.0 – 为 React Native 提供真正的原生 portal（相当于
ReactDOM.createPortal的移动端实现），支持视图重新父化、复用和预渲染。跨平台，同样支持 Web。 - 📦 Screens 4.21 – Android 堆栈屏幕预加载，iOS xcassets 图标目录支持关键导航 UI 元素。
📦 发布与工具
-
Xcode 26.3 RC – 解锁代理式编码的强大能力。
- 如果你不想把 Xcode 当作 IDE 使用，仍然可以利用全新的 Xcode MCP 以及它的 RenderPreview 工具，为你的 AI 提供视觉反馈（SwiftUI 预览；可能不适用于 RN 视图）。
-
Agent‑Device – 用于 AI 代理控制 iOS 与 Android 设备的 CLI。
- 相当于 Vercel 的 agent‑browser 在移动端的实现。计划后续支持 TV/桌面应用。
-
AI SDK Profiler – 新的 Rozenite DevTools 插件。
- 让你能够检查来自 RN AI SDK 的 OpenTelemetry span。
-
AI SDK 0.12 – 包含 Profiler 插件、AI v6、工具调用以及对 Llama 模型的重新排序功能。
-
Tamagui 2.0 RC – 面向 React 的通用样式库。
- 更加稳定、易用、文档完善、速度更快，且功能完整。
-
Uniwind 1.3 – 支持 data 属性。
-
Superconfig – 使用 Nitro，速度比
react-native-config快 18 倍。 -
Callstack – 从零实现 Android TurboModule（视频）。
-
React Native Live – Infinite Red 推出的全新每月直播节目频道（视频）。
-
Beto – “你是否泄露了环境变量？React Native + Expo”（视频）。
-
Simon Grimm – “2026 年你需要的 Expo Router 十大技巧！”（视频）。
-
RNR 352 – 与 Cedric van Putten 的 Expo 启动播客（podcast）。
🔀 其他
-
State of JavaScript 2025 – Survey Results
- React 和 Next.js 的使用率持续增长，但满意度在下降。
- Astro 和 Solid 等替代方案的满意度相对较高。
-
Implementing the Temporal proposal in JavaScriptCore
- JS Temporal API 很快将在所有浏览器中推出；Safari 是最后剩余的浏览器。
- 对 JSC（Safari、Bun）的实现已完成，但尚未合并。
-
Node.js Path Traversal: Prevention & Security Guide
- 解释如何通过不安全的路径输入（例如
http://localhost:port/images/../../etc/passwd）来保护你的 Node 应用。
- 解释如何通过不安全的路径输入（例如
-
Building a browser API in one shot
- 通过专家创建的优秀提示，Claude Opus 可以一次性生成一个体面的 IndexedDB TypeScript 实现。
-
Astro 5.17 – 开发工具栏位置、分区 Cookie、异步文件加载解析器。
-
Turborepo 2.8 – 支持 Git worktree、Agent 技能、AI 驱动。
-
Babel 7.29 – 最后一个 Babel 7 小版本。
- Babel 8 已在 RC 中宣布，目标是易于采用且仅支持 ESM。
-
npmx – 一个快速、现代的 npm 注册表浏览器。
🤭 趣味
(未列出项目)
感谢阅读！如果您喜欢本期内容，欢迎与您的团队分享。
注意： iOS xcassets 图标目录已集成到 React Navigation 的原生标签页中。