#702 — August 29, 2024
Together with
JavaScript Weekly
Rspack 1.0: The Rust-Powered JavaScript Bundler — Far from being ‘yet another bundler’ with its own approach and terminology to learn, Rspack prides itself on being webpack API and ecosystem compatible, while offering many times the performance. The team now considers it production ready and encourages you to try your webpack-based projects on it.
Rspack Contributors
💡 Rspack also has a family of ancillary tools worth checking out, such as Rsdoctor, a tool for analyzing and visualizing your build process (for both Rspack and webpack!)
Front-End System Design — Learn to create scalable, efficient user interfaces in this extensive video course by Evgennii Ray. Explore the box model, browser rendering, DOM manipulation, state management, performance and much more.
Frontend Masters sponsor
How to Create an NPM Package in 2024 — Sounds simple, but there are a lot of steps involved if you want to follow best practices, introduce useful tools, and get things just right. Matt Pocock walks through the process here, and there’s a 14-minute screencast too, if you’d prefer to watch along.
Matt Pocock
IN BRIEF:
🤖 v0 is an AI-powered tool from Vercel for, originally, generating shadcn/ui
-powered React components based upon prompts you supply. Now, however, it has basic Vue.js support too.
Deno 1.46 has been released and promises to be the final 1.x release before the much awaited Deno 2.0. Deno’s Node compatibility improves even more (it now supports Playwright and many more things) and ships with V8 12.9.
📊 IEEE has published its latest annual list of top programming languages. JavaScript takes third place, but TypeScript has leapt up several places to fourth.
RELEASES:
Prisma 5.19 – The popular ORM for Node.js and TypeScript adds ‘TypedSQL’, a way to write raw SQL queries in a type-safe way.
📈 billboard.js 3.13 – Popular D3 chart library adds area-step-range charts.
pnpm 9.9 – Fast, space efficient package manager.
📒 Articles & Tutorials
JS Dates are About to Be Fixed — Handling dates and times is famously a painful area for programmers and JavaScript hasn’t done a lot to make it easier. Libraries like Moment.js help a lot, but Iago looks at how the Temporal proposal and its features will begin to help a lot more over time.
Iago Lastra
Weekly Chats on the Art and Practice of Programming — Your home for weekly conversations with fascinating guests about how technology is made and where it’s headed.
The Stack Overflow Podcast sponsor
JavaScript Generators Explained — Jan was frustrated by the quality of documentation and articles explaining generators in JavaScript, and set out to explain things in a way that a more advanced developer could appreciate.
Jan Hesters
Implementing a React-a-Like from Scratch — While it’s unlikely you’ll actually want to do this, at least thinking about it can prove instructive as to what’s going on in React’s engine room.
Robby Pruzan
▶ How to Implement the 2048 Game in JavaScript — Ania is back with one of her usual easy to follow walkthroughs of implementing a complete game in JavaScript. This time it’s the 2048 sliding puzzle game. (Two weeks ago she did Tic-Tac-Toe as well.)
Ania Kubów
Learn Role-Based Access Control and Simplify Permissions Management — Enhance security and streamline access by managing user roles with Clerk Organizations.
Clerk sponsor
📄 The Only Widely Recognized JS Feature Ever Deprecated – Spoiler: It’s with
. Trevor Lasn
📄 Generating Unique Random Numbers in JavaScript Using Sets Amejimaobari
📺 21 Talks from the Chain React 2024 Conference – A React Native event. YouTube
📄 Exposing Internal Methods on Vue Custom Elements Jaime Jones
📄 The Interface Segregation Principle in React Alex Kondov
🛠 Code & Tools
TypeScript 5.6 Release Candidate — As always, Daniel presents an epic roundup of what’s new. We’ll focus more on it next week though, as the final release is anticipated to land next Tuesday (September 3).
Daniel Rosenwasser (Microsoft)
Vuestic UI 1.10: A Vue.js 3.0 UI Framework — Features 60 customizable and responsive components and with the v1.10 release it’s gained a significant bundle size optimization, a custom compiler that improves build time performance, and other minor enhancements. GitHub repo.
Vuestic UI
✅ Bye Bye Bugs — Get 80% automated E2E test coverage for mobile and web apps in under 4 months with QA Wolf. With QA cycles complete in minutes (not days), bugs don’t stand a chance. Schedule a demo.
QA Wolf sponsor
Material UI v6: The Popular React UI Design/Component System — At ten years old, the popular design system has its latest major release. There’s a focus on improved theming, color scheme management, container queries, and React 19 support. There are revamped templates to be inspired by, too.
García, Bittu, Andai, et al.
npm-check-updates 17.0: Update package.json
Dependencies to Latest Versions — That is, as opposed to the specified versions. It includes a handy -i
interactive mode so you can look at potential upgrades and then opt in to them one by one.
Raine Revere
Code Hike 1.0: Turn Markdown into Rich Interactive Experiences — Aimed at use cases like code walkthroughs and interactive docs, Code Hike bridges the gap between Markdown and React when creating technical content that takes full advantage of the modern web.
Rodrigo Pombo
Calendar.js: A Calendar Control with Drag and Drop — A responsive calendar with no dependencies, full drag and drop support (even between calendars), and many ways to manage events with recurring events, exporting, holidays, and more.
William Troup
📊 Perspective 3.0 – Data visualization and analytics component. The core is written in C++ and compiled to WebAssembly where it can be used from JavaScript. Their homepage shows it off well with a live example.
json-viewer 3.5 – Display JSON data in a readable, user-friendly way.
♟️ Stockfish.js 16.1 – A JavaScript chess engine.
jest-dom 6.5 – Jest matchers to test DOM state.
Marked 14.1 – Fast Markdown compiler / parser.
Javet 3.1.5 – Java + V8. Embed JS into Java.
Pixi.js 8.3.4 – Fast 2D on WebGL engine.
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.
#702 — 2024 年 8 月 29 日
与
[](https:// javascriptweekly.com/link/159078/d076523b1d)
JavaScript 周刊
Rspack 1.0:Rust 支持的 JavaScript Bundler — Rspack 远非拥有自己的方法和术语需要学习的“又一个捆绑器”以其与 webpack API 和生态系统兼容而自豪,同时提供数倍的性能。该团队现在认为它已做好生产准备,并鼓励您在其上尝试基于 Webpack 的项目。
Rspack 贡献者
💡 Rspack 还有一系列辅助工具值得一试,例如Rsdoctor ,一个用于分析和可视化构建过程的工具(适用于 Rspack * 和 * webpack!)
前端系统设计 — 在 Evgennii Ray 的这个内容丰富的视频课程中学习如何创建可扩展、高效的用户界面。探索盒模型、浏览器渲染、DOM 操作、状态管理、性能等等。
前端大师赞助商
如何在 2024 年创建 NPM 包 — 听起来很简单,但如果您想最好地遵循,则涉及很多步骤实践,引入有用的工具,并把事情做好。 Matt Pocock 在此介绍了整个过程,如果您愿意观看,还有 14 分钟的截屏视频。
马特·波考克
简而言之:
🤖 v0 是 Vercel 的一款 AI 驱动工具,最初用于根据您提供的提示生成“shadcn/ui”驱动的 React 组件。然而现在,它也具有基本的 Vue.js 支持。
Deno 1.46 已发布 并承诺成为[备受期待的 Deno 2.0 之前的最终 1.x 版本。](https://javascriptweekly.com /link/159086/d076523b1d) Deno 的 Node 兼容性进一步提高(它现在支持 Playwright 和更多的东西)并随 V8 12.9 一起提供。
📊 IEEE 发布了最新的年度顶级编程语言列表。 JavaScript 排名第三,但 TypeScript 跃升了几个位次,升至第四。
发布:
Prisma 5.19 – Node.js 和 TypeScript 的流行 ORM 添加了“TypedSQL”,这是一种以类型安全的方式编写原始 SQL 查询的方法。
📈 billboard.js 3.13 – 流行的 D3 图表库添加了面积步长范围图表。
pnpm 9.9 – 快速、节省空间的包管理器。
React Email 3.0、Ember 5.11、[Bun v1.1.26](https ://javascriptweekly.com/link/159094/d076523b1d)
📒 文章和教程
JS 日期即将被修复 — 处理日期和时间是众所周知的[程序员的痛苦领域](https:// javascriptweekly.com/link/159096/d076523b1d)而 JavaScript 并没有做太多事情来让它变得更容易。像 Moment.js 这样的库有很大帮助,但 Iago 看看 临时提案 ),随着时间的推移,它的功能将开始提供更多帮助。
伊阿古·拉斯特拉
关于编程艺术和实践的每周聊天 — 您每周都会与有趣的嘉宾讨论技术是如何制造的以及它的发展方向。
Stack Overflow 播客赞助商
JavaScript 生成器解释 — Jan 对用 JavaScript 解释生成器的文档和文章的质量感到沮丧,并开始解释以更高级的开发人员可以欣赏的方式进行操作。
简·赫斯特斯
从头开始实现 React-a-Like — 虽然您“实际上”不太可能想要这样做,但至少思考它可以对 React 引擎室中发生的事情提供启发。
罗比·普鲁赞
▶ 如何用 JavaScript 实现 2048 游戏 — Ania 回来了,她带来了她惯用的简单易懂的实现完整游戏的演练之一。 JavaScript 中的游戏。这次是 2048 滑动益智游戏。 (两周前她也玩了井字棋。)
阿尼娅·库博
了解基于角色的访问控制并简化权限管理 — 通过与文员组织一起管理用户角色来增强安全性并简化访问。
文员赞助人
📄 唯一被广泛认可的已弃用的 JS 功能 – 剧透:它是 with
。特雷弗·拉森
📄 使用集合在 JavaScript 中生成唯一的随机数 Amejimaobari
📺 Chain React 2024 会议的 21 场演讲 – React Native 事件。 YouTube
📄 在 Vue 自定义元素上公开内部方法 Jaime Jones
📄 React 中的接口隔离原则 Alex Kondov
🛠 代码和工具
TypeScript 5.6 候选发布版 — 一如既往,Daniel 对新功能进行了精彩的总结。不过,我们下周将更多地关注它,因为最终版本预计将于下周二(9 月 3 日)发布。
丹尼尔·罗森瓦瑟(微软)
Vuestic UI 1.10:Vue.js 3.0 UI 框架 — 具有 60 个可定制和响应式组件,并带有 [v1.10 版本]( https://javascriptweekly.com/link/159115/d076523b1d)它获得了显着的包大小优化、可提高构建时间性能的自定义编译器以及其他细微的增强功能。 GitHub 存储库
视觉用户界面
✅ Bye Bye Bugs — 通过 [QA Wolf] 在 4 个月内获得 80% 的移动和 Web 应用程序自动化 E2E 测试覆盖率(https://javascriptweekly.com/link/159117/d076523b1d)。由于 QA 周期只需几分钟(而不是几天)即可完成,因此不会出现错误。 安排演示。
QA Wolf 赞助商
Material UI v6:流行的 React UI 设计/组件系统 — 已有十年历史,流行的设计系统发布了最新的主要版本。重点是改进的主题、配色方案管理、容器查询和 React 19 支持。还有改进的模板 可供启发。
加西亚、比特图、安代等人。
npm-check-updates 17.0:将 package.json
依赖项更新到最新版本 — 也就是说,与指定的相反版本。它包括一个方便的“-i”交互模式,因此您可以查看潜在的升级,然后一一选择。
雷恩·里维尔
Code Hike 1.0:将 Markdown 变成丰富的交互式体验 — 针对代码演练和交互式文档等用例,[Code Hike](https ://javascriptweekly.com/link/159122/d076523b1d) 在创建充分利用现代网络的技术内容时弥合了 Markdown 和 React 之间的差距。
罗德里戈·庞博
Calendar.js:具有拖放功能的日历控件 — 一个没有依赖项的响应式日历,完全支持拖放(即使在日历之间也是如此) ),以及管理重复事件、导出、假期等事件的多种方式。
威廉·特鲁普
📊 Perspective 3.0 – 数据可视化和分析组件。核心是用 C++ 编写的,并编译为 WebAssembly,可以从 JavaScript 使用。他们的主页通过一个实例很好地展示了这一点。
json-viewer 3.5 – 以可读、用户友好的方式显示 JSON 数据。
♟️ Stockfish.js 16.1 – JavaScript 国际象棋引擎。
jest-dom 6.5 – 用于测试 DOM 状态的 Jest 匹配器。
标记为 14.1 – 快速 Markdown 编译器/解析器。
Javet 3.1.5 – Java + V8。将 JS 嵌入到 Java 中。
Pixi.js 8.3.4 – WebGL 引擎上的快速 2D。
由 Cooperpress 出版,由 Peter Cooper 编辑
“JavaScript”是 Oracle Corporation 在美国的商标
我们未获得 Oracle 的认可或隶属于 Oracle。
发布者