#648 — July 20, 2023
pkg-size: Find the True, Current Size of an npm Package Without Leaving Your Browser — A beautifully designed site that can show you the true size of an npm package (including dependencies) using the actual packages which are ‘installed’ in a browser-based WebContainers-powered environment. Hiroki has 🐦 a Twitter thread where he explains more about how it works.
Mike Melanson (GitHub)
Create a Real-Time Multi-Host Livestream with Amazon IVS — Amazon Interactive Video Service (Amazon IVS) enables developers to create dynamic video experiences, such as collaborative livestreams with multiple hosts. Click here to learn more.
Amazon Web Services (AWS) sponsor
Storybook 7.1: The Workshop for Building UI Components — v7.1 introduces in-app onboarding for your newest team members, zero-config styling support for Tailwind, MUI, styled-components and MUI, Vue 3 source snippets, and more.
Fresh 1.3 – The Deno web framework. Plugins can now inject routes and middleware into apps, there’s Deno.serve support, and you can create async route components.
Downshift 8.0 – Primitives to build WAI-ARIA compliant React autocomplete, combobox & select components.
Node.js v18.17.0 (LTS) – Node 18 gets the Ada 2.0 WHATWG URL parser.
Fastify 4.20 – The fast, low overhead web Node.js framework.
⚡️ IN BRIEF:
📒 Articles & Tutorials
Silas Marvin (PostgresML)
💡 Psst.. if you use Postgres at all, we have a Postgres newsletter too!
Updating Code with jscodeshift — TypeORM is an ORM for Node that introduced some breaking changes requiring the author to update lots of calls in his code. A perfect time to use a ‘codemod’ to automate the job. Even if you don’t use TypeORM, this post might give you some ideas for other places to use such an approach.
AI-Proofing Your Career For Tomorrow: Free Session by Interview Kickstart — Discover Your AI Career Path (AI/ML vs Data Science). Take an informed decision: Insights from FAANG+ AI/ML Engineers. Register for a free session.
Interview Kickstart sponsor
How React 18 Improves App Performance — If you’ve not entirely kept up with how things have changed or developed in React with regards to concurrent rendering, transitions, Suspense, and even React Server Components, this is a fantastic review and primer to get up to speed on how React’s newer features dramatically help with performance.
Lydia Hallie (Vercel)
On the Origins of JSX and Why It Exists
🛠 Code & Tools
katspaugh and contributors
TOAST UI Grid: A Customizable Grid Control for the Web — A powerful MIT-licensed grid-style control for the display, editing, and management of data. It comes from the same folks as TUI Editor and TUI Calendar and while it’s happy on its own, there are wrappers for Vue and React too. GitHub repo.
Pines: A Library of UI Components for Alpine.js and Tailwind Projects — Includes sliders, tooltips, accordions, modals, and others. The CSS-only components are usable in any Tailwind project while the ones that require JS are designed for use with Alpine.js.
YouTube.js 5.5: A Wrapper Around YouTube’s Private API — One of those things you’d expect to be quickly blocked somehow, but it’s 18 months old, so… 😆 The fun isn’t just for Node or Deno users – it’ll work in the browser if you can proxy the requests through your own server.
Eruda 3.0: A Console for Mobile Browsers — If you’re in a situation where you have no access to DevTools, you can add Eruda to your page and it provides a sort of virtual devtools you can use from any browser, including on mobile.
Reagraph 4.10: WebGL Graph Visualization Library for React — Here’s a basic code example. This week’s release adds support for three dimensional clustering. GitHub repo.
brotli-wasm 2.0: A Brotli Compressor and Decompressor — Covers both Node and the browser by means of WebAssembly.
Pacquet: A New, Experimental Package Manager for Node — From a Node.js core member, no less.
↳ Lightweight, stylish ‘share’ buttons for social networks.
↳ React for interactive command-line apps.
🧑💻 Got a job listing to share? Here’s how.
🎵 Thank you for the music..
Chip Player JS: Browser-Based MIDIs, MODs and Game Music — The creator of this site has, like me, a fascination with old digital music – MIDI files, trackers, and the like. Rather than keep an old computer running, he decided to build a browser based music player for such files.
P.S. If you’re looking for something specific to listen to, the music by famed Norwegian tracker Jogeir Liljedahl is well worth a try – particularly Overture or Guitar Slinger. Or how about Donkey Kong Country’s dreamy Aquatic Ambience? It’s striking how trackers managed to squeeze so much down into a few hundred kilobytes by the heavy reuse and manipulation of samples.