Plus a neat grid control, how React 18 improves performance, and how JavaScript is keeping old music alive. |

#​648 — July 20, 2023

Read on the Web

Together with  AWS

JavaScript Weekly

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.

Hiroki Osame

TypeScript and the Dawn of Gradual Types — From GitHub’s ReadME project comes a thorough journalistic take on how static typing made it into the JavaScript world, what TypeScript offers, some alternative approaches, and the possibility of adding type annotations to JavaScript iself.

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.

Storybook Team

Five Inconvenient Truths about TypeScript — A brief dose of reality for a world seemingly obsessed with TypeScript: “If you want to get into TypeScript, don’t think you can leave JavaScript behind. It will find you, and it will get you.”

Stefan Baumgartner

🎉 RELEASES:

  • 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

'How We Generate JS and Python SDKs from a Canonical Rust SDK'PostgresML is an extension that adds machine learning functions into Postgres. Its team loves and prefers Rust but most of its users are using JavaScript or Python. What to do? Simultaneously write multi-language libraries using Rust..

Silas Marvin (PostgresML)

💡 Psst.. if you use Postgres at all, we have a Postgres newsletter too!

Updating Code with jscodeshiftTypeORM 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.

Clinton Blackburn

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)

300ms Faster: Measures Taken to Reduce Wikipedia's Total Blocking Time (TBT)
Nicholas Ray

On the Origins of JSX and Why It Exists
Hristiyan Dodov

🛠 Code & Tools

wavesurfer.js 7: Audio Waveform Player — If you’re creating a podcast player, audio experience, or anything where seeing an interactive audio waveform could be useful, check this out. GitHub repo.

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.

NHN

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

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.

devdojo

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.

LuanRT

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.

LiriLiri

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.

REAGRAPH

brotli-wasm 2.0: A Brotli Compressor and Decompressor — Covers both Node and the browser by means of WebAssembly.

HTTP Toolkit

Pacquet: A New, Experimental Package Manager for Node — From a Node.js core member, no less.

Yagiz Nizipli

💻 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.

🎵 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.

Matt Montag

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.

n