#552 — August 20, 2021
David Heinemeier Hansson (DHH)
An Absurd Future for SQL on the Web? — absurd-sql is a project aiming to provide a persistent backend for SQLite on the web. It uses IndexedDB but with sql.js in front so you can use SQLite in a natural but persisted way from webapps. Some interesting thoughts here.
Frontend Masters sponsor
Announcing React Native 0.65 — The VM within React Native has had an upgrade and now has ES i18n API (Intl) suport, supports M1 Macs and Mac Catalyst, has a much faster garbage collector, and more, including accessibility improvements.
Luna Wei and Facebook
Want to speak at the online React Conf 2021 in November? You’ve got three days to submit your proposal.
Chromium is adding support to import CSS stylesheets with import much as you might with ES modules.
🎲 The annual JS13KGames coding competition has begun and runs until September 13 – the theme is “space.” Ready to build a game?
A look at the weird error message you’ll encounter if you put more than 2^24 items in a Map object.
Mocha 9.1.0 – Testing framework.
svgo 2.4.0 – Node tool for optimizing SVG files.
Node 16.7.0 – Experimentally adds a recursive cp method.
Capacitor 3.2.0 – Build native PWAs for iOS, Android, and the Web.
WebTorrent 1.5.0 – Streaming torrent client for the web.
Cypress 8.3.0 – Testing for anything that runs in a browser.
Front-End Developer – Utrust (Remote, GMT -2/+4) — We are changing the world with crypto. Join our team, working with technologies such as React, Redux, GraphQL and TypeScript.
Senior Software Engineer – React, 100% Remote — Series-A, neobank tailored to e-commerce, 12 developers and entering hypergrowth.
📖 Articles, Opinions & Tutorials
Creating an Interactive Gantt Chart Component with Vanilla JS — Coding a Gantt chart (commonly used as a way to visualize schedules) as a reusable Web component, covering the architecture of the component, rendering the calendar with CSS Grid, and managing the state of the draggable tasks with proxy objects.
Addy Osmani & Arthur Evans
Build a React Chat Application — In a few simple steps we’ll show you how to launch a chat app using our React component library.
Guidelines (from the 1970s!) on How to Split Your React Components — Some interesting ideas extracted from a 1970s paper: “Designing Software for Ease of Extension and Contraction” by David Parnas.
How to Write TypeScript Interfaces in JSDoc Comments — A way to avoid build steps but still enjoy TypeScript type checking on your .js files.
return await promise vs return promise — Is there any difference between using return await promise and return promise in asynchronous functions?
🛠 Code & Tools
wavesurfer.js: Navigable Waveforms via the Web Audio and Canvas APIs — If you’re creating a podcast player, audio experience, or anything where seeing an interactive audio waveform could be useful, check this out.
katspaugh and contributors
Go from Zero to Live Streaming, in a Couple of Minutes — Mux Video is an API-first platform that makes it easy to build beautiful live video that streams everywhere.
v-lazy-image: A Vue.js Component to Lazy Load Images — Uses Intersection Observer and then progressive rendering with CSS animations to keep things smooth. CodeSandbox demo.
Pyodide contributors and Mozilla
Notistack: A Library for Easy Snackbar/Toast Notifications — You can try out a whole slew of demos and an API reference on the docs site.
Serendipity: A Beautiful VS Code Theme with Dark and Light Modes — The color palette was selected specifically to be pleasing to the eyes on retina displays.
🕰 ICYMI (Some older stuff that may catch your eye…)
Here’s a look at how to avoid/prevent uncaught async errors.
Dmitri Pavlutin explains how to use the fetch() API to load and post JSON data.
🐟 And one that didn’t quite get away…
Fishdraw: Procedurally Generated Fish Drawings — This Node-based project creates ‘all sorts of weird fishes’ and boasts being fully procedurally generated – the output looks pretty amazing.