Eliminating JS Framework Lock-in with Web Components? — Can you build an app where each component is using a different framework? Amazingly, yes. Web components aren't new but are 'having a moment' and Jake demos an interesting, if contrived, use case. He explains: “Say you’re writing a Vue app and you really want to use a library that’s only available as a React component. You can wrap that library in a web component and use it in your Vue app...”
Announcing Deno Cron — Deno adds a cron-style feature to run code on a pre-defined schedule using Deno.cron. This works locally (behind --unstable) in a long-running process, but on Deno Deploy it analyzes the definition and runs the code on time, as you’d expect, with no extra work needed.
🟩 The two LTS Node.js branches have received releases backporting features from newer versions: Node v20.10.0 (LTS) gains WebSocket and an experimental flag to auto-detect ESM code. Node v18.19.0 (LTS) gets npm 10 and tweaks for customization hooks and loaders.
🎙️ Off The Main Thread is a new podcast featuring Jake Archibald and Surma (both formerly of Google / HTTP 203).
🎂 Not to do with JS – though some of you may use it – but Notepad++ is 20 years old. It's a popular open source code editor and Notepad replacement for Windows.
pnpm 8.11 – Fast, disk space efficient package manager.
“As a principal engineer, I view it as my role to keep us off the bleeding edge as much as possible. That way, when we really do need to innovate, we have the capacity to do so. And when we don't need to, we can go really freaking fast.”
Daniel Rosenwasser (Microsoft)
Vite 5.0 Released — The Vite suite of frontend tooling may have started life in the Vue.js world, but is now used by projects aplenty including SvelteKit, Remix, and Astro. v5 now uses Rollup 4, removes many deprecated features, and requires Node 18+. There’s a migration guide to help with your v4 to v5 progression.
▶ 4 Web Devs, 1 App Idea — Salma Alam-Naylor, Scott Tolinski, and Eve Porcello join Jason Lengstorf to kick off a fun new series where several developers all implement the same type of app, show off how they went about it, and react to each other’s approaches. Svelte, Astro, and Next.js each make an appearance.
Learn with Jason
Promises Training — Practice working with promises through a curated collection of interactive challenges. Aimed at developers with at least an intermediate understanding of promises who want to dig deeper.
Using OpenAI APIs to Analyze Automated Test Failures — A look at how to develop a Nightwatch.js plugin which sends the test failure and associated errors to a service that integrates with OpenAI’s platform to analyze said errors and provide actionable feedback.
“Programming isn't about what you know; it's about what you can figure out.”
___ Chris Pine (author of Learn to Program)
P.S. Medium is 🗑️. If you don't want to host your own blog, try Hashnode, dev.to, Bear, or even throw Markdown at GitHub Gists – it'll provide a better reader experience and we'll be more likely to link to it.
Prettier 3.1 Released — The popular opinionated code formatter has a new release including support for the new control flow syntax in Angular 17 plus a new, experimental formatting option for ternary expressions (as in x ? y : z) explained in more depth in "A curious case of the ternaries."
🤔 With an aim to making code formatting even faster, Prettier's co-creator has put up a $10k bounty for any Rust project that passes >95% of Prettier's tests.
On HTML Web Components — “With web components, you might even say React’s component model is being ported to the browser. But it’s being done in a way that works to enhance how the web already works, not replace it”.
67 Browser-Based Debugging Tricks — A list of useful, ‘not-obvious’ hacks to get the most out of the browser’s DevTools. Assumes a reasonable existing understanding of said tools.
Moving Back to React (from Preact) — Preact felt like a logical, lightweight choice to this team at one time, but they’ve switched to React for better compatibility with Next.js, among other things. Their page weight is up slightly, but they feel the tradeoff is worth it.
Ante Barić (Daily․Dev)
My Journey to 3x Faster Builds: Trimming Barrel File Imports — “I maintain a small frontend application (4K LOC) which uses Vite as the compiler. The production build, using npm run build, was taking 26 secs on Github Actions. It seemed awfully slow for such a small application. I decided to investigate why.”
Can Bun Eat Node’s 'Lunch'? — An experiment in migrating a codebase (a restaurant voting app called Lunch) from Node over to Bun and seeing how it fares.
gsplat.js: A Gaussian Splatting Library — Gaussian splatting is an increasingly popular graphics rendering techniques where rather than render millions of tiny, textured triangles in a scene, you get a more wild paintball-like splatter fest, where each paintball creates a smooth, colorful blob instead of a rigid shape. This demo is both simple and striking.
Datasheet Grid: An Airtable-like React Component — If you’ve got an array of objects and you want a way for users to manipulate them, this is for you. It’s not going to replace a spreadsheet or an extensive data grid framework, but it’s a mature solution featuring smooth animations, virtualized rows/columns, keyboard navigation, and more.
▶ Why Signals Are Better Than React Hooks — When Preact’s Marvin Hagemeister pops up in the comments saying “this is by far the best video about signals and why they are so exciting. I love the way you demonstrate it by coding along and moving an app over to signals,” it should bump a video up to the top of the Watch Later playlist.