#659 — October 19, 2023
JavaScript Weekly
ApexCharts: Interactive Charting and Dataviz Library — A mature and frequently updated charting library for building interactive data visualizations, whether with sparklines, heatmaps, line charts, funnel charts, pies, and others. There are many visual demos and code samples – or check out their homepage.
Juned Chhipa
Node.js 21 Released — In the next week or so, Node v21 replaces v20 as the ‘current’ release that gets the new features first, with Node v20 becoming the ‘active’ LTS version. v21 introduces V8 11.8, npm 10.2, stable Web Streams support, and an experimental browser-compatible WebSocket implementation.
The Node.js Project
Need SAML Auth? Use WorkOS — WorkOS lets you quickly build enterprise features like SAML & SCIM. Integration is seamless with beautiful API docs and SDKs. Join hundreds of companies using WorkOS—including Vercel, PlanetScale & Webflow—and make your app Enterprise Ready today.
WorkOS sponsor
Eight Options to Reduce JavaScript Code — Solid.js creator Ryan Carniato thinks it’s time to reduce the footprint of JavaScript code. Here’s a two part series covering several approaches, covering areas from code splitting to progressive hydration and hybrid routing.
Loraine Lawson (The New Stack)
🔢 TC39 has started a new task group to standardize source maps.
📊 Colin Eberhardt goes over The State of WebAssembly 2023 results.
🕹 The latest React Jam gamedev event began today. You get ten days to create a game that uses React in some way. Here are previous winning entries.
👾 In other gamedev news, you can see the latest js13kGames winners too. It’s amazing what some people can put together in such little space.
😆 It turns out obfuscating JavaScript and then compressing it doesn’t have a great outcome in terms of size reduction. Fun though?
🎨 The Node.js project has an official mascot design contest.
🎉 RELEASES:
TanStack Query v5 – Query-led declarative state management and data fetching.
Storybook 7.5 – Frontend component dev tool. Now with Vite 5 and Lit 3 support, faster starts, and Angular-focused improvements.
Lit 3.0 – Build agnostic components on top of modern Web standards.
Rockpack 4.0 – React app starter/generator.
Astro 3.3, Biome 1.3, and Bun 1.0.6.
📒 Articles & Tutorials
The Nuances of Base64 Encoding Strings in JavaScript — Base64 provides a way to represent binary data in ASCII strings which may be safer to share and store in certain situations. Matt looks at how to do Base64 encoding and decoding in JavaScript and some areas where you need to take special care.
Matt Joseph
event.target.closest — If you’ve not used closest, it’s worth being aware of this way to return the closest DOM node that matches a specified CSS selector (based upon traversal of the DOM tree up towards the root).
Jeremy Keith
UI Component Library for Project Management and Resource Planning — Level up your UI with advanced data grids, calendars, schedulers, and Gantt charts.
Bryntum sponsor
▶ Prototyping a JavaScript JIT Compiler — It almost feels like building a JIT compiler has become the new “hello world” (ok, slight exaggeration) but this 80 minute screencast is fascinating (and, amazingly, demystifies some of the magic) if you have the time and inclination.
Andreas Kling
🤩 Andreas is such a top notch developer, he’s developed a JavaScript-capable browser called Ladybird for his own OS: SerenityOS.
New Angular 17 Feature: Deferred Loading — Next level lazy-loading demonstrated by using a Signal-based and other examples.
Gergely Szerovay
Do We Need State Management in Angular?
Balázs Kovács
How to Escape CSS Selectors in JavaScript
Stefan Judis
🛠 Code & Tools
Postgres.js 3.4: A Full-Featured Postgres Client for All — Now working with several JavaScript platforms (Node, Deno, Bun, and, as of this release, Cloudflare), this high performance Postgres library offers realtime change subscription, dynamic query building via special template literals, high availability support via multi-host connection URLs, async cursors, and more.
Rasmus Porsager
New Wallaby.js Logpoints: Quick & Easy Logging, Simply Set a Breakpoint — No setup needed, real-time feedback in your editor. Class & function support allows you to quickly log runtime values for all lines in a class or function.
Wallaby Team sponsor
PureImage: A Pure JS HTML Canvas 2D for Node.js — If you want a browser-like 2D canvas experience in Node but without any native dependencies, this is for you. You can then save the output to PNG or JPEG. (node-canvas is the long-standing popular choice in this same area but relies upon Cairo as a dependency.)
Josh Marinacci
Cronicle: A Cron System with a Web Front End — Describing itself as ‘a fancy cron replacement’, Cronicle is a task scheduler and runner built in Node.js with a web-based UI.
Joseph Huckaby
Timeline JS: Create Useful Timelines for the Web — Built by a journalism lab at a university, this is not aimed at expert developers but folks focused on telling a story or presenting some data online. Here’s an example showing a timeline of ‘revolutionary user interfaces.’
Northwestern University Knight Lab
Add Figma Like Collaborative Features Without Re-Architecting Your App
Ably sponsor
table-saw: A Small Web Component for Responsive HTML Tables — Inspired by a jQuery plugin with a similar name. Check out some some demos.
Zach Leatherman
eslint-plugin-regexp 2.0 – ESLint plugin to find regex related issues. (Interactive demo.)
little-rat – Chrome extension to monitor (and block) other extensions’ network calls.
Sortable 3.0 – Make tables sortable with class=”sortable”
AdminJS 7.3 – Automatic admin interface for Node apps.
Shoelace 2.10 – Suite of elegant web components.
Recharts 2.9 – React and D3 charting library.
Fable 4.3 – F# to JavaScript compiler.
🎁 And one for luck..
QX82: Retro-Inspired Computing in a JavaScript Library — With a name riffing on the ZX81 computer, QX82’s goal is to let you create retro-feeling (mid 80s, to be precise) games and experiences with JavaScript. It’s not a runtime or emulator – you could bake this into your own web site, if you wanted.
Bruno Oliveira