Getting some closure

#​656 — September 28, 2023

Read on the Web

JavaScript Weekly

The Saga of Google’s Closure Compiler — Dan looks back at Google’s Closure Compiler, a JavaScript transpiler Google built in 2004 and used most heavily in the pre-TypeScript era to reduce the size of JavaScript files, check types, and otherwise handle common pitfalls. A neat bit of JavaScript history.

Dan Vanderkam

Speeding up the JavaScript Ecosystem: Polyfills Gone Rogue — Marvin’s mission to speed up popular libraries continues. First blogging on the topic last year, now he’s looking at the role polyfills play in making packages large and inefficient. There are two sides to every story, though, as this Hacker News thread found.

Marvin Hagemeister

Building Cross-Platform Desktop Apps with Electron — In this detailed video course Steve Kinney shares how to build robust, user-friendly Electron-based desktop apps, covering key concepts like main and renderer processes, inter-process communication, security, and more.

Frontend Masters sponsor

⚡️ IN BRIEF:

🐦 TC39 met earlier today and advanced several proposals including RegExp escaping and resizable ArrayBuffers (and nixed two, including Symbol.thenable).

If possible, please take the State of HTML 2023 survey. Your answers could help determine what features browsers focus on next! And if you don’t believe me, let Lea Verou convince you.

Verticalize introduces a vertical pipe-like function to JavaScript to help you chain operations together in a more visually appealing way, but.. it’s certainly a matter of taste.

The Preact team has an update on Preact Signals, their take on reactive programming.

Engineers from Vercel and Cloudflare have published a draft spec for a Sockets API for non-browser runtimes. Here’s why this all matters.

📱 Strada is a new library from 37signals that bridges the gap between server-rendered HTML and native controls in hybrid mobile apps. Here’s how it looks in practice.

Publishing packages with npm provenance is now generally available.

Cloudflare Workers is a popular serverless platform for running JavaScript functions at the edge and it now has an all new pricing model that’s certainly a lot more appealing.

🎉 RELEASES:

Shoelace 2.9 – Suite of framework agnostic components. Changelog.

Dependency Cruiser 14.0 – Visualize & validate dependencies.

Ember 5.3, pnpm 8.8, and Bit 1.0.

📒 Articles & Tutorials

One Thing Nobody Explained To You About TypeScript — The author makes a strong case for creating a separate tsconfig.json for each environment your code runs in: “Today, I write about one thing about configuring TypeScript that took me years to realize. I’m sure you’re making the same mistake as I did.”

Artem Zakharchenko

Upgrading Frontend Dependencies with Confidence — Writing tests for logic in our apps is easy, but how can you determine if a component isn’t rendering properly? Visual regression testing. Here’s a workflow based on GitHub Actions, Playwright, and Argos.

Sébastien Lorber

React Authentication — Without Complexity — Userfront streamlines authentication & access control so engineers can focus on their core business. Read the docs now.

Userfront sponsor

Understanding the Modulo % Operator — Tackles the oft misunderstood operator in Josh’s visual, beginner-friendly style.

Josh W Comeau

 Why the Temporal API is Awesome — It’s still a stage 3 proposal, but the Temporal API works around some of Date’s limitations without third-party libraries.

Taro Dragan

Drawing on Google Maps with Drawing Manager — A particularly thorough, code-rich followup to Integrating Google Maps in React.

Pavlo Chabanenko (Sudolabs)

Thoughts on Svelte 5 as a 3+ Year Full-Time Svelte Dev — Thoughts that lead to the proposal of Pelte, an attempt to spark conversation rather than a real tool (so far).

Filip Tangen

The Forecast For Your Next Database: Strongly Typed and Cloudy

EdgeDB sponsor

Building Token Based Authentication with JWTs on Fastify

Arif Imran

The Angular Renaissance: Why Frontend Devs Should Revisit It

Loraine Lawson (The New Stack)

How React Server Components Made Our Site Faster

Christian Mathiesen (Frigade)

Replacing RxJS with a State Machine

Ben Nadel

🛠 Code & Tools

Tesseract.js 5.0: JavaScript OCR for 100+ Languages — A port of the C++-based Tesseract library used to extract text from images. v5.0 is a big deal as there are huge file size reductions resulting in a 50% decrease in runtime size, a similar reduction in memory use, and iOS 17 compatiblity. GitHub repo.

Tesseract Team

ChatGPT.js: A Library for Working with ChatGPT via the DOM — Includes a fairly extensive API that lets you interact with ChatGPT for use in Chrome extensions, Tampermonkey scripts, and so on.

KudoAI

Industry-Leading JavaScript Components for the Web — Build your apps with powerful JavaScript developer tools including reporting solutions, spreadsheets, and UI components.

GrapeCity sponsor

Instant.dev: A New Postgres-Focused ORM for JavaScript — Aims to introduce a more Ruby on Rails/Active Record-style experience to the increasingly rich JavaScript ORM ecosystem.

instant․dev

Chardet 2.0: Character Encoding Detection Library — It uses statistical methods to determine the most likely encoding of a supplied buffer, string, or file, from a selection of about 30.

Dmitry Shirokov

👾  n64js: A Nintendo 64 Emulator in JavaScript — There’s a Web-based version to try (if you have the right files) or just ▶️ watch a video.

Paul Holden

🗓 React Chrono 2.3 – Timeline component. Some examples.

ip-address 9.0 – Parse & manipulate IPv4/6 addresses.

Sonner 1.0 – Toast notifications React component.

Jazzer.js 2.0 – In-process fuzzing for Node.js.

JZZ 1.7 – MIDI library for Node and browsers.

Preact 10.18.0

esbuild 0.19.4

💻 Jobs

Frontend Developer 🚀 (Remote, Work from Anywhere 🏖️) — Enjoy TypeScript, React, GraphQL and performance? Join in building our super-fast headless commerce service with a beautiful UI.

Crystallize

Full-Stack Engineer, Remote in EU or Berlin — Join our small team to build an insurance product that people love. We use React, TypeScript, Prisma, NestJS and more.

Feather

Find JavaScript Jobs with Hired — Hired makes job hunting easy-instead of chasing recruiters, companies approach you with salary details up front. Create a free profile now.

Hired

🕹 The hardest JavaScript game ever?

JS Crush: Match Values That Are Equal in JS — The author’s comment that this is “a game that mocks JS equality quirks, the most absurd feature of the language” should put you in the right frame of mind for giving this Candy Crush-inspired casual game a go!

Herrington Darkholme

P.S. I’m encountering folks who haven’t heard about the ▶️ TypeScript Origins documentary we featured last week, so I wanted to mention it again in case you have the time spare. I enjoyed it and learned a lot too.

Microsoft spills the tea on TypeScript

#​655 — September 21, 2023

Read on the Web

JavaScript Weekly

▶  TypeScript Origins: The Documentary — You know you’ve made it when you get your own documentary! This has just dropped but is well produced, packed with stories from TypeScript’s co-creators, users, and other folks at Microsoft, and kept me entertained. It goes particularly deep into the motivations and process behind its creation, including why Microsoft felt it was worth pursuing.

OfferZen Origins

🔥 The takes get spicer 25+ minutes in as various TypeScript users chip in with their opinions, and even Daniel Rosenwasser, now program manager of the TypeScript team, says he initially worried that Microsoft might “f**k it all up.” 😅 Ryan Dahl pops up about an hour in too.. so I hope you’ve got some time spare.

Patterns for Reactivity with Modern Vanilla JavaScript — When data changes, you often want to do things, and the process that makes that happen is reactivity. While many libraries or frameworks like React or Vue offer reactive solutions out of the box, you can do it all with vanilla JavaScript too, and this post digs into many of the patterns you might need to use, complete with examples.

Marc Grabanski

Handsontable: Data Grid With Spreadsheet Superpowers — There are a lot of JavaScript data grids out there, but none are quite like Handsontable. Its Excel-like design, keyboard shortcuts, and navigation make it the perfect tool for developers.

Handsontable sponsor

Deno 1.37: Modern JavaScript in Jupyter Notebooks — Not content to let Bun take all the headlines, Deno has come up with something pretty neat here. Deno 1.37 ships with a Jupyter Notebook integration so you can create interactive REPL sessions but using the JavaScript you know and love, rather than Python.

The Deno Team

JavaScript Minification Benchmarks — A frequently updated benchmark suite and results comparing the speed and quality of JavaScript minification across a variety of tools including esbuild, Babel, Bun, SWC, and Uglify.

Hiroki Osame

⚡️ IN BRIEF:

The Svelte team offers a sneak peek at the forthcoming Svelte 5 and introduces the idea of ‘runes’: “Like every other framework, we’ve come to the realisation that Knockout was right all along.”

Happy 27th birthday to JScript! JScript was a version of JavaScript that Microsoft put into IE 3.0 primarily to avoid trademark issues around the name of JavaScript. No-one cares much about that anymore, despite Oracle still technically holding the JavaScript trademark.

Folks are discussing whether Node.js needs a mascot of its own.

Want to support anyone doing great work on JavaScript projects? You can nominate them for a GitHub Star.

If you rely upon the npm package download counts at all, the daily counts for all packages was zero on September 13 and 14 (example). Why? “This issue remains under investigation,” says npm support.

🎉 RELEASES:

Remix v2 – Popular full stack web framework.

Bun 1.0.2 – Bugfixes, faster bun –watch, it now uses V8’s Date parser, and Fastify apps now work too.

Node.js v20.7 (Current) – Multiple –env-files now supported.

Next.js 13.5 – Faster, faster, faster.

📒 Articles & Tutorials

Getting Network Activity Under Control with Priority Hints — A look at how browsers can prioritize the loading of resources, how you can explicitly specify a priority when using fetch, and how different ways of loading scripts are prioritized.

Alex MacArthur

Securing Node Apps by Analyzing Real Command Injection Examples — When code can be manipulated to run unintended, arbitrary commands, it’s never going to end well.

Liran Tal

🚀  Coming Soon: Fixed-Cost Monthly Maintenance by UpgradeJS.com — Too much tech debt in your JavaScript app? Let us help. Slow and steady upgrades at your own pace. Releasing next week.

🌳 Bonsai by UpgradeJS.com sponsor

🧭  What’s New in Safari 17 — Safari 17 is now in beta on iOS 17 with the final release dropping across all of Apple’s platforms next week. On the JavaScript front, Safari and WebKit now fully support the Storage API, WebGL in Offscreen Canvas, v flag support on regexes, Set operation methods, URL.canParse, plus the much anticipated support for PWAs in macOS Sonoma.

Jen Simmons and the WebKit team

Testing Out the Alpine.js Intersect Plugin — A wrapper for the Intersection Observer API.

Raymond Camden

▶  How to Make Forms in Angular Reusable

Decoded Frontend

Clean Layout Architecture for Vue Applications

Fotis Adamakis

Incremental Static Regeneration for Angular

Enea Jahollari

🛠 Code & Tools

fx 30: The Go(lang)-Powered Terminal JSON Viewer — Yes, it’s written in Go, but fx has long been a useful tool for looking at JSON files, and it has just been rewritten from the ground up with a new look, regex search, fuzzy search, and support for “even the most massive JSON files.” You don’t need to worry about Go at all; it’s simply a fantastic tool for looking at JSON.

Anton Medvedev

Breakpoints and console.log Is the Past, Time Travel Is the Future — 15x faster JavaScript debugging than with breakpoints and console.log, supports Vitest, jest, karma, jasmine, and more.

Wallaby.js sponsor

Mantine 7.0: The Popular React Component Library — A big release for what is now one of the most popular React component libraries. As of v7, Mantine no longer relies on Emotion and components come with native CSS files, all components now support the system-set color scheme, CSS modules are now the default way to style components, and there are many smaller enhancements too.

Mantine Team

Chrono 2.7: A Natural Language Date Parser — Give it a string like “today”, “last Friday”, “2 weeks from now”, or even an entire date and time, and it’ll come up with a date object to suit.

Wanasit Tanakitrungruang

Theatre.js 0.7: Motion Design for the Web — Can be used both programmatically or via a visual editor to animate objects created with things like Three.js, React Three Fiber, HTML/SVG, or even just tween variable values.

Theatre.js Project

Track Errors and Performance Issues in Every Part of Your Stack

Sentry sponsor

Swup: A Flexible Page Transition Library for Server-Side Rendered Sites — A library that benefits hugely from checking out the demos. v4.4 adds experimental ViewTransition support.

Georgy Marchuk

Create Chrome Extension: A Scaffolding Tool for Chrome Extensions — Similar to create-react-app or Yeoman, this is specifically for starting extension development, with support for several frameworks, HMR, and light/dark modes.

Yalda

💡 Chrome Extension CLI is another option in this space.

Neutralinojs 4.14.0 – Imagine something like Electron but without the browser engine being bundled in. Supporting Linux, Windows, and macOS, it instead leans on what’s already present.

📅 React Lite Month Picker
↳ An elegant way to let users select a specific month.

React-Virtuoso 4.6 – Powerful virtual list component.

Faker 8.1 – Generate large amounts of fake data.

🔊 Peaks.js 3.1
↳ The BBC’s audio waveform UI component.

Ember.js 5.3

💻 Jobs

Nest.js Back-End Developer — Lead the development of a HealthTech platform, focused on Caregiver support. TypeScript, Nest.js, PostgreSQL, AWS, React/Next.js.

Carallel

Find JavaScript Jobs with Hired — Hired makes job hunting easy-instead of chasing recruiters, companies approach you with salary details up front. Create a free profile now.

Hired

“The best programs are the ones written when the programmer is supposed to be working on something else.”

___
Melinda Varian

JavaScript, ML and LLMs

#​654 — September 14, 2023

Read on the Web

JavaScript Weekly

Bun 1.0: Is It a Toolkit? Is It a Runtime? It’s Both — You’ve used Node, you’ve seen Deno, now Bun has grown up too. It’s a performance-oriented server-side JS runtime built atop JavaScriptCore and makes the unique claim of being “a drop-in replacement for Node.js.” It includes extras like transpilation, bundling, package management, and a Jest-compatible test runner too. The post goes into a lot of depth, but we enjoyed the Bun team’s ▶️ 10 minute introductory video. Does Bun deliver on all its promises yet? No. Is it promising? Yes.

Jarred Sumner et al.

Why Does every() Return true for Empty Arrays? — Nicholas wondered how a condition can possibly be satisfied when there aren’t any values to test, so he dug into the language specs to understand the logic.

Nicholas C. Zakas

The Complete UI Component Library For Enterprise Web Apps — A professional UI component library with power widgets like data grid, calendar, scheduler & Gantt charts. Includes API docs, guides and an unreasonable amount of demos to play with. Seamlessly integrates with React, Angular, Vue & Salesforce apps.

Bryntum sponsor

A First Look at TypeScript 5.3TypeScript 5.2 landed a few weeks ago, which means TypeScript 5.3 is already in the works (the final release is due in November), with possible features to think about including Import Attributes, throw expressions, and isolated declarations.

Matt Pocock

⚡️ IN BRIEF:

📅 ViteConf is taking place this October 5-6. It’s free and online.

The August 2023 build of VS Code has just been released and includes improvements to the JS debugger including WebAssembly module decompilation, as well as Move to File and Inline Variable refactorings.

Linus Groh is working on a JavaScript engine in Zig called Kiesel, mostly as a learning project, but it’s passing 25% of test262 after four months of effort.

While searching for something else, I encountered this JavaScript tutorial from 1996 that’s still online. Amazingly, most of it still works fine today.

Esteemed Microsoft code archaeologist Raymond Chen looks at how freestanding JS functions using this can be mistaken for a constructor by VS Code’s static analyzer.

🎉 RELEASES:

MikroORM 5.8 – Powerful Node.js ORM.

Reason 3.10 – Write code in OCaml, but for the JS ecosystem.

Happy DOM 11.0 – A JS implementation of a web browser sans UI.

Node.js v20.6.1 (Current)

📒 Articles & Tutorials

JavaScript’s New Array Grouping Methods — A look at Object.groupBy and Map.groupBy. The proposal including these methods is currently at stage 3 at TC39, but initial support is creeping into dev builds of browsers.

Phil Nash

JPEG and EXIF Data Manipulation in JavaScript — A look at how to pick through the JPEG format and read and replace EXIF tags directly without leaning on a third party library.

Cédric Patchane

Frontend Performance Monitoring 101 — Learn the basics of JavaScript application performance monitoring to see (and fix) slow faster. Join us for a live AMA.

Sentry sponsor

▶  Building a Mario Game Complete with Auth and Score Saving — Ania tackles the implementation of a game in her usual thorough, step-by-step manner.

Ania Kubów

Running a Playwright Script on AWS Lambda — If you’ve struggled to make it work too, Matt has some pointers.

Matt Steele

A New Method to Validate URLs — URL.canParse isn’t broadly supported yet, but can be easily polyfilled.

Stefan Judis

How to Run a GitHub Gist with npx — This is an interesting way to quickly deploy a script.

Kelly Fox

🕑 Lei Mao has a cute example of using React in an ad-hoc way on a web page to dynamically render an analog clock. No build step. No JSX.

▶️ Jack Herrington refutes six reasons not to use React.

🛠 Code & Tools

Shadcn for Vue: Components You Can Copy and Paste — A community-led Vue port of the React-oriented shadcn/ui, a suite of attractive components built with Tailwind CSS and Radix UI, thus making them easy to ‘copy and paste’ into your own apps.

Radix Vue Project

FlexGrid by Wijmo: The Industry-Leading JavaScript Datagrid

Wijmo from GrapeCity sponsor

npm-check-updates: Update package.json Dependencies to Latest Versions — That is, as opposed to the specified versions. It include a handy -i interactive mode so you can look at potential upgrades and then opt in to them one by one.

Raine Revere

Starry Night 3.0: GitHub-Like Syntax Highlighting — GitHub’s own syntax highlighter isn’t open source, but Starry Night uses WebAssembly (to get access to the Oniguruma regex engine) to get as close as it can.

Titus Wormer

Vuestic 1.8: Open Source UI Library for Vue 3 — A library of more than 60 customizable components. v1.8 introduces new Layout and Textarea components. Official homepage.

Epicmax

Goxygen 0.7: Quickly Generate a Go Backend for a JS Project — A tool that sets up a new Go-based project with Angular, React, or Vue in the front-end, and Docker and Docker Compose files to make it all work.

Sasha Shpota

Deliver Real-Time Live Streams with Amazon IVS — Amazon IVS enables developers to create dynamic real-time and low-latency video experiences. Click here to learn more.

Amazon Web Services (AWS) sponsor

xterm.js 5.3.0: Build Terminals in the Browser — It’s used in many projects like VS Code, cPanel, Azure Cloud Shell, and other browser-based IDEs. There’s a live demo on the homepage to try.

xterm.js team

Gridstack.js 9.2
↳ Build interactive dashboards in minutes. (Demos.)

Accessible Astro Starter 3.0
↳ A starter theme for an Astro-powered blog.

Ant Design 5.9
↳ Popular React UI library & design language.

📊 Reveal.js 4.6 – Write presentations in HTML.

Electron 26.2

💻 Jobs

Find JavaScript Jobs with Hired — Hired makes job hunting easy-instead of chasing recruiters, companies approach you with salary details up front. Create a free profile now.

Hired

🤖 A little JavaScript AI-side..

AI, LLMs and machine learning have caught the imagination of many developers recently, whether through training and deploying models, calling out to third party APIs (like those OpenAI offers), or using tools like GitHub Copilot to write code. It’s common, however, for a lot of AI/LLM experimentation to take place in Python, rather than JavaScript..

Nonetheless, there’s an increasing number of projects in the JavaScript AI/ML space worth keeping an eye on, as well as an upcoming AI developer event being organized by two folks from the JavaScript space:

Transformers.js: State-of-the-Art Machine Learning for the Web — A JavaScript library designed to be functionally equivalent to Hugging Face’s transformers Python library meaning you can run the same pretrained models using a very similar API. You can do things like ML-powered speech recognition directly in your browser using OpenAI’s Whisper model. GitHub repo.

Joshua Lochner et al.

Microsoft TypeChat: An Approach for Type-Safe LLM Responses — Anders Hejlsberg and Daniel Rosenwasser of TypeScript fame are just two of the prominent names attached to this project, demonstrating the huge interest within MS for LLMs. TypeChat’s goal is to work around the issue of LLMs outputting unstructured natural language and to direct output into a typed form.

Hejlsberg, Lucco, Rosenwasser et al.

WebLLM: Run LLM Models in the Browser with WebGPU — Less directly JavaScript, as it uses WebGPU, but yet another way to run large language models directly within the browser and that you can control from JavaScript. GitHub repo.

MLC LLM

TensorFlow.js: Machine Learning for JavaScript Developers — Slightly lower level, but a great way to train and deploy models in the browser or in Node.js. There are, of course, lots of demos, too.

TensorFlow

JavaScript Library Lets Devs Add AI Capabilities to the Web

Loraine Lawson (The New Stack)

▶  A Primer on AI for Developers with Swyx from Latent Space

Svelte Radio

📅 Plus, two JavaScript folks are putting on an AI event..

As part of my interest in AI and ML, I’m attending what promises to be the technical AI event of the year in San Francisco next month: The AI Engineer Summit.

The emerging ‘AI engineer’ category is at the intersection of AI/ML and code: where software engineers can access and implement powerful AI models with just an API. Andrej Karpathy believes that “there’s probably going to be significantly more AI engineers than there are ML engineers / LLM engineers.”

With speakers representing companies like OpenAI, Microsoft, Replit, Vercel, AutoGPT, Adept, LlamaIndex, and Notion, at the Hotel Nikko this October 8-10, the event is organized by two folks well known in the JavaScript world: Swyx (who you may remember from his popular The Third Age of JavaScript post) and Benjamin Dunphy, formerly of Reactathon and Jamstack Conf. You can apply to attend or get a free remote ticket to tune in from wherever you are.

If you’re going to the AI Engineer Summit, I’ll see you there!

👋

TypeScript 5.2, Node 20.6, and Astro 3.0

#​653 — September 7, 2023

Read on the Web

😅 We’re back! After two weeks enjoying the blistering desert heat of Las Vegas and downpours of Storm Hilary, I’m ready to get back to the weekly JavaScript roundups – fingers crossed we’re here each week till Christmas now 🙂
__
Peter Cooper and the Cooperpress team

JavaScript Weekly

Astro 3.0 Released: The All-in-One Web Framework — An increasingly popular, turbo-charged site generator comfortable with not just static sites, but dynamic and interactive ones too by way of its ‘islands’ approach. You can use React, Vue, Svelte, Solid, and others, with it, and v3 adds View Transitions API support (more on that here) which can result in striking creations like this Spotify ‘clone’. It requires a play to really ‘get it’ but it’s great.

Astro Team

Good news – now SvelteKit supports the View Transitions API too 😉

Node.js 20.6 Released with Built-In Support for .env Files — The official release post covers everything new in 20.6, but the highlight is support for .env environment files to set environment variables dynamically when a script is run without requiring a third-party library like dotenv.

Phil Nash

Simplify Security and Compliance for Your Apps — Introducing Pangea: comprehensive API-based security services for developers. Effortlessly integrate foundational security services like Authentication, Authorization, and Audit Logging to create a safer app experience and accelerate your time to market.

Pangea sponsor

Bye to Rome and Hi to Biome for JS Formatting and Linting — First announced in 2020, Rome is/was an ambitious effort to create a unified frontend dev tool to bring ideas from Babel, ESLint, webpack, etc. into one place. After forming a company around Rome and raising money two years ago, things seem to have gone awry, with its key maintainers forking the project as Biome.

Emanuele Stoppa and the Biome Team

⚡️ IN BRIEF:

Version 1.0 of Bun, the notably fast JavaScriptCore-based JS runtime, is due to launch in the coming hours. There’s a livestream and, we assume, a launch post due to land here very soon.

In other ‘alternative runtime news’, the Deno team has announced native npm support on its Deno Deploy platform. They’ve also announced Deno KV is in open beta.

Mozilla: “Over the course of the year Firefox has improved by around 40% on the Vue.js benchmark” – find out why.

David Heinemeier Hansson, the creator of Ruby on Rails, announced that they’re dropping TypeScript from Turbo (a library commonly used with Rails) in favor of plain old JavaScript. Social media drama ensued.

What’s going on with the Gatsby React framework? Folks are noticing there’s not a lot going on with it lately and that 🐦 Netlify layoffs had a big impact. Netlify does, however, say 🐦 updates are coming.

GitHub has made changes to its homepage feeds. Quite a few people are unhappy about it, though.

“The CSS-in-JS sector has plateaued,” says the latest State of CSS survey.

What’s new in Svelte as of September 2023? Quite a lot.

🎉 RELEASES:

TypeScript 5.2 – Complete with the much awaited using declarations..

Node-RED 3.1 – The powerful low-code/visual programming environment gets some key improvements in its editor.

jq 1.7 – It’s not JavaScript, but surely the best JSON processing tool to exist.

Ky 1.0 – Simple HTTP client based upon Fetch for browsers, Node & Deno.

jQuery 3.7.1 – Oh yes indeedy 🎉

Cypress 13

📒 Articles & Tutorials

Making Sense of React Server Components — This is fantastic and exactly what it says on the tin, – we’ll be focusing on it more in next week’s React Status newsletter though 😉

Josh W Comeau

You Don’t Need to Learn Svelte – Here’s Why — I mean.. you kinda do, but Kavii’s excitement is infectious and Svelte’s approach remains refreshing.

Kavii Suri

item: Using Labeled Loops in JavaScript — If using labels gives you flashbacks to BASIC and GOTO statements, I sympathize, but in JavaScript, labels open up an interesting control flow technique. More about this on MDN. continue item;

Ben Nadel

Build a Documentation Chatbot with ChatGPT and EdgeDB — Let’s do it using EdgeDB’s intuitive data model & query language, as well as its powerful TypeScript query builder.

EdgeDB sponsor

A Wide View of Automated Testing in React Apps — A straightforward and to the point introduction to why you might use automated testing, how to get going in the scope of a React app, and what to be testing.

The React Handbook

How to Create a Dual-Mode Cross-Runtime JavaScript Package — Specifically, supporting both ESM and CommonJS, and across runtimes like Node, Deno and the browser.

Hexagon

Benchmarking 24 CSV Parsing Approaches — The most extensive CSV parsing benchmark I’ve seen. The author is himself the creator of the μDSV CSV parsing library and wanted to check out the common ‘lightning fast performance’ claims of other libaries.

Leon Sorokin

The Complexity of Building an Efficient Node.js Docker Image — It’s possible to get huge reductions in image size and build time and Samuel shares his approach here, but he also questions whether all this work should be necessary.

Samuel Bodin

Learn High-Level Compilers, Tools, & Techniques – in JavaScript!

Dmitry Soshnikov Education sponsor

14 Linting Rules To Help You Write Asynchronous JS Code

Maxim Orlov

How to Create a Chrome Extension in 10 Minutes Flat

James Hibbard

🛠 Code & Tools

Peaks.js 3.0: View and Interact with Audio Waveforms — A JavaScript component for browser-based audio waveform visualization that comes from the BBC’s R&D department. There’s a live example on the homepage. GitHub repo.

BBC

🎸 SVGuitar: Create SVG-Based Guitar Chord Charts — Why not continue with the musical theme? 😁 You can experiment with this one via this live demo.

Raphael Voellmy

FormKit 1.0: The Open-Source Form Framework for Vue — Ships with production-ready scaffolding like inputs, forms, submission and error handling, and validation rules.

FormKit, Inc.

Add Authorization, MFA, Biometrics and More to Your JavaScript App in Just Minutes — It’s about time that somebody talked some sense about OAuth and JavaScript. So we did. You’re welcome.

FusionAuth sponsor

Plate: Roll Your Own Slate-Based Rich-Text Editor — A framework for building React-based rich text editors where you can select the specific features and functionality you need. GitHub repo.

Ziad Beyens

Math.js: An Extensive Math Library for Node and Browser — Work with complex numbers, fractions, units, matrices, symbolic computation, etc. A long standing library now, but continuing to get frequent updates. GitHub repo.

Jos de Jong

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

💻 Jobs

Find JavaScript Jobs with Hired — Hired makes job hunting easy-instead of chasing recruiters, companies approach you with salary details up front. Create a free profile now.

Hired

🧑‍💻 Got a job listing to share? Here’s how.

npm-to-yarn – Convert npm commands to yarn and vice versa.

export-to-csv – Export arrays of objects to CSV.

Marked 8.0 – Fast Markdown parsing library. (Demo.)

Perfectionist 2.0 – ESLint plugin for sorting various data.

React Native Vision Camera 3.0
↳ Powerful camera control for React Native apps.

YouTube.js 6.3
↳ Client library for YouTube’s internal API.

Ink 4.4 – Use React to build CLI apps.

Prisma 5.2

ffmpeg.wasm 0.12.6

Advancing the NodeSource Node.js Package Repo (Including User-Requested Upgrades!)

For over a decade, NodeSource has developed and maintained a Node.js package repository that, has become the standard for production use globally. We are excited to announce some significant updates to this repo that include a large number of items related to user requests. (Note that there is an important point in the section below about using the new repo as the old repo will remain available but no longer be supported with new versions)

We handle over 100 million downloads of the open-source binaries each year, developers rely on our timely releases (fastest in the ecosystem) and tooling to simplify their use of the Node.js Runtime. Every time there is a release, including security updates, our team delivers updates in less than 48 hours.

Img 1- Type of Distributions

As part of our ongoing commitment to the ecosystem, we want to ensure that developers who rely on our repository have access to a robust and efficient resource led by our Node experts. A key objective with this update was to enhance the Node.js package distribution experience, making it more intuitive, feature-rich, and responsive to user needs. In the following sections, we’ll dive into the improvements we’ve made, highlighting the changes that promise to make your development journey easier.

Check it out HERE and let us know your thoughts!

New Features

Version Choice (Made Easy): We have added versatility with the latest update to our repository, gone are the days of being locked into the latest Node.js release. Now, you can choose the specific version of Node.js you need to tailor your environment to the unique needs of your project.

Universal distribution support: Say goodbye to server customization and compatibility concerns. Our repository now seamlessly supports all distributions. You don’t need to adjust for each new OS version, all are supported out-of-the-box.

Seamless CDN transition: We’ve revamped our CDN provider to address cache-related issues. This change ensures a smoother, more reliable experience and eliminates cache-related hiccups..

Streamlined installation requirements: Installing Node.js should be a snap. That’s why we’ve carefully configured the necessary installation requirements. The package now includes the required glibc and Python3 configurations, making the setup more accessible.

Simplified installation process: Recognizing the diversity of our user base, we’ve redesigned the installation process—no more complex scripts to decipher. Instead, we’ve streamlined it to a few simple lines of code. Installation is now easy and accessible for users of all skill levels.

These improvements demonstrate our commitment to providing a repository experience that keeps pace with technological demands and prioritizes user convenience and satisfaction.

⚠️ IMPORTANT: Use the new repository!

Failing to migrate to the new repository could be significant, most notably is the potential denial of access to the latest versions of Node.js. Because these latest versions will be distributed exclusively through the new repository, those who do not migrate will miss important updates, improvements, and features.

For more information on the new repository including details regarding the migration process, we recommend you visit the following link for the repository wiki, which provides comprehensive information on making a successful transition.

Our Distributions Journey

Our mission to help developers gain access to Node.js and enable the enterprise to adopt it safely has been a key driver for our binary distribution effort. We have seen tremendous growth in the number of downloads every year from our distributions across the globe.

Img 2- Request per Country and Data Transfer by Country per 24H

Our flagship product, N|Solid, an enterprise-grade version of the Node.js Runtime, is a testament to this devotion to OSS, and was a key part of why we created this repo that is used by millions of developers to power a massive number of applications. Our Node and Infra experts will continue to support this repo for the community with great pride.

> This repository has seen a staggering number of annual package downloads, over 120 million, and a data consumption rate of around 300 terabytes per month. This endeavor hasn’t been without its challenges, as maintaining such a repository has required extraordinary dedication and effort.

Earlier this year we made the decision to open-source our N|Solid Runtime marking a key turning point for NodeSource, inspiring us to extend our commitment to the repository. (The OSS version of N|Solid will be available in October of this year)

_> Recognizing the symbiotic relationship between Node.js and N|Solid, we decided to merge their paths. _

By distributing Node.js and N|Solid together, we’re creating a unified ecosystem that takes advantage of the power of Node combined with the advancements of N|Solid. This dynamic coupling invites those familiar with our repository to explore what we refer to as “enterprise Node.js,” or the Node.js that enterprises have been waiting for. This synergy is a testament to our commitment to both the Node.js community and the growth of enterprise-grade solutions.

Conclusion

As we embark on this transformative phase, we reflect on our journey in this ecosystem. We’ve been privileged to play a role in supporting developers and companies, and we’re excited to further enhance our collaboration.

Today, we invite you to explore our new repository, HERE, – a hub of choice and compatibility, empowering you to select the Node.js version that suits your needs. But that’s just the beginning of the story. If you are interested in our Enterprise version N|Solid it’s available to you for FREE with additional pricing packages for larger projects/teams and support.

Stay tuned for further enhancements as we refine and enrich your experience.Thank you for being a part of our journey. Here’s to many more years of collaboration and growth!

About NodeSource, Inc.

NodeSource, Inc. is a technology company completely focused on Node.js and is dedicated to helping organizations and developers leverage the power of this technology. We offer the leading APM for monitoring and securing Node.js and provide world-class support and consulting services to help organizations navigate their Node.js journey. #KnowYourNode. For more information, visit NodeSource.com and follow @NodeSource on Twitter.