--- title: "A new challenger appears" publication: "JavaScript Weekly" issue: 678 published_at: "2024-03-07" canonical_url: "https://javascriptweekly.com/issues/678" --- Plus JavaScript is in WIRED magazine, Eloquent JavaScript 4th edition, and a linter for React performance. | #​678 — March 7, 2024 [Read on the Web](https://javascriptweekly.com/issues/678) Together with [![Mescius\](https://res.cloudinary.com/cpress/image/upload/c_fill,g_auto,w_454,h_111/e_make_transparent/co_white,e_outline:7/iwtw1igi5mjsbp1jqfn5.png)](https://developer.mescius.com/javascript-solutions?utm_source=CooperPress&utm_medium=JavaScript-Weekly&utm_campaign=JS-Tools-JS-Weekly-Sponsored-Link-3-24) JavaScript Weekly [![\](https://res.cloudinary.com/cpress/image/upload/w_1280,e_sharpen:60,q_auto/ryixfstb8ayzfmmtdtwq.jpg)](http://eloquentjavascript.net/) 📒 [Eloquent JavaScript Goes _Fourth_](http://eloquentjavascript.net/) — Coming several years after the third edition, the latest version of, perhaps, the best ‘all rounder’ book for learning JavaScript is here: _“adjusted to the realities of 2024 and generally touched up.”_ You can read it on the Web, but it’ll be available in print later on too. Marijn Haverbeke [Deno Introduces JSR: A New JavaScript Registry](https://deno.com/blog/jsr_open_beta) — The JavaScript Registry (a.k.a. [_JSR_](https://jsr.io/)) is a new TypeScript-first, ESM-only module registry designed for the entire JavaScript ecosystem. This post digs into what it’s all about and how it builds upon the success of npm. Dahl, Casonato, and Whinnery [![\](https://copm.s3.amazonaws.com/63a48d1b.png)](https://developer.mescius.com/javascript-solutions?utm_source=CooperPress&utm_medium=JavaScript-Weekly&utm_campaign=JS-Tools-JS-Weekly-Sponsored-Link-3-24) [Advanced JavaScript Tools to Empower Your Applications](https://developer.mescius.com/javascript-solutions?utm_source=CooperPress&utm_medium=JavaScript-Weekly&utm_campaign=JS-Tools-JS-Weekly-Sponsored-Link-3-24) — Build better web applications with powerful JavaScript developer tools including: SpreadJS Excel-like spreadsheet components, ActiveReportsJS reporting tools, Wijmo UI component suite, and Document Solutions viewers for PDF, Excel, Image, and more. MESCIUS inc sponsor ['Apple Backs Off Killing Web Apps, But The Fight Continues'](https://open-web-advocacy.org/blog/apple-backs-off-killing-web-apps/) — Last week, we linked to [an open letter](https://letter.open-web-advocacy.org/) imploring Apple to reverse [its moves around breaking PWAs](https://www.theregister.com/2024/02/08/apple_web_apps_eu/).. and it worked? Whatever the case, Apple continues to seem hostile to developers, and there's more to be tackled in this area. Open Web Advocacy **IN BRIEF:** - JavaScript is the focus of a _WIRED_ feature where the author ponders if [JavaScript Runs the World – Maybe Even Literally.](https://www.wired.com/story/javascript-runs-the-world-maybe-literally/) - The OpenJS Foundation says we should care [about package metadata interoperability](https://openjsf.org/blog/package-metadata-interoperability-collab-space-intro) and has put together a 'collab space' to focus on it. - 📅 This year's [JSHeroes conference](https://jsheroes.io/) takes place in Romania on May 23-24. - [Is client side security dead, or a critical part of the future?](https://weizmangal.com/2024/02/10/client-side-future/) asks Gal Weizman. **RELEASES:** - [Node.js v21.7 (Current)](https://nodejs.org/en/blog/release/v21.7.0) – Node gains a built-in way to output colored text, load and parse environment variables, and support multi-line values in `.env`files. - [TypeScript 5.4](https://devblogs.microsoft.com/typescript/announcing-typescript-5-4/) – Improved type narrowing, the `NoInfer` utility type, `Object.groupBy`, `Map.groupBy`, and more. - [Mermaid 10.9](https://github.com/mermaid-js/mermaid/releases/tag/v10.9.0)– Generate diagrams from text. - [Bun v1.0.30](https://bun.sh/blog/bun-v1.0.30), [Vue Language Tools 2.0](https://github.com/vuejs/language-tools/releases/tag/v2.0.0), [Ember 5.7](https://github.com/emberjs/ember.js/releases/tag/v5.7.0) [Sentry Launch Week: Making Debugging Fun](https://sentry.io/events/launch-week/?utm_source=javascriptweekly&utm_medium=paid-community&utm_campaign=general-fy25q1-launchweek&utm_content=newsletter-launchweek-register) — We’ll be making debugging fun, raffling swag and talking about all things developer, every. single. day. (For one week.) Sentry sponsor 📒 Articles & Tutorials [Ultimate Guide to Visual Testing with Playwright](https://www.browsercat.com/post/ultimate-guide-visual-testing-playwright) — ‘Ultimate’ is always a gamble in a title, but this tutorial is pretty thorough and will get you several steps down the road of fetching pages and making comparisons, all from JavaScript. Mike Stop Continues (BrowserCat) [Streaming HTML Out of Order _Without_ JavaScript?](https://lamplightdev.com/blog/2024/01/10/streaming-html-out-of-order-without-javascript/) — An interesting, yet short and sweet, demo of a browser feature that enables a technique you may not have imagined possible without JavaScript – note that [support](https://caniuse.com/declarative-shadow-dom) is still _rather fresh_in Firefox. Chris Haynes [Effortless GraphQL with Hasura and TypeScript Functions](https://hasura.io/?utm_source=newsletter&utm_medium=email&utm_campaign=javascript-weekly) — Connect to your data sources, generate a GraphQL API, and deploy globally — instantly. Want to write and use TypesScript functions directly in your GraphQL API? With Hasura, you can. [Check it out](https://hasura.io/?utm_source=newsletter&utm_medium=email&utm_campaign=javascript-weekly). Hasura sponsor ▶[Drizzle ORM Explained in 100 Seconds](https://www.youtube.com/watch?v=i_mAHOhpBSA) — The latest bitesize video from the always educational _Fireship_ channel covers [Drizzle ORM](https://orm.drizzle.team/), a fast, TypeScript-based way to work with a variety of database systems across numerous JavaScript platforms, from Node to Bun, Deno Deploy, Supabase Functions, Cloudflare Workers, and more. If you need more, there’s [▶️ a 13 minute ‘crash course’ to learning Drizzle, too.](https://www.youtube.com/watch?v=hIYNOiZXQ7Y) Fireship Fireship has a [▶️ Expo in 100 seconds video](https://www.youtube.com/watch?v=vFW_TxKLyrE) out too, providing a rapid explanation of what the React Native-based toolkit is about. [JavaScript Bloat in 2024](https://tonsky.me/blog/js-bloat/) — What’s the average size of JavaScript code downloaded per website? Spoiler alert: it’s a lot and will make anyone from the 56k dialup days cry. Nikita Prokopov [Tiny Predictive Text](https://www.adamgrant.info/tiny-predictive-text) — Using 2MB of JavaScript with no AI or LLMs in sight (but using a variant of a [Markov chain](https://en.wikipedia.org/wiki/Markov_chain)). Adam Grant [Coroutines and Web Components](https://lorenzofox.dev/posts/component-as-infinite-loop/) — _“We will see how coroutines can be used to model web components in a different way, and why you might like it.”_ Laurent Renard [Using Web Bluetooth to Read BBQ Temperature Sensor Data](https://pqina.nl/blog/web-bluetooth-api-read-bbq-temperature-sensor-data/) Rik Schennink 🛠 Code & Tools [![\](https://res.cloudinary.com/cpress/image/upload/w_1280,e_sharpen:60,q_auto/bfwzamtitn7cbjibwc7m.jpg)](https://million.dev/blog/lint) [Million Lint: A Linter for React Performance](https://million.dev/blog/lint) — [Million](https://million.dev/)’s mission is to make React apps faster and the new VS Code extension _Million Lint_ takes a new approach: imagine ESLint but for suggesting _performance_improvements. Aiden Bai [Your Google Translate for UI ↔️ Code](https://www.uxpin.com/merge/developers?utm_source=launch-campaign&utm_medium=partner&utm_campaign=javascript_weekly_merge_ai_03_24) — Don’t get lost in translation. Build UI with code and copy clean JSX off your design. UXPin Merge sponsor [BlockNote 0.12: A 'Notion-Like' Block-Based Text Editor](https://www.blocknotejs.org/) — [0.12.0](https://github.com/TypeCellOS/BlockNote/releases/tag/v0.12.0) is a significant release for this ProseMirror and TipTap-based editor that lets you drag and drop blocks, add real-time collaboration, add customizable ‘slash command’ menus, and more. It has an all new homepage, too, along with [new examples.](https://www.blocknotejs.org/examples) TypeCell [PixiJS v8: Build Striking 2D WebGL Experiences](https://pixijs.com/blog/pixi-v8-launches) — [PixiJS](https://pixijs.com/) is a _very_ mature, long standing rendering library that abstracts away all the pain of building fast 2D graphical experiences for the Web. v8 boasts _significant_ performance improvements, a WebGPU-backed renderer, and a variety of API improvements. If you’re new to Pixi, there’s [an interactive tutorial](https://pixijs.com/tutorials/getting-started#1) to show you the ropes. PixiJS Team [NSFW JS 4.1: Client-Side Indecent Content Checking](https://nsfwjs.com/) — A client-side TensorFlow.js-powered option for detecting potentially indecent images _before_ they even go over the wire. It’s not fool proof but may help as another layer of protection for both you and your users. [GitHub repo.](https://github.com/infinitered/nsfwjs) Infinite Red, Inc. [![\](https://res.cloudinary.com/cpress/image/upload/w_1280,e_sharpen:60,q_auto/enm4kfozwlvh6venxb7m.jpg)](https://plotly.com/javascript/) [Plotly 2.30: A JavaScript Graphing Library](https://plotly.com/javascript/) — A high-level, declarative charting library, built on top of D3 and stack.gl, with over 40 chart types, including 3D charts, statistical graphs, and SVG maps. Plotly, Inc. [ONBOARDING_LIB: A Headless Onboarding Library](https://onboarding-lib.vercel.app/) — An onboarding library for building accessible, customizable and persisted onboarding flows in React apps. The site itself is an example of such a flow. Neftic Oy [Finder 3.2: CSS Selector Generator](https://github.com/antonmedv/finder) — Given an element, it produces the shortest possible, but precise, selector that reaches that element. Anton Medvedev [Set Your JavaScript Job Hunt on Autopilot](https://first2apply.com/) — First 2 Apply automatically monitors most popular job sites and sends you instant notifications for new listings. Try it for free. First2Apply sponsor - [Partytown 0.10.0](https://github.com/BuilderIO/partytown) – Move intensive third-party scripts off the main thread and into a web worker. - [AdminJS 7.7](https://github.com/SoftwareBrothers/adminjs) – Automatic admin interface for Node.js apps. - [visx 3.9](https://airbnb.io/visx/) – Airbnb's React-based visualization primitives. - [NVM Desktop 3.2](https://github.com/1111mp/nvm-desktop/releases/tag/v3.2.0) – GUI for Node Version Manager. - [melonJS 17.0](https://melonjs.org/) – Browser-based 2D game engine. - [NodeBB 3.7](https://github.com/NodeBB/NodeBB) – Node.js based forum system. Published by [Cooperpress](https://cooperpress.com/) and edited by [Peter Cooper](https://twitter.com/cooperx86) 'JavaScript' is a trademark of Oracle Corporation in the US We are not endorsed by or affiliated with Oracle. [Change your email address](https://javascriptweekly.com/edit_subscription/*|UID|*) or [stop getting this newsletter](https://javascriptweekly.com/leave/*|UID|*). © Cooper Press Ltd · Fairfield Enterprise Centre, Louth, LN11 0LS, United Kingdom