Plus the THX note, the backend data store to solve all your backend problems, and pnpm gets even better. |

#​696 — July 11, 2024

Read on the Web

Together with  Code Rabbit

JavaScript Weekly

es-toolkit: A Modern JavaScript Utility Library — Think Lodash but newer, faster, smaller, and with tree shaking and built-in TypeScript support. The reference guide shows off the supported functions so far – it’s not quite as extensive as Lodash, but it’s getting there with the goal being “to achieve full feature parity with Lodash.”

Viva Republica, Inc

What's Coming Next for ESLint — At eleven years old, ESLint is preparing itself for another eleven years by continuing to evolve into a language-agnostic linter that anyone can write plugins for. The new configuration system introduced in ESLint 9.0 is “just the beginning of significant changes” on the way.

Nicholas C. Zakas

Cut Code Review Time & Bugs in Half with AI — AI-first pull request reviewer that offers context-aware, line-by-line feedback, and smart chat. Trusted by 1000's of developers, it’s the most installed AI app on GitHub and GitLab marketplaces. Start your seven-day free trial today! It's forever free for open-source projects.

CodeRabbit sponsor

Speeding up the JavaScript Ecosystem: Isolated Declarations“TypeScript’s new isolated declaration feature is a game changer for sharing code among developers.” The latest in Marvin’s fantastic series about finding performance wins in how we do things in the JS world.

Marvin Hagemeister

IN BRIEF:

RELEASES:

📒 Articles & Tutorials

Recreating the THX 'Deep Note' in JavaScript — A fun bit of sound generation with Tone.js. Note that people have reported mixed results on different browsers, but it works for me. Just be careful it doesn’t ▶️ explode your teeth.

Alexander Keliris

Introducing @let in Angular — The new @let syntax extends Angular’s built-in template syntax with a better way to define variables inside component templates.

Mark Thompson and Kristiyan Kostadinov

Building a Hybrid Sign-Up/Subscribe Form with Stripe Elements — A practical guide on how to use custom flows, webhooks, and user metadata to build a single form that automatically subscribes new users using Stripe Elements.

Clerk sponsor

Sneaky React Memory Leaks: How the React Compiler Won’t Save You — While the new and exciting React Compiler can tackle a lot of issues and make most codebases more performant, it pays to be aware of tricky edge cases.

Kevin Schiener

📄 Resizing and Transferring ArrayBuffers – Dr. Axel continues his exploration of ECMAScript 2024. Dr. Axel Rauschmayer

📄 Protecting Against Third Party Code Changes with Script Integrity Chris Coyier

📄 How to Create a Chrome Extension with Vanilla JavaScript Esther Vaati

📄 Learn React Suspense by Building a Suspense-Enabled Library Slava Knyazev

📄 Running a Successful Meetup – From the team behind Remix. Bob Ziroll

📄 Moving from Express to Fastify Tom MacWright (Val Town)

🛠 Code & Tools

React Flow 12: Create Node-Based Editors & Interactive Diagrams — Part of xyflow, this makes it easy to create node-based UIs where you have interactive components wired together however you choose. There's a Svelte version too.

Moritz Klack and John Robb

❤️ Loving console.log Is Easy, but Hate 😡 Losing Context to View Messy Output — Developer productivity tools Wallaby.js, Quokka.js and Console Ninja show console.log values and errors right next to your code.

Wallaby Team sponsor

Croner 8.1: 'Cron' Triggering and Evaluation — Trigger functions to the schedule of your choice using cron syntax. It can also evaluate cron expressions to give you a list of upcoming times.

Hexagon

TinyBase 5.0: A Reactive Data Store for Local-First Apps — A data store that acts as a reactive backend to your apps if you want less headache building out backends. v5.0 includes a new mergeableStore type that can wrap your data as a Conflict-Free Replicated Data Type (CRDT). Homepage.

James Pearce

PLV8: Use JavaScript Functions in PostgreSQL — Did you know you can use JavaScript within Postgres for things like stored procedures and triggers? PLV8 is the extension that makes it happen. PLV8ify adds an extra layer by converting JS/TS files into PLV8 ready SQL.

PLV8JS Development Group

😘 Kiss Bugs Goodbye — Get 80% automated E2E coverage in just 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

  • file-type 19.1 – Detect file type from a Buffer, Uint8Array, or ArrayBuffer. It can now read from web streams too.

  • 🗓️ Schedule-X 1.50 – Material Design event calendar and date picker.

  • getJS 2.0 – Go-powered tool to grab Javascript sources/files from a site.

  • wa-sqlite 1.0 – WebAssembly SQLite with support for browser storage extensions.

  • QuickJS 1.2 – Execute JavaScript code in a WebAssembly QuickJS sandbox.

  • True Myth 7.4 – Safe, idiomatic null and error handling in TypeScript.

  • tinyqueue 3.0 – Small and simple priority queue in JavaScript.

  • MiniSearch 7.0 – In-memory fulltext search engine. (Demo.)

  • Jotai 2.9 – Simple, flexible state management for React.

  • Eruda 3.1 – A console/devtools for mobile browsers.

n