AI 摘要： 本期 Node Weekly 聚焦 Node.js 生态系统的最新动态与工具，涵盖了 PHP 与 Node.js 的集成、AI 技术在开发中的应用、以及多个实用工具和库的更新。文章详细介绍了 php-node 模块如何实现 PHP 应用在 Node 环境中的运行、多个 Node.js 相关工具如 ESLint、Bun 的新功能。此外，还包括了 JavaScript 领域的最新资讯，如 TC39 提案进展和 Temporal API 的潜力。

1. 简讯
• php-node：PHP 与 Node.js 的新型集成：介绍 php-node 作为 Node 的原生模块，允许在 Node 环境中运行 PHP 应用。应用场景：迁移遗留 PHP 应用、构建 PHP/JS 混合应用，或在 Node 应用中调用 PHP 功能（如 WordPress 集成）
• Joyee Cheung 分享关于 Node 中 CommonJS 与 ESM 桥接的演讲幻灯片。
• OpenJS 基金会现在是其旗下 40 多个 JavaScript 项目的 CNA，包括 ESLint、Express 和 Electron。
• SQLite-JS 扩展允许使用 JavaScript 编写自定义 SQLite 函数。
• DigitalOcean 推出 Node 驱动的 MCP 服务器，支持通过 AI 代理（如 Claude）管理托管应用。
2. 技术文章与教程
• 使用 Node.js 和 Llama Stack 实施 AI 保障措施： Llama Stack 是 Meta 用于在 Node、Python、Swift 或 Kotlin 中构建 AI 应用程序的框架。
• 在 Express 中管理功能标志 (Trunker)：介绍 Trunker 作为 Express 中间件，用于实现功能标志管理。
• 使用可选链编写更可靠的 JavaScript：讲解可选链的使用及其优势。
• 构建 Linux Electron 应用：讨论 Electron 跨平台特性及 Linux 平台特定问题。
• Node.js 生产级日志记录 (Pino)：介绍使用 Pino 进行高效日志记录。
3. 代码与工具
• qnm：CLI 工具，方便探索 node_modules，提供模糊搜索及空间占用分析功能。【感觉还是 antfu/node-modules-inspector 香】
• Zigar：在 Node 和 Electron 项目中使用 Zig（C/C++ 超集）代码。
• 🤖 OpenAI 客户端 5.x：从 Node 使用 OpenAI 模型 ——OpenAI 官方 JavaScript 库的最新版本，适用于其各种 API，现已支持其所有最新模型和实时 API（ v5.0 更新日志 ）。支持 Deno 和 Bun。
• Opossum 8.5：异步函数断路器，支持超时及错误阈值设置。
• Beachpatrol：CLI 工具，基于 Playwright 实现浏览器自动化，支持 macOS 和 Linux。作者：Sebastian Carlos。
• 其他工具更新：包括 ESLint v9.28.0（增强 TypeScript 支持）、Bun v1.2.15（新增安全审计工具）、Ink 6.0（支持 React 19）、pdf2html 4.0（用 Apache Tika 和 PDFBox 将 PDF 转换为 HTML）
4. JavaScript 领域动态
• TC39 第 108 次会议：多项提案进展，如 Seeded Pseudo-Random Numbers 进入 Stage 2，Error.isError 进入 Stage 4。
• Stack Overflow 年度开发者调查开启第 15 年。
• 探讨即将推出的 Temporal API，如何解决 JavaScript 中日期和时间处理问题。
• Sean Gillespie 正在思考高效 monorepo 的要素。

Platformatic Blog

Seamlessly Blend PHP with Node.js

@platformatic/php-node integrates PHP into Node.js apps for a unified developer experience

AI 摘要：本文介绍了 Photoshop 最新发布的 Android 应用，在 Beta 测试阶段所有功能均免费开放，为用户提供了桌面级图像编辑体验，集成了 AI 驱动的创意工具，并针对移动端进行了优化，适合从新手到专业用户的多样化创作需求。文章还详细说明了设备要求、功能亮点及获取方式，提醒用户未来部分高级功能可能转为订阅制。

小众软件

Photoshop 发布 Android 应用，测试期间所有功能全免费 - 小众软件

在今年2月份推出 iOS 版本客户端之后，Photoshop 终于发布了 Android 应用，并且测试期间全免费。@Appinn

Ana Tudor 🐯🖤🌻 (@anatudor)：Made a little thing on
@CodePen: pure #CSS scroll controlled swipe transition https://codepen.io/thebabydino/pen/azObZOe

Note how the swipe is always clockwise, regardless of scroll direction and how the text fades in after the swipe.

Inspiration https://x.com/avanderpotte/status/1923382432784412771 (via @codrops)

AI 摘要：本文详细介绍了如何在 Next.js 应用中导入和使用 SVG 文件，探讨了多种方法及其优缺点，旨在帮助开发者在 2025 年的技术环境中更高效地处理 SVG 资源。文章从基础导入方式到高级优化技术，提供了全面的指南，特别指出了使用 next/image 组件的局限性，例如无法直接设置 SVG 的填充颜色等问题，并给出了相应的解决方案。

LogRocket Blog

How to import SVGs into your Next.js apps: A 2025 guide - LogRocket Blog

This article explores the different methods you can use to import and use SVGs in a Next.js application.

AI 摘要：本文由 Amit Sheen 撰写，详细介绍了如何使用 CSS 和少量 JavaScript 创建一个交互式的聚光灯效果（Spotlight Effect）。该效果通过鼠标位置驱动 CSS 自定义属性，结合背景渐变、滤镜和混合模式等技术，实现动态、流畅的视觉交互。文章从基础设置开始，逐步深入到复杂的“粘性”效果、图案设计、移动端适配以及主题切换等内容，旨在启发开发者探索 CSS 的创意潜力，同时注重用户体验和无障碍访问。

Asuka小能猫 (@AsukaOdysseus)：李飞飞团队开源了可商用的高斯喷溅web渲染器。
gaussian splatting 是目前3d场景重建最前沿的方法，效果好、速度快、只需要图片就能重建，去年开始大火，学术界机器人/自动驾驶/世界模型/视频生成都有很多应用。
国内在这块的application级别的应用几乎是空白。

sparkjs.dev

An advanced 3D Gaussian Splatting renderer for THREE.js

这个项目已经 Vibe 了 9K 行了，是时候重构一波了。
现在连 Live photo 都支持了。
https://github.com/Innei/photo-gallery

🧵 Thread • FixupX

拾一.ens18 (@__oQuery)

这个项目已经 Vibe 了 9K 行了，是时候重构一波了。

现在连 Live photo 都支持了。

https://github.com/Innei/photo-gallery

AI 摘要：本文介绍了从 Chrome 138 版本开始，Chrome 扩展中用户脚本（chrome.userScripts API）的启用方式发生了变化，旨在增强安全性和提供更精细的用户控制。过去依赖全局开发者模式开关的方式存在安全风险、功能过载和企业管理难题，现在转变为逐个扩展的“允许用户脚本”开关，用户可以在扩展详情页单独控制每个扩展的用户脚本权限。这一更新基于开发者社区的反馈，旨在提升安全性和用户体验，同时为管理员提供了新的管理策略。

Chrome for Developers

Enabling chrome.userScripts in Chrome Extensions is changing  |  Blog  |  Chrome for Developers

We are making a series of changes to the chrome.userScripts API.

AI 摘要：本文介绍了八个鲜为人知但功能强大的 HTML5 元素，这些元素为常见的 Web 开发问题提供了原生解决方案，减少了对 JavaScript 和第三方库的依赖。作者强调了使用原生 HTML 元素的优势，包括提高可访问性、语义化以及简化代码，同时也指出了这些元素的局限性，鼓励开发者在选择工具前了解这些内置选项。

1. <dialog> 元素：原生模态窗口

介绍 <dialog> 元素用于创建模态窗口，浏览器自带焦点管理、背景渲染和键盘可访问性支持，提供了基本用法和样式化代码示例。提到其浏览器支持情况（2022 年后主流浏览器均支持）和 iOS Safari 的历史兼容性问题，建议复杂模态仍需专用库。
2. <details> 和 <summary> 元素：原生手风琴
介绍用于创建可折叠内容的手风琴效果，浏览器内置切换功能和可访问性支持。提供样式化示例和嵌套导航的应用场景，指出其动画效果的局限性。
3. <datalist> 元素：原生自动补全
介绍用于表单输入自动补全的元素，支持用户自定义输入。提供颜色选择器的创意用法和 JavaScript 增强示例，指出其样式定制的限制。
4. <meter> 元素：语义化度量显示
介绍用于显示范围内值的元素，浏览器根据阈值自动调整颜色，适用于仪表盘等场景。讨论其语义价值和样式限制。
5. <output> 元素：动态计算结果
介绍用于显示计算结果的元素，与输入元素关联提高可访问性。提供抵押贷款计算器的实际案例，强调其语义意义和表单提交的适用性。
6. <mark> 元素：语义化高亮
介绍用于文本高亮的元素，默认黄色背景可自定义样式，适用于搜索结果等场景。强调其对屏幕阅读器的语义支持。
7. <time> 元素：语义化日期和时间
介绍用于表示日期和时间的元素，支持 ISO 8601 格式，方便搜索引擎和浏览器扩展使用。提供多种格式示例和相对时间更新的 JavaScript 代码，适用于博客和新闻网站。
8. <figure> 和 <figcaption> 元素：语义化图片标题
介绍用于图片或其他独立内容单元的元素及其标题，适用于内容管理系统。提供 CSS 样式化示例，强调其对可访问性的提升。

DEV Community

HTML5 Elements You Didn't Know You Need

As you know, we love unusual tech at Lingo.dev. So when in my last essay, David commented he was...

AI 摘要： 本期《React Status》 (2025年5月28日，第430期) 是一份聚焦 React 生态系统的技术资讯简报，涵盖了 React 19 的最新特性、工具库更新、框架对比以及社区动态。文章详细介绍了 React 核心概念的可视化讲解、TanStack Router 的独特优势等内容，同时提供了众多 React 相关工具和库的更新信息，如 Docusaurus 3.8、ReactJust 等。此外，还包括了 JavaScript 生态的最新动态，如 JavaScript 30周年回顾和 TypeScript 的 Go 移植进展。

1. 简讯 (IN BRIEF)
• React 即将迎来12周年生日（5月29日）。
• Storybook 9.0 刚发布，将在下期详细报道。
• React Router 提供对 RSC (React Server Components) 的预览支持。
• Astro 5.8 发布，放弃对 Node v18.20.8 之前版本的支持。
• Vercel 可能将弃用 Edge Functions，转向 Fluid compute。

2. 教程与案例
• 使用 GitHub Copilot 构建 React 应用：Kedasha Kerr 提供了详细指南和视频，展示如何利用 Copilot 快速构建现代 JavaScript 应用。
• React 元框架的问题与重建：Redwood 团队分享了从头开始重建 RedwoodSDK 的经验，强调从第一性原理出发解决问题。
• AI 辅助构建物理角色控制器：Ian Curtis 结合 React Three Fiber、Three.js 和 Rapier，展示了如何构建物理角色控制器，并提供在线试玩链接。
• 其他内容：包括 React 并发渲染的故事、Expo 实时音频处理、React 新 Activity 组件的性能提升，以及 Next.js 集成 Google 登录的简易方法。

3. 代码、工具与库：
• Docusaurus 3.8：面向文档的静态站点生成器，带来构建性能提升及“未来标志”功能，允许提前体验 v4 特性。
• ReactJust：一种无框架的 Server Components 方案，适合不想使用 Next.js 或 React Router 的开发者实验 RSC。
• Rockpack 6.0：React 应用启动工具，旨在最小化项目设置时间，支持服务端渲染、打包、linting 和测试，已更新至 React 19。
• 其他更新：包括 react-native-alert-queue、React DayPicker 9.7、React Spring 10.0、React Native Reanimated 4.0 Beta 4 等工具和库的最新版本发布。

4. JavaScript 生态动态：
• Deno 团队为 JavaScript 30周年制作了历史时间线。
• SolidJS 创作者发布视频对比 React、Angular、Vue、Svelte 和 Solid 的框架方法。
• Google 发布 Gemini 和 Vertex API 的官方 JavaScript/TypeScript SDK v1。

AI 摘要：本文探讨了如何通过 CSS 样式化图像的 alt 文本，以提升图像加载失败时的用户体验。作者 Andy Bell 详细介绍了如何通过对 <img> 元素应用样式来优化 alt 文本的显示效果，并结合 JavaScript 和渐进增强技术为加载失败的图像添加额外的视觉效果，强调了编写高质量 alt 文本的重要性以及关注用户体验的必要性。

Piccalilli

You can style alt text like any other text

A fun little side quest to show you how applying styles to alt text can really elevate your user interface.