#719 — January 17, 2025
Together with
JavaScript Weekly
Learn Yjs and Building Realtime Collaborative Apps in JavaScript — Yjs is a CRDT (Conflict-free replicated data type) library for building collaborative and local-first apps. CDRTs are powerful but can be tricky to ‘get’ which is why this new interactive Yjs tutorial is so valuable. A great way to learn about building collaborative, syncing webapps from the ground up.
Jamsocket
Bun v1.1.44: The Fast JS Runtime Adds On-Demand Frontend Bundling — The popular, high-performance alternative JavaScript runtime has extended its Bun.serve() HTTP handler with support for bundling frontend apps on demand using HTML imports.
Ben Grant
Protect Against Bots, Fraud, and Abuse in Real Time — With WorkOS Radar you can detect, verify and block harmful behaviour, protecting your app with advanced device fingerprinting. Stop fake signups, stop free tier abuse, and stop bot attacks and brute force attempts today.
WorkOS sponsor
A Checklist for Your tsconfig.json — What I love about Dr. Axel is when he’s done the hard work of figuring something out for himself, he writes it down. So it goes here, with his journey to set up a good tsconfig.json for his projects.
Dr. Axel Rauschmayer
IN BRIEF:
-
The Angular team shares a brief update on how they’re working on Angular’s strategy for 2025.
-
👽 Alien Signals are coming to Vue 3.6… (it’s basically a really fast way to handle signals.)
-
Tired of seeing
thiseverywhere in your code? Dave Rupert has a fun way to turn it into a single glyph in VS Code.
RELEASES:
-
Electron 34 – The JS, HTML and CSS desktop app framework updates to Chromium 132, Node 20.18.1, and adds a way to access the JavaScript call stack of unresponsive renderers.
-
Puppeteer 24 – Popular high-level API to control Chrome or Firefox.
-
Cypress 14 – Easy testing for anything that runs in a browser. Now supporting the latest versions of React, Angular, Svelte & Vite for component testing.
-
Storybook 8.5, ESLint 9.18.0, ESLint Config Inspector 1.0, AngularFire 19.0
📒 Articles & Tutorials
A Look at Regular Expression Pattern Modifiers — You may be familiar with using flags to change the behavior of regexes, but Dr. Axel looks at a proposal bringing a way to change regex flags within subexpressions (e.g. /^[a-z](?-i:[a-z])$/i;). It’s at stage 4 and should land in ECMAScript 2025.
Dr. Axel Rauschmayer
Accessibility Essentials Every React JS Developer Should Know — If you’re an experienced frontend developer, these might be second nature to you by now, but this is a good roundup of the entry level ‘table stakes’ for frontend accessibility, whether using React or not.
Martijn Hols
Write More Maintainable JavaScript with AI Code Reviews — CodeRabbit is your AI-powered code review companion that deeply understands the JavaScript codebase. Free for open source.
CodeRabbit sponsor
Five Years of React Native at Shopify — Five years ago, Shopify said React Native was the future for mobile development at their company and they meant it, with every mobile app moving to RN over time. Here’s what they learnt along the way and why they’re sticking with it.
Mustafa Ali (Shopify)
Revealed: React’s Experimental Animations API — <ViewTransition /> is based on the browser’s View Transition API. It’s only in pre-release versions of React, but Matt is armed with examples for you to get a feel for the potential.
Matt Perry (Motion)
📄 All JavaScript Keyboard Shortcut Libraries are Broken – Reflections on long standing complexities with the myriad ways of detecting keypresses. Jack Duvall
📄 JavaScript Hashing Speed Comparison: MD5 vs. SHA-256 – You shouldn’t be using MD5 anyway, but you especially shouldn’t be using it with the misconception that it’s faster. Daniel Lemire
📄 5 Technical JavaScript Trends You Need To Know About in 2025 Alexander T. Williams
📄 Creating a Generative Artwork with Three.js Eduard Fossas
📄 JavaScript’s Promise.race and Promise.all Are Not “Fair” Chris Krycho
📄 Node.js’s Type Stripping Explained Marco Ippolito
🛠 Code & Tools
♟️ Chess.js: A Library to Manage a Chess Game — Provides move generation, validation, piece placement, check/checkmate/stalemate detection – “everything but the AI!” v1.0 offers a rewrite to TypeScript and a variety of enhancements.
Jeff Hlywa
💡 Chess Engines: A Zero to One is a neat article digging into the technicalities of implementing a chess engine.
react-nil 2.0: A React ‘Null Renderer’ — An interesting experiment to use React in situations where you don’t need it to render anything, but you want to use hooks, suspense, context, and other bits of the React lifecycle. Like in, say, a Node app. Maybe this CodeSandbox example will provoke some ideas.
Poimandres
🔎 file-type 20.0: Detect the File Type of a File, Stream or Data — For example, give it the raw data from a PNG file, and it’ll tell you it’s a PNG. Uses a ‘magic number’ approach so is targeted at non text-based formats. v20 adds support for yet more formats, including JARs, Word/Excel templates, and now supports ZIP decompression.
Sindre Sorhus
Node Web Audio API 1.0: A Web Audio API Implementation for Node — More accurately, it’s a set of Node bindings for a Rust-powered non-browser implementation of the Web Audio API.
IRCAM – Centre Pompidou
⚙️ Vue Spring Bottom Sheet – A lightweight, flexible solution for bottom sheets in Vue apps. megaarmos
⚙️ Act – A Go-powered tool that looks at your repo’s GitHub Actions, uses Docker to grab the necessary images, and runs the tasks locally. Nektos
⚙️ Svar – A new suite of open source UI components for Svelte, React, and Vue. XB Software
📰 Classifieds
Optimize Your Next.js App’s Metadata - Discover practical ways to boost your site’s SEO and visibility by customizing metadata in Next.js.
🎹 STRICH: Add blazing fast and reliable 1D/2D Barcode Scanning to your web apps. Free demo app and 30-day trial available.
Meticulous automatically creates and maintains an E2E UI test suite with zero developer effort. Relied on by Lattice, Bilt Rewards, etc.
-
Perspective 3.3 – Streaming data viz and analytics component. The core is written in C++ and compiled to WebAssembly. The homepage shows it off well.
-
eslint-plugin-functional 8.0 – ESLint rules to disable mutation and promote functional approaches.
-
React Testing Library 16.2 – DOM testing utils that encourage good practices.
-
Happy DOM 16.6 – Cross-runtime JS implementation of a web browser sans UI.
-
PowerGlitch 2.4 – Tiny library to add a ‘glitch’ effect to images on the Web.
-
🤖 node-llama-cpp 3.4 – Run LLMs locally with bindings to
llama.cpp. -
Faker 9.4 – Generate fabricated data to your heart’s content.
-
Gridstack.js 11.3 – Build responsive interactive dashboards quickly.
-
Mineflayer 4.25 – Create Minecraft bots in JavaScript.
Published by Cooperpress and edited by Peter Cooper
‘JavaScript’ is a trademark of Oracle Corporation in the US
We are not endorsed by or affiliated with Oracle.
#719 — 2025 年 1 月 17 日
连同
[](https://javascriptweekly. com/link/164448/d076523b1d)
JavaScript 周刊
学习 Yjs 并用 JavaScript 构建实时协作应用程序 — [Yjs](https://javascriptweekly.com/link/164450/ d076523b1d) 是一个 CRDT（无冲突复制数据type) 库，用于构建协作和本地优先的应用程序。 CDRT 功能强大，但“获取”起来可能很棘手，这就是为什么这个新的交互式 Yjs 教程如此有价值。这是学习从头开始构建协作、同步网络应用程序的好方法。
插头
Bun v1.1.44：快速 JS 运行时添加按需前端捆绑 — 流行的高性能替代 JavaScript 运行时扩展了其Bun.serve() HTTP 处理程序，支持按需捆绑前端应用程序 使用HTML 导入。
本·格兰特
[](https://javascriptweekly.com/link/164448/d076523b1d ）
实时防范机器人、欺诈和滥用 — 借助 WorkOS Radar，您可以检测、验证和阻止有害行为，从而保护您的应用具有先进的设备指纹识别功能。立即停止虚假注册，停止免费套餐滥用，并停止机器人攻击和暴力尝试。
WorkOS赞助商
tsconfig.json 清单 — 我喜欢 Axel 博士的一点是他努力解决问题他为自己写下了它。就这样，他为自己的项目设置了一个良好的“tsconfig.json”。
阿克塞尔·劳施梅尔博士
简而言之：
-
👽 Alien Signals 即将加入 Vue 3.6…（这基本上是一种真正快速的信号处理方式。）
-
厌倦了在代码中到处看到“this”？ Dave Rupert 有一种有趣的方法，可以将其转换为 VS Code 中的单个字形。
发布：
-
Electron 34 – JS、HTML 和 CSS 桌面应用程序框架更新至 Chromium 132、Node 20.18.1，并添加了访问 JavaScript 调用堆栈的方法无响应的渲染器。
-
Puppeteer 24 – 用于控制 Chrome 或 Firefox 的流行高级 API。
-
Cypress 14 – 轻松测试浏览器中运行的任何内容。现在支持最新版本的 React、Angular、Svelte 和 Vite 进行组件测试。
-
Storybook 8.5、ESLint 9.18.0、ESLint 配置检查器1.0, AngularFire 19.0
📒 文章和教程
看看正则表达式模式修饰符 — 您可能熟悉使用 flags 来更改正则表达式的行为，但是 Dr. Axel看看提案带来了一种改变正则表达式的方法标记内子表达式（例如/^[a-z](?-i:[a-z])$/i;）。它处于第 4 阶段，应该会登陆 ECMAScript 2025。
阿克塞尔·劳施梅尔博士
每个 React JS 开发人员都应该知道的辅助功能要点 — 如果您是一位经验丰富的前端开发人员，这些现在可能已经成为您的第二天性，但这是前端可访问性入门级“赌注”的一个很好的总结，无论是否使用 React。
马丁·霍尔斯
使用 AI 代码审查编写更多可维护的 JavaScript — CodeRabbit 是您的 AI 驱动的代码审查伴侣，它深入了解 JavaScript 代码库。免费开源。
码兔赞助商
Shopify 的 React Native 五年 — 五年前，Shopify 说过 [React Native](https://javascriptweekly.com/link /164470/d076523b1d）是他们公司移动开发的未来，他们是认真的，随着时间的推移，每个移动应用程序都会迁移到 RN。以下是他们在此过程中学到的东西以及他们坚持下去的原因。
穆斯塔法·阿里 (Shopify)
揭晓：React 的实验动画 API — <ViewTransition /> 基于浏览器的 [View Transition API](https:// javascriptweekly.com/link/164472/d076523b1d）。它仅存在于 React 的预发布版本中，但 Matt 提供了一些示例，让您可以感受到它的潜力。
马特·佩里（动作）
📄 所有 JavaScript 键盘快捷键库均已损坏 – 对长期以来存在的各种按键检测方法的复杂性的反思。杰克·杜瓦尔
📄 JavaScript 哈希速度比较：MD5 与 SHA-256 – 无论如何你不应该使用 MD5，但你尤其不应该使用它错误地认为它更快。丹尼尔·勒米尔
📄 2025 年你需要了解的 5 个 JavaScript 技术趋势 Alexander T. Williams
📄 使用 Three.js 创建生成艺术作品 Eduard Fossas
📄 JavaScript 的 Promise.race 和 Promise.all 并不“公平” Chris Krycho
📄 Node.js 类型剥离解释 Marco Ippolito
🛠 代码和工具
♟️ Chess.js：管理国际象棋游戏的库 — 提供走棋生成、验证、棋子放置、检查/将死/僵局检测– “除了人工智能之外的一切！” v1.0 提供了对 TypeScript 的重写和各种增强功能。
杰夫·赫利瓦
💡 国际象棋引擎：从零到一 是一篇深入探讨实现国际象棋引擎的技术细节的精彩文章。
react-nil 2.0: A React ‘Null Renderer’ — 一个在不需要 React 的情况下使用 React 的有趣实验渲染任何东西，但你想使用钩子、悬念、上下文和 React 生命周期的其他部分。就像 Node 应用程序一样。也许此 CodeSandbox 示例 会激发一些想法。
普瓦芒德雷斯
🔎 file-type 20.0：检测文件、流或数据的文件类型 — 例如，向其提供来自PNG 文件，它会告诉你这是一个 PNG。使用“幻数”方法，因此针对非文本格式。 v20 添加了对更多格式的支持，包括 JAR、Word/Excel 模板，现在支持 ZIP 解压缩。
辛德·索尔胡斯
Node Web Audio API 1.0：Node 的 Web Audio API 实现 — 更准确地说，它是 Rust 驱动的一组 Node 绑定Web Audio API 的非浏览器实现。
IRCAM – 蓬皮杜中心
⚙️ Vue Spring Bottom Sheet – Vue 应用中的底表的轻量级、灵活的解决方案。巨型武器
⚙️ Act – 一个 Go 驱动的工具，可以查看存储库的 GitHub 操作，使用 Docker 获取必要的图像，并在本地运行任务。 Nektos
⚙️ Svar – 一套新的 Svelte、React 和 Vue 开源 UI 组件。 XB软件
📰 分类广告
优化您的 Next.js 应用的元数据 - 通过在 Next.js 中自定义元数据，探索提高网站 SEO 和可见度的实用方法。
🎹 STRICH：将快速可靠的一维/二维条形码扫描添加到您的网络应用程序中。提供免费演示应用程序和 30 天试用版。
Meticulous 自动创建和维护 E2E UI 测试套件，开发人员零工作量。受到 Lattice、Bilt Rewards 等的信赖。
-
视角 3.3 – 流数据可视化和分析组件。核心是用 C++ 编写并编译为 WebAssembly。 主页 很好地展示了这一点。
-
eslint-plugin-featured 8.0 – ESLint 规则禁用突变并推广函数式方法。
-
React 测试库 16.2 – 鼓励良好实践的 DOM 测试实用程序。
-
Happy DOM 16.6 – Web 浏览器 sans UI 的跨运行时 JS 实现。
-
PowerGlitch 2.4 – 用于为网络上的图像添加“故障”效果的小型库。
-
🤖 node-llama-cpp 3.4 – 在本地运行 LLM，并绑定到“llama.cpp”。
-
Faker 9.4 – 生成随心所欲的捏造数据。
-
Gridstack.js 11.3 – 快速构建响应式交互式仪表板。
-
Mineflayer 4.25 – 使用 JavaScript 创建 Minecraft 机器人。
由 Cooperpress 出版，由 Peter Cooper 编辑
“JavaScript”是 Oracle Corporation 在美国的商标
我们未获得 Oracle 的认可或隶属于 Oracle。
发布者