#优质博文 #CSS #TypeScript #前端 #类型安全 #工程化
The Multi-Repository TypeScript Problem

AI 摘要：本文深入探讨了在大型 TypeScript 项目、尤其是多团队、多仓库（polyrepo）架构下，如何在服务边界之间实现类型安全。作者通过剖析现有单仓库（monorepo）与多仓库在类型共享上的差异，提出了一套自动化提取、打包、共享和验证 TypeScript 类型定义的新思路，从而实现跨服务间类型兼容性检测，最大限度利用 TypeScript 本身的类型系统能力，实现 monorepo 式的类型安全体验。

1. TypeScript 项目架构对类型共享的影响
• 对比单仓库（monorepo）与多仓库（polyrepo）架构下服务间类型共享的简易性和复杂性
• 强调 monorepo 在类型共享上的先天优势，但多仓库在业务组织上的必要性

2. 跨仓库类型校验的实际挑战
• TypeScript 类型检查器需要获取完整工程上下文，但多仓库使类型定义分散
• 讨论依赖和类型递归拉取带来的复杂性，不同仓库可能存在同名、类似或依赖链深度不一的类型

3. 类型提取、打包和自动化流程
• 利用 ts-morph、SWC 等工具自动化精准地提取、分发类型定义
• 提出基于接口路由自动生成类型别名，解决多团队协作下类型命名不一致问题
• 持续集成（CI）流水线以独立项目方式聚合、校验和比对类型包，提高自动化校验覆盖面和准确率

4. 类型兼容与校验自动化策略
• 利用 TypeScript 类型赋值（assignability）规则进行自动验真，无需自定义冗余逻辑
• 构建临时 TypeScript 项目，自动加载各仓库导出的类型包，通过编译器 API 比对并提取错误
• 充分借力 TypeScript 编译器本身能力，让生态演进自然受益

5. 工程实践与系统扩展性
• 跨仓库类型校验架构具备良好的可扩展性和维护性
• 所有工程增强无需魔改 TypeScript，可高效适配未来升级

author Carrick

www.carrick.tools

The Multi-Repository TypeScript Problem

Navigating Type Safety Across Service Boundaries

#Newsletter #Node #JavaScript #前端 #TypeScript #AI
📢 Node Weekly #588

AI 摘要：本期 Node Weekly（第588期，2025年7月29日）带来了 JavaScript 生态的最新动态，内容涵盖众多 JavaScript 运行时历程的重要综述、TypeScript 与 Node.js 技术升级、安全及工具更新，以及业界有趣开发实践。文章帮助开发者全面了解前后端生态进展，关注实用工具及 AI 集成，并强调代码安全与生产力提升。

1. 生态与社区动态
• The many, many, many JavaScript runtimes of the last decade 长文回顾了近十年间主要 JavaScript 运行时（Runtime）与引擎的发展，包括 Node.js、云平台专有运行时及多种不那么知名的方案，为开发者补全 JS 生态知识。
• TypeScript 5.9 RC 发布，新增 import defer 及 --module node20 等特性；Node.js 生态工具链持续跟进最新规范。
• Google 推出 OSS Rebuild 项目，目标通过包与上游工件比对增强 npm 等开源生态的安全性。
• npm 生态持续遭受攻击，is 包通过通过拼写钓鱼域名劫持进行钓鱼。
• HTML 2025 状况调查开启，旨在收集前端开发者对 HTML 发展状况的意见。
• 一名开发者声称讨论 tabs 与 spaces 的争论趋于结束，主流语言倾向使用 spaces。
• 用 Node.js 和 Postmark 构建的电子邮件控制的 Game Boy 模拟器
• es-toolkit 已成为 Lodash 的 100% 兼容替代方案，突出生态兼容性成果。

2. 技术专题与实践分享
• 介绍 Unix 域套接字（Unix Domain Sockets）在 Node.js 内部进程通信（IPC）中的优势，约可降低 50% 延迟，相较 TCP loopback 更高效。
• 采访 Bun 作者，解析 Bun 作为 Node.js 生态“替代品”的兼容性挑战与工程实践。
• 文章详述如何构建暴露数据资源给大语言模型（LLM）的 Node.js MCP 服务器。
• 探讨 TypeScript 多仓库（multi-repo）间的类型安全问题及解决方法
• 分析 JavaScript 逻辑赋值操作符的语法进步及实际开发中带来的便利。

3. 代码与工具
• AudioTee.js：为 Node.js 捕捉 macOS 系统音频输出，并以 PCM 格式定期输出。
• Transformers.js 3.7：在浏览器与 Node.js 侧支持 ONNX 预训练模型推理，v3.7 增加了 Voxtral（语音转录及音频理解）、LFM2 和 ModernBERT 支持。
• match-sorter 8.1：为数组筛选和排序提供确定性算法，便于开发者实现可预期的最优匹配排序。
• 其他值得关注的工具/库更新：Inquirer 12.9（终端交互式输入）、Node File Trace 0.30（依赖追踪）、MongoDB Node.js Driver 6.18、node-rate-limiter-flexible 7.2、Ghost 6.0 RC、@google-cloud/bigtable 6.2、Axios 1.11、TIFF 7.1、ESLint v9.32.0 等等。

author Node Weekly 编辑团队

Buttondown

The many, many, many JavaScript runtimes of the last decade

This last decade has seen an inundation of new JavaScript runtimes (and engines in equal measure), enabling us to run JavaScript in all manner of contexts...

#优质博文 #node #JavaScript #TypeScript #Docker #Tools

Node Weekly #586 - July 15, 2025

AI 摘要：本期 Node Weekly 聚焦 Node.js 最新版本更新、社区讨论以及相关技术进展。Node.js v24.4.0 发布，带来了新的功能和安全更新提示；社区正在讨论是否将 Node.js 改为年度大版本发布并缩短 LTS 周期；TypeScript 5.9 Beta 引入了新功能如 import defer；此外，还涵盖了 Docker 部署最佳实践、性能差距分析、JavaScript 现代模式问题，以及一系列实用工具和库的更新，旨在帮助开发者提升效率和代码质量。

1. Node.js 更新与公告：
• Node v24.4.0 (Current) 发布：新增 --watch-kill-signal 功能，允许指定重启进程时的信号；spawn 和 spawnSync 支持权限模型标志传播；包含常规 V8 和依赖项更新。Node 团队还预告即将发布 v24.x、22.x 和 20.x 版本以解决安全问题。
• Node.js 年度大版本发布提案：社区讨论是否将 Node.js 改为每年一次大版本发布，并将偶数版本 LTS 周期从 30 个月缩短至 24 个月，欢迎社区反馈。
• Node.js v18 支持延长：尽管 v18 已于 2025 年 4 月停止支持，但 Canonical 宣布 Ubuntu Pro 用户将获得支持至 2032 年。

2. 社区与安全动态：
• Node-API 支持 React Native：Callstack 宣布为 React Native 引入 Node-API 支持，扩展跨平台原生代码编写和共享的可能性。
• TypeScript 5.9 Beta 发布：引入 import defer 支持，以及新的 node20 模式（类似 nodenext，但目标为 ES2023）；透露 Go 驱动的 TypeScript 原生端口将在 TypeScript 7 中可用。
• TC39 全会总结：Igalia 团队分享了最新 TC39 全体会议的详细摘要，其中包含有关 ECMAScript 发展的有趣花絮。。
• 安全威胁：朝鲜“威胁行为者”部署了 67 个恶意 npm 包，Kirill Boychenko 详细解释了这些包的运作机制。
• Node 版本管理器性能差距：Pavel Romanov 指出不同 Node 版本管理器可能导致 shell 启动速度相差 500 倍，但对大多数用户影响不大。
• JavaScript 作用域提升问题：Parcel 创建者 Devon Govett 认为作用域提升与现代 JS 模式冲突。
• 使用 Array.fromAsync() 的现代异步迭代：Matt Smith 介绍 Array.fromAsync() 的用法。
• 类型化查询构建器对比：Guillaume Billey 比较了 Kysely 和 Drizzle 两种工具。

3. 工具与库推荐：
• Necord：基于 Nest 和 Discord.js 的 Discord 机器人开发框架，易于部署机器人功能。
• Upyo：跨运行时邮件发送库，支持 SMTP 和 HTTP（如 SendGrid、Amazon SES）提供统一类型安全的 API。
• Rewire 9.0：专注于 CommonJS 的单元测试猴子补丁工具，方便注入 mock 和检查私有变量。
• Envalid 8.1：环境变量验证工具，确保程序运行时依赖项齐全。
• cRonstrue 3.0：将 Cron 表达式转换为自然语言，支持约 30 种语言环境。
• 其他更新：包括 ESLint v9.31.0、Serverless Express 4.17、NATS.js 3.1、OpenAI Node 5.9 等工具和库的最新版本信息。

4. 生态系统动态：
• JavaScript Date 类测试：通过趣味测验了解 Date 类的解析机制。 #趣站
• ANSI.tools：在线工具，用于分析 ANSI 转义码和常用代码查询。
• 10 亿行挑战：Tae Kim 分享如何在 Bun 中处理 10 亿行文件，耗时不到 10 秒。
• Nginx 的 njs 模块升级：从仅支持 ES5 升级至使用 QuickJS，支持完整的 ES2023 功能。

nodejs.org

Node.js — Node.js v24.4.0 (Current)

Node.js® is a free, open-source, cross-platform JavaScript runtime environment that lets developers create servers, web apps, command line tools and scripts.

#优质博文 #前端 #新动态 #typescript #css #svg
这期真不错。
Web Weekly #160

AI 摘要：本文主要聚焦于前端开发领域的最新动态和技术更新，尤其关注 WWDC25 带来的 Safari 26 新特性，如 SVG 图标支持、CSS 锚点定位和滚动驱动动画等。同时，文章涵盖了其他前端技术话题，如 contrast-color() 函数、Temporal JS API、响应式图片优化等，并分享了作者对技术趋势和行业现状的个人见解。整体内容旨在为读者提供前沿技术资讯、实用技巧和有趣的资源推荐。

1. Safari 26 新特性（WWDC25 亮点）
• SVG 图标支持：Safari 终于支持 SVG 作为 favicon，标志着“favicon 乱象”的终结，尽管相比其他浏览器晚了数年。
• CSS 锚点定位：介绍 CSS anchor positioning 功能，适用于工具提示和弹出框，Chromium 和 Webkit 已支持，Oddbird 提供了 polyfill。
• 滚动驱动动画：Safari 跟进 Chromium 支持 scroll-driven animations，Firefox 部分支持，作者推荐 Bramus 的免费课程学习相关技术。
• 其他小更新：包括 JS 小幅改进、text-wrap: pretty、contrast-color()、margin-trim 和 progress() 等 CSS 新特性。
• Safari 现状反思：尽管有进步，Safari 在 Web 平台测试中仍有较多失败案例，作者质疑其是否能摆脱“新 IE”的标签。

2. 技术热点与资源
• State of CSS 调查：鼓励读者参与年度 CSS 调查以了解新趋势。
• Import Maps 更新：Shopify 推动了 import maps 规范变更，解决了模块加载和单一 map 限制问题，已在 Chromium 和 Webkit 实现。
• Contrast-color() 函数：Safari 支持该函数，但仅限于黑白对比，作者讨论其局限性并推荐相关阅读。
• Optional Chaining 争议：作者对过度使用可选链 (?.) 提出质疑，认为频繁检查属性存在性可能是代码异味。

3. 有趣项目与工具
• Internet Roadtrip：一个由 Neal 开发的公路旅行，和互联网陌生人共同决定目的地。到目前为止已行驶 3000 多英里
• Temporal JS API：Firefox 率先支持 Temporal，改善了 JavaScript 日期处理体验。
• TypeScript Prettify：介绍一个提高 TypeScript 类型可读性的技巧。
• 响应式图片优化：为响应式图像编写正确的标记是很困难的，推荐一个响应式图片 linter 工具。
• 框架渲染方式：Ryan Carniato 讲解了 React、Vue 等框架的 DOM 渲染方法。
• Text-box 属性：介绍 MDN 上的 text-box 属性，用于未来文本垂直对齐。

4. 实用技巧与工具推荐
• 预加载响应式图片：通过旧的 link 元素预加载图片的技巧。
• 三个开源项目：包括 gron（命令行工具，转换 JSON 使其易于使用 grep 等工具进行搜索）、tweety（浏览器集成终端）和 parrot.live（终端动画）。
• CSS Shape 工具：介绍一个将 SVG 路径转换为 CSS shape() 的在线工具。

author Stefan Judis

Stefanjudis

Web Weekly #160

Preloading responsive images, CSS `contrast-color()` and the long-awaited `Temporal` JS API.

#typescript #新动态
https://fixupx.com/mattpocockuk/status/1931305701676110169

Matt Pocock (@mattpocockuk):
tsc --init is finally getting an upgrade

Happy to see it largely resembles my tsconfig cheat sheet, but with some extra goodies I might need to steal

https://github.com/microsoft/TypeScript/pull/61813

FixupX

Matt Pocock (@mattpocockuk)

tsc --init is finally getting an upgrade

Happy to see it largely resembles my tsconfig cheat sheet, but with some extra goodies I might need to steal

https://github.com/microsoft/TypeScript/pull/61813

#优质博文 #前端 #javascript #typescript #工程化 #新动态
⚡️ JavaScript Weekly Issue #737

AI 摘要：本期《JavaScript Weekly》涵盖了 JavaScript 发展的历史里程碑、TypeScript 的性能革新、框架简介以及多个工具和库的更新。文章详细介绍了 JavaScript 30 年的发展历程，TypeScript 编译器的原生预览版带来的性能提升，以及多个主流框架的核心理念。此外，还包括了 Node.js 等工具的最新版本发布、Electron 性能优化的经验分享，以及一系列实用工具和资源的推荐，适合对前端开发和技术动态感兴趣的开发者深入了解。

• JavaScript 历史回顾：由 Deno 团队撰写的文章，详细梳理了 JavaScript（最初名为 LiveScript）自诞生以来的 30 年发展历程，从 Netscape Navigator 的首次亮相，到 JScript 分支、标准化进程、Node.js 的引入，直至现代生态系统的形成，呈现了一个全面的时间线。
• TypeScript 原生预览版发布：微软宣布了 TypeScript 编译器的原生预览版，通过将编译器移植到 Go 语言实现原生编译和更高的并发性能，Anders Hejlsberg 早前预告的 10 倍速度提升现已可供开发者尝试。
• JavaScript 框架简介：SolidJS 的创作者 Ryan Carniato 制作了一段 11 分钟的视频，简明扼要地讲解了 React、Angular、Vue、Svelte 和 Solid 等框架的不同设计理念和应用场景，内容紧凑且适合快速了解框架全貌。
• 简讯与更新：
• 公布了下周 TC39 会议的议程及讨论提案。
• React Router 现已预览支持 React Server Components。
• 版本发布：
• Node.js 发布了 v24.1.0（当前版）和 v22.16.0（LTS 版）。
• Bun v1.2.14：快速 JavaScript 运行时和工具包。
• Slonik v48：Node.js 的 Postgres 客户端，支持运行时和构建时类型安全。
• 其他更新包括 Zod v4、Astro 5.8、ESLint v9.27.0。
• 文章与教程：
• Angular 新动态：Google I/O 活动中，Angular 团队分享了框架的最新更新，预告 Angular 20 的发布。
• ESLint v9.0 回顾：Nicholas C. Zakas 回顾了 ESLint v9.0 发布一年来的经验教训，重点讨论了新默认的 flat-config 系统带来的挑战。
• Electron 性能优化：分享了 Slack、Notion 和 VS Code 等应用如何提升 Electron 应用性能的六种方法。
• 其他短文：包括数组索引方法 at() 的用法、Node.js 控制台文本样式化、JavaScript WebSocket 认证等。
• 代码与工具：
• Defuddle：从网页提取主要内容的工具，类似于 Mozilla 的 Readability，有在线演示。
• snapDOM：快速准确地将 DOM 节点捕获为 SVG 图像，保留样式和背景。
• ForesightJS：预测鼠标意图的库，通过预加载数据减少延迟（对触摸设备效果有限）。
• Astra：新的 JavaScript 到 EXE 编译器，仅支持 Windows。
• Crosspost：支持跨多个社交网络（如 Bluesky、X、Mastodon）发布内容的 JS 工具。
• Rockpack 6.0：React 应用启动工具，支持 React 19，集成 SSR、打包、Linting 和测试。
• 其他工具更新包括 Calendar Link、octokit.js、image-type 和 Peggy。
• 其他动态：
• Google I/O 开发者主题演讲展示了 Chrome DevTools 的新功能。
• 微软发布 VS Code 的 Postgres 扩展，支持 SQL 智能补全和 GitHub Copilot 集成。
• Anthropic 推出 Claude 4 模型，广泛应用于编码工具。
• Glitch 平台将关闭应用托管功能，未来发展方向不明。

Deno

A brief history of JavaScript | Deno

In 30 years, JavaScript went from being a little scripting language to one of the world's most popular. Here are key moments to show how it has evolved and where it is headed.

#优质博文 #javascript #前端
Awesome JavaScript Weekly - Issue 469, May 15, 2025 | LibHunt

AI 摘要：本期 Awesome JavaScript Weekly 涵盖了 JavaScript 生态的最新动态，包括语言特性（如显式资源管理）、工具更新（如 Lume 3 发布）、技术实践（如 HTTP Range 请求的视频服务））。

1. 技术文章与更新
• Hyper-Typing：过度类型化 #typescript
• JavaScript's New Superpower: Explicit Resource Management：探讨 JavaScript 新增的显式资源管理特性及其优势。
• Serving Video with HTTP Range Requests：介绍如何利用 HTTP Range 请求实现高效视频流传输。
• How V8 JavaScript Engine Works Behind the Scenes：深度解析 V8 引擎的内部工作原理。
• Converting values to strings in JavaScript has pitfalls：讨论 JavaScript 中值转换为字符串的常见陷阱。
• Teaching Coding with JavaScript and P5.js：使用 JavaScript 和 P5.js 进行编程教学的经验分享。
• Joys and sorrows of designing a language：语言设计过程中的挑战与收获。

2. 工具与框架发布
• Lume 3 was released：静态站点生成器 Lume 的第三版发布。
• Real-time Github Analytics with ClickHouse, Redpanda：结合 ClickHouse 和 Redpanda 实现实时 GitHub 数据分析的方案。
• deebo-prototype：自主调试代理 MCP 服务器。
• strudel：基于 Web 的算法音乐实时编码环境，移植自 TidalCycles。
• react-bits：开源动画 React 组件库，支持高度定制化。

Pscanf

Hyper-Typing

In this article, I talk about an inherent trade-off in TypeScript's type
system: stricter types are safer, but often more complex. I describe a
phenomenon I call "hyper-typing", where libraries - in pursuit of perfect type
safety - end up with overly complex…

#优质博文 #前端 #typescript
难得一见的比较不同的思路
Understanding the Value of TypeScript Enums

AI 摘要：本文为 TypeScript 的枚举（enum）功能辩护，指出当前对其的批评多源于误用而非特性本身的问题。作者强调枚举应作为符号化（symbolic）工具用于内部逻辑，而非直接绑定字面值或暴露为公共 API，并详细分析了错误使用枚举的三大风险及正确实践方法。

1. 引言与背景
• 近年来越来越多开发者批评 TypeScript 的枚举功能，倾向于使用联合类型或常量对象。
• 作者认为问题在于对枚举的误解和误用，而非特性本身。

2. 枚举的符号化本质
• 枚举应代表抽象概念而非具体值（如 "red" 或 #FF0000 ），类似 ES6 的 Symbol 特性。
• 示例：交通灯状态应通过 enum TrafficLight { Red, Yellow, Green } 抽象表示，而非绑定字符串或颜色代码。

3. TypeScript 枚举的陷阱
• 允许字面值赋值：如 enum TrafficLight { Red = "red" } 导致以下问题：
• 抽象泄漏：逻辑层与表示层耦合（如 UI 直接依赖 "red" 字符串）。
• 脆弱性：字符串比较易受大小写或拼写错误影响。
• 公共 API 污染：枚举值暴露后难以修改（如后端 API 返回 "Processing"）。

4. 正确使用建议
• 仅用于内部逻辑：枚举值应作为代码中的符号标签，不直接序列化或展示。
• 显式转换层：通过 Map 或映射函数将枚举值转换为外部需要的表示形式。

5. 结论
• 批评者常抱怨枚举“不易序列化”，但作者指出这是误用——枚举本就不应直接用于序列化场景。
• TypeScript 枚举虽有设计差异，但在符号化场景中仍具价值，关键在于区分抽象与具体表示。

author Yazan Alaboudi

Yazan's Software Thoughts

Understanding the Value of TypeScript Enums

Discover the true purpose of TypeScript enums and how to use them effectively as symbolic representations in your code

#优质博文 #前端 #typescript #新动态
A 10x Faster TypeScript

AI 摘要：TypeScript 团队宣布开发原生编译器，预计将编译速度提升 10 倍以上，大幅优化编辑器启动时间和内存占用。

本文宣布了 TypeScript 团队为提升性能开发的 原生编译器计划 。当前 TypeScript 在大规模代码库中面临性能瓶颈（如编译速度慢、编辑器启动时间长、内存占用高），新方案通过 将编译器移植到 Go 语言 实现，目标在 2025 年中期提供命令行类型检查预览版，2025 年底完成完整功能支持。

实测数据显示，新编译器在多个大型开源项目（如 VS Code、Playwright）中可实现 9-13 倍的速度提升 ，内存占用减少约 50%。编辑器场景下，VS Code 的项目加载时间从 9.6 秒降至 1.2 秒。此外，团队计划迁移至 语言服务器协议（LSP） 以提升跨语言兼容性，并为 AI 工具提供更高效的基础设施支持。

机翻 https://github.com/microsoft/typescript-go/discussions/411#discussioncomment-12462917

我们在选择 Go 时就明确知道，肯定会有人质疑我们为什么没有选择 Rust。这是一个很好的问题，因为 Rust 是一门出色的语言，如果没有其他限制，它在编写新的原生代码时是一个很强的首选。
可移植性（即能够创建一个与当前代码库算法上相似的新代码库的能力）一直是我们考虑如何实现这一目标时的关键限制。我们尝试了大量方法，试图找到一种在 Rust 中可行的表示方式来实现这种移植，但所有方法要么存在不可接受的权衡（性能、人机工程学等），要么演变成了“自己编写垃圾回收器”式的策略。有些方法几乎成功了，但往往需要大量使用不安全代码，而 Rust 中似乎没有多少基础元素的组合能够让人机工程学上轻松地将 JavaScript 代码移植过来（这样说并不令人意外——大多数语言并不优先考虑让从 JavaScript/TypeScript 移植变得容易！）。
最终，我们面临两个选择——在 Rust 中从头开始完全重写，这可能需要数年时间，并产出一个与 TypeScript 不兼容、无人能实际使用的版本；或者在 Go 中进行移植，大约一年左右就能得到一个可用的东西，在语义上高度兼容，在性能上极具竞争力。
而且，我们甚至不太清楚这么做的好处是什么（除了不必应对那么多“你们为什么没选 Rust？”的问题）。我们仍然希望有一个高度分离的 API 接口，以保持我们实现选择的开放性，因此 Go 的互操作性短板并不是特别相关。Go 拥有出色的代码生成和数据表示能力，就像 Rust 一样。Go 拥有出色的并发原语，就像 Rust 一样。单核性能也在误差范围内。虽然在 Go 中使用不安全代码可能会带来一些性能提升，但我们在不使用任何不安全原语的情况下已经获得了出色的性能和内存使用。
在我们看来，Rust 在实现其设计目标方面非常成功，但“从这个特定的 JavaScript 代码库轻松移植到 Rust”显然不是它的设计目标之一。Go 也不是，但就我们目前编写代码的方式而言，它在这方面确实表现得相当不错。
关于贡献问题，我并不是特别担心。学习如何在类型检查器中正确工作所需的努力，远比学习 Go 要多得多。

GitHub

Why Go? · microsoft typescript-go · Discussion #411

Language choice is always a hot topic! We extensively evaluated many language options, both recently and in prior investigations. We also considered hybrid approaches where certain components could...

#优质博文 #前端
1. 宣布推出 TypeScript 5.8 —— 经过四个月的发展，TypeScript 5.8 以 Node 为重点。您现在可以在 nodenext 模块中对 ES 模块使用 require() ，对于希望继续以 Node 18 为目标的开发人员，有一个新的 node18 模块，最值得注意的是，现在有一个 --erasableSyntaxOnly 选项来确保不能使用仅限 TypeScript 的运行时语义（如果您使用 Node 的类型剥离功能直接运行 TypeScript 代码，则这是理想的选择） #typescript #node （机翻）
2. 使用 Playwright 进行动态网页数据抓取

本文通过 YouTube 案例，介绍如何利用 Playwright 工具解决动态网页（依赖 JavaScript）的数据抓取问题。
文章首先指出传统基于 Cheerio 的静态网页抓取工具无法处理动态渲染内容的问题，提出使用 Playwright 的浏览器自动化方案。 文章包含详细的代码片段和配图说明，重点展示了 Playwright 的 Locators API 和浏览器上下文操作能力，最终实现动态加载视频数据的结构化抓取。 #WebScraping #javascript #网页抓取 #教程

3. 具有现代依赖项的 Electron 应用程序样板 —— 一个基本的模板应用程序，使用 React 19、Tailwind CSS 4、shadcn/ui、Electron Vite、Biome，并包括 GitHub Actions 发布工作流程。 #template #tailwind #shadcn

via Node Weekly 568

Microsoft News

Announcing TypeScript 5.8

Today we’re excited to announce the release of TypeScript 5.8! If you’re not familiar with TypeScript, it’s a language that builds on top of JavaScript by adding syntax for types. Writing types in our code allows us to explain intent and have other tools…

#优质博文 #前端
1. 不要用 TypeScript 枚举（英文） TypeScript 官方已经不建议使用 enum（枚举）语法，作者建议改用字符串的联合类型代替。 #typescript
2. olmOCR 一个使用 AI 模型进行文字识别（OCR）的 Python 工具。 #AI #OCR
3. MTranServer 开源的离线翻译服务器，号称资源消耗低，CPU + 1G 内存即可运行，支持调用沉浸式翻译。 #翻译

via #阮一峰的科技周刊 340

Blog | Georges Haidar

An ode to TypeScript enums

Pouring one out for a fallen friend

#优质博文 #前端
适合初学者的一篇指南。

2025 React + TypeScript 实战指南！
https://mp.weixin.qq.com/s/3hW5HokQINsO_w15pMYPpg

AI 摘要：本文总结在 React 中使用 TypeScript 的常见场景，涵盖组件类型定义、Hooks 类型化、事件处理及异步请求类型安全实践。

本文系统梳理了 React 与 TypeScript 协同开发的核心技术点。首先对比函数组件的两种类型定义方式（ React.FC vs 直接定义 Props），分析其灵活性与适用场景；其次解析类组件中泛型、Component 与 PureComponent 的类型定义逻辑，并探讨动态 Props 的泛型解决方案。针对 Hooks，文章详细说明 useState 、 useRef 、 useMemo 等常用 Hook 的类型化实践，包括空值处理和对象类型断言等细节。此外，还覆盖事件对象类型定义、元素属性扩展、错误边界实现及异步请求（Fetch/Axios）的类型安全方案，最终形成完整的 React + TypeScript 开发指南。

#react #typescript #course

via 微信公众号 前端充电宝

Weixin Official Accounts Platform

2025 React + TypeScript 实战指南！

#优质博文 #前端 #node #typescript
Demo: implementing a Node.js CLI app directly in TypeScript
https://2ality.com/2025/02/nodejs-type-stripping-demo.html

AI 摘要：本文介绍了作者发布的 nodejs-type-stripping 示例仓库，该仓库演示了如何直接用 TypeScript 实现一个 Node.js 命令行应用程序，无需通过传统的转译步骤。这得益于 Node.js 新增的类型擦除功能，允许直接执行 .ts 文件。文章详细说明了项目的结构、配置文件设置和运行方法，重点解释了在 package.json 中如何将 bin 脚本直接指向 TypeScript 源码，以及在 tsconfig.json 中启用类型擦除所需的关键配置选项。这种方法简化了 TypeScript 开发流程，无需额外的构建步骤即可部署和运行 TypeScript 应用。

via Axel Rauschmayer

#优质博文 #新动态 #新标准 #前端 #typescript #工程化 #正则
TC39 将 3 个提案推进到第4阶段：Regexp Escaping，Float16Array 和 Redeclarable Global Eval Vars
https://socket.dev/blog/tc39-advances-3-proposals-to-stage-4-regexp-escaping-float16array-and-redeclarable-global-eval

AI 摘要：本文详细报道了 TC39 第 106 次会议期间，多达九项 JavaScript 提案在不同阶段取得进展，其中三个关键提案—— RegExp Escaping、Float16Array 和 Redeclarable Global Eval Vars 已经晋升到 Stage 4，即将成为正式的 ECMAScript 标准。文章不仅介绍了这些提案的具体内容和优势，例如为正则表达式提供内置转义功能，为数值处理引入更加节省内存的16位浮点数组，还讨论了其它提案如 Error.captureStackTrace 和 Error.prototype.stack 标准化、import defer 模块延迟加载、以及Math.clamp 函数的添加。这些改变旨在提升语言的安全性、跨平台一致性和性能表现。文末还列举了 Decimal & Measure、装饰器、Records & Tuples 等其他讨论中的话题，预示了 JavaScript 未来可能的进一步扩展和优化。

Socket

TC39 Advances 3 Proposals to Stage 4: RegExp Escaping, Float...

TC39 met in Seattle and advanced 9 JavaScript proposals, including three to Stage 4, introducing new features and enhancements for a future ECMAScript...

#优质博文 #前端 #工程化 #esm #typescript
Tutorial: publishing ESM-based npm packages with TypeScript

AI 摘要：过去两年，TypeScript、Node.js 和浏览器对 ESM（ECMAScript Modules）的支持取得了显著进展。本教程介绍了一种较为现代、简化的 TypeScript npm 包发布方案，适用于无需考虑向后兼容性的项目。

主要内容：

1. 项目结构：包含 src/ （源码）、test/ （测试）、dist/ （编译输出）、docs/ （文档）等目录。

2. tsconfig.json 配置：

• outDir: "dist" ：编译后的文件存放在 dist/ 目录。
• sourceMap: true、declaration: true、declarationMap: true，确保源码映射和类型定义文件生成。
• verbatimModuleSyntax: true 及 erasableSyntaxOnly: true，提高 TypeScript 代码的可移植性。

3. package.json 相关配置：

• "type": "module" ：确保 .js 文件按 ESM 解析。
• "exports"：明确定义包的 ESM 入口，支持子路径导出。
• "files"：严格控制发布到 npm 的文件，避免上传测试代码。

4. 构建与发布：

• 使用 npm run build 清理 dist/ 目录并重新编译。
• prepublishOnly 钩子在 npm publish 之前自动执行 build，确保发布的代码是最新的。
• publishd 命令用于 npm publish --dry-run，可预览上传的文件。

5. 测试与文档：

• 采用 Mocha 进行单元测试，并支持 source-maps 以优化错误追踪。
• 使用 TypeDoc 生成 API 文档，托管于 GitHub Pages。

6. 其他工具：

• publint、arethetypeswrong 等工具检查 npm 包的兼容性和 TypeScript 类型定义的正确性。
• shx 统一跨平台 shell 命令（如 rm -rf、chmod u+x）。

本指南基于 @rauschma/helpers 包的实践经验，提供了一种现代化、易于维护的 ESM npm 包构建方法。

via 2ality – JavaScript and more

2Ality

Tutorial: publishing ESM-based npm packages with TypeScript

During the last two years, ESM support in TypeScript, Node.js and browsers has made a lot of progress. In this blog post, I explain my modern setup that is relatively simple – compared to what we had to do in the past:

#优质博文 #前端 #typescript
在 TypeScript 中使用元组进行计算

AI 摘要：这篇文章介绍了 TypeScript 元组（Tuple）的概念及其应用。主要内容包括：

1. 元组基础：元组是一种固定长度、元素类型已知的数组。例如，[number, string] 代表一个两元素元组，要求第一个元素是 number，第二个是 string。
2. 可选元素：可以使用 ? 标记某些元素为可选，例如 [number, string?]，表示第二个元素可以省略。
3. 变长元组：通过 ... 语法支持变长参数，例如 [string, ...number[]] 允许第一个元素是 string，后续元素是 number。
4. 元组的实际应用：包括函数返回多个值、定义结构化数据等。
5. 类型推导与模式匹配：TypeScript 能根据元组推断类型，结合解构赋值使用更灵活。

总体而言，文章深入探讨了 TypeScript 元组的语法与应用，适合希望优化数据结构和类型安全性的开发者。

via 2ality

2Ality

Computing with tuple types in TypeScript

JavaScript’s Arrays are so flexible that TypeScript provides two different kinds of types for handling them: Array types for arbitrary-length sequences of values that all have the same type – e.g.: Array<string> Tuple types for fixed-length sequences of values…

#优质博文 #前端 #typescript
TypeScript object destructuring and you

AI摘要：TypeScript 的对象解构可以简化 JavaScript 的代码，尤其在处理复杂的异步操作时。通过解构，我们可以更清晰地提取变量，避免使用索引访问嵌套的元组，从而提高代码的可读性和可维护性。本文介绍了对象解构的基本用法及其在 Observable 链中的应用，强调了其在编写干净代码方面的重要性。

via LogRocket Blog

LogRocket Blog

TypeScript object destructuring and you - LogRocket Blog

Discover how TypeScript object destructuring makes life easier for developers, and see various examples of object destructuring at work.

#优质博文 #前端 #typescript #node
Everything You Need to Know About Node.js Type Stripping
关于有关 Node.js 类型剥离你需要知道的一切技术细节和原因。

AI + 人工摘要：Node.js 在 v23.6.0 引入类型剥离功能，通过移除 TypeScript 类型注解，无需配置即可运行代码，显著提升开发体验。

为什么不嵌入类型检查

- 类型检查依赖 TypeScript 编译器（tsc），其更新频繁且易引入不兼容变化。
- tsc 体积过大（约 22MB），会显著增加 Node.js 运行时体积。
- 在日常开发中，类型检查已在 IDE 中实时完成，运行时并无必要

类型剥离的核心机制

- Node.js 使用定制版的 swc 实现类型剥离，保证性能和稳定性。
- 剥离类型后保留代码结构，避免生成额外的 source map，减少性能开销。
- 某些 TypeScript 功能不能简单地剥离，因为它们会生成影响运行时行为的 JavaScript 代码（如枚举、命名空间和参数属性） 需通过 --experimental-transform-types 手动启用转换。

Node.js 通过将已删除的语法替换为空格来消除对源映射的需求，从而确保代码和结构的原始位置保持不变。它是透明的 —— 运行的代码是作者编写的代码，擦除类型。此技术受到 Bloomberg 的 Ashley Claymore 的 ts-blank-space 的启发。

限制与权衡

- 不支持 tsx：由于前端框架（如 React、Vue）依赖特定的编译方式，tsx 文件不符合 Node.js 后端运行时的目标。
- Node.js 禁止运行 node_modules 中的 .ts 文件，此决定是与 TypeScript 团队合作做出的，避免兼容性与性能问题，开发者需发布 .d.ts 和编译后的 JavaScript。

未来展望

- TypeScript 团队正引入新特性（如 rewriteRelativeImportExtensions），与 Node.js 类型剥离协同。
- 在下一个 TypeScript 版本（可能是 5.8）中，可能会引入 --erasableSyntaxOnly 标志将在 Editor 中提前暴露不支持的 TypeScript 特性，提升开发体验。
- Joyee Cheung 正在探索 Node.js 中 TypeScript 文件的编译缓存。这可以通过重用缓存的编译代码来加快后续模块加载速度，从而显著提高重复工作流的性能。

author Twitter@satanacchio Original Post

via @hyoban 投稿

#优质博文 #前端 #总结 #typescript #css #node #react #javascript

推荐阅读全文，以下内容均摘自文章翻译而来，方便我自己以后的搜索
本来只想简单写写的写完发现在润色润色可以发一篇译文博客了好像。。等我

2024 JavaScript Rising Stars

最受欢迎项目 Top 5

1. shadcn/ui (+38.0k stars)
- 可复制粘贴的精美 UI 组件库
- 支持高度定制化和无障碍访问
- 新增了图表、主题、布局等功能

2. Excalidraw (+27.0k stars)
- 手绘风格的在线白板工具
- 支持 AI 功能:文本转图表、Mermaid 转换等

3. AFFiNE (+19.6k stars)
- 开源知识库和项目管理工具
- 结合了 Notion（由块组成的文档）和 Miro（用于绘图的无限画布）等工具的功能。
- 离线优先，它是构建个人知识库的绝佳工具。

4. Bruno (+18.7k stars)
- 轻量级 API 测试工具
- Postman/Insomnia 的替代品

5. n8n (+17.0k stars)
- 工作流自动化平台
- 内置 AI 能力
- 支持 400+ 集成

主要趋势

1. 全栈框架
- Next.js 继续主导，全栈开发标准解决方案
- Hono 快速崛起，支持多运行时环境，极小的体积
- Astro 已成为构建内容密集型应用程序的多功能解决方案

2. 开发工具
- Biome - 快速的代码格式化和检查工具
- Bun - 高性能的 JavaScript 运行时
- Vite 今年再次成为大赢家，第二次将其 State of JS 奖评为最被采用和喜爱的技术。同时具有高使用率和保留率的情况很少见，更不用说维护它了。我们热切期待看到新的 VoidZero 公司明年将如何影响 Vite 生态系统！

值得一提的是，最成功的工具是让自己易于采用： Rspack 几乎是 webpack 的直接替代品，考虑到它的易用性和可以更快地构建的现有 webpack 项目的数量，它应该会在 2025 年爆炸式增长。

3. 移动开发
- Expo 和 React Native 继续主导
- 更注重 Web/原生统一支持

4. AI 工具崛起
- 如 Cursor、bolt.new 等 AI 辅助开发工具
- 可通过提示生成和部署完整应用

5. TypeScript 支持增强
- Node.js 23 原生支持 TypeScript
- 更多工具链原生支持 TS

总的来说,2024年 JavaScript 生态系统在工具链性能、开发体验和 AI 赋能方面都有重大进展。


结论 部分翻译如下

2024 年充满了激动人心的发布：

1. JSR：来自 Deno 团队的新包注册表（不是包管理器），原生支持 TypeScript。
2. Deno v2：JS 运行时的一个重要里程碑，专注于大规模使用 Deno，包括与传统 JS 基础设施的互操作性、导入任何 NPM 包的能力以及稳定的标准库。Deno 也是一个包管理器，拥有自己的缓存机制，可提供闪电般的安装速度。
3. Bun v1.1 现在支持 Windows。
4. TanStack Start：它最初是围绕 TanStack router 构建的模版，后来演变成一个独树一帜的服务器绑定框架！
5. Tauri v2 提供了更好的开发者体验（DX）、全新的插件系统以及移动端支持。
6. Astro 5：一个用于构建内容驱动型网站的Web框架，以其出色的开发者体验受到赞誉。它引入了一个新的内容层（Content Layer），能够以灵活且类型安全的方式从任何来源获取内容。
7. 新公司 VoidZero ，专注于为JS生态系统提供高性能和统一的开发工具链。
8. Vite 6 具有新的 Environment API，为扩展到浏览器之外开辟了新的可能性。
9. TailwindCSS 4 提供 CSS 优先的配置以及更好的性能。
10. React Router v7 将 Remix 的功能和改进带回了库。文档清楚地说明了项目之间的合并，其中提到了两种开始方法，即使用库或完整框架。

今年年底，最大的新闻之一出现了：Node.js 23 支持 TypeScript，而无需实验标志。

但是，最重要的变化与我们用于编写代码的库或框架无关。相反，它们围绕着由 AI 提供支持的令人难以置信的工具展开。Cursor 等 IDE 以及 bolt.new、Lovable、Replit 和 v0.dev 等服务只需几个提示即可生成甚至部署全栈应用程序。如果你能说出来，你就能部署它！2025 年，这一领域的竞争将急剧上升，开发人员将需要做出调整，以充分利用这些强大的工具。

risingstars.js.org

2024 JavaScript Rising Stars

A complete overview of the JavaScript landscape in 2024: trends about frontend, fullstack and Node.js frameworks, React and Vue.js ecosystems, build tools, state management...

#优质博文 #前端 #node #新动态 #typescript
Node.js 现在默认支持 TypeScript —— 自 v22.6 版本引入实验性“类型剥离（type stripping）”支持,以来，可以直接使用 Node.js 运行 TypeScript。 在即将发布的 Node 23.6 它将会正常工作。马特提供了一些细节，包括它的工作原理以及您将能够做的事情。

看到这条推特想起来的
https://fixupx.com/yusukebe/status/1876928003550171355

via Node Weekly #561

FxTwitter / FixupX

Yusuke Wada (@yusukebe)

まじだ。nodeで.ts実行できる