#635 — April 20, 2023
Introducing npm Package Provenance — As stewards of the official npm registry, GitHub has been keen to improve its security. As of this week, if you build npm packages through GitHub Actions, you can publish the provenance of a package which gives users a way to verify which repo a package was built from (and how). The folks at Socket took a closer look at how it works and where it will be beneficial.
DeHamer and Harrison (GitHub)
What’s New in ECMAScript 2023, Briefly — Last week we mentioned the progression of the ECMAScript 2023 spec but it’s hardly bedtime reading. This post looks more briefly at a few of the new additions including Array#findLast, hashbangs, and Array#toSorted.
New Course by Kyle Simpson: Practical Problem Solving with Algorithms — Walk through four fun challenges with Kyle in this new video course. You’ll learn how to apply algorithms with techniques like recursion, traversals, and acyclic paths, cover memoization to avoid garbage collection, and come away writing more performant code.
Frontend Masters sponsor
Node.js 20 Released — Released just two days ago, the newest major version of Node.js includes a variety of interesting updates, including:
An experimental permissions model. This is a feature Deno has at its core but now you can restrict access to certain capabilities in Node too.
V8 11.3 (which includes Regexp /v flag support)
The node:test test runner goes stable.
Official support for Windows on ARM64.
Improvements to the single executable packaging mechanism.
The Node.js Team
Vite 4.3: Now It’s Even ‘Faaaaster’ — A minor release of the popular frontend toolchain, but one that focuses on performance. The creatively titled How we made Vite 4.3 faaaaster digs into the details.
Evan You and Contributors
TypeScript 5.1 Beta has been released which allows undefined-returning functions to have no return statement, to have unrelated types for get and set accessor properties, namespaced attribute names when using JSX, and more.
The React core team (and that of Relay) appears to have been affected by Meta’s latest round of layoffs, though Dan Abramov recently noted Meta’s continued investment into the library.
Introducing the TERN Stack & How to Migrate from MERN to TERN
↳ Popular library of well designed Web components.
???? Articles & Tutorials
Richer Install UI for PWAs Available in Chrome — Gives progressive web app developers a new opportunity to encourage end users to install their app.
Adriana Jara (Chrome Developers)
Passkeys: What and Why? — The author has been experimenting with passkeys and the associated WebAuthn API that opens them up to the Web. A primer for an increasingly common security approach.
Build Complex Automations 10x Faster, Without Fighting APIs — The flexible workflow automation platform for technical people who want to build complex workflows faster — without struggling with manual scripts.
Integrating React Flow and the Web Audio API — React Flow is a component for building node-based editors and interactive diagrams, which makes it well suited for building audio signal chains. There’s a lot of depth here, some nice examples, and these techniques could prove useful for a lot of other use cases.
Deno vs. Node: No One is Ready for the Move — Deno has a lot going for it as an alternative to Node, but Node has time, maturity and a huge, established userbase on its side (and continues to develop, as seen with this week’s Node v20).
Piumi Liyana Gunawardhana (Honeypot)
???? Code & Tools
Tachyon 2.0: A Bite-Sized Script to Make Page Navigation Faster — It does this by prerendering pages before a user navigates to them, making page transitions as quick as can be.
instant.page is another well known option in this space.
Iconoir: 1300+ Open Source SVG Icons — A vast array of clean and simple icons, complete with ways to quickly integrate them into React, React Native, Figma, and other apps – or just using CSS, if you prefer.
Tuple – One-Click Code Reviews for Remote Devs — Why waste hours setting up Zoom just to review a couple lines of code? Tuple brings your team together in seconds.
Ark UI: A Headless Library of Customizable, Accessible, and Unstyled UI Components — Compatible with React, Vue, and Solid and powered by Zag.js. All components are built with accessibility standards and are easy to theme in line with your own design system.
next-route-visualizer: Visualize Next.js App Routes — A package for visualizing Next.js app directory routes, as seen in this demo.
ohash: Super Fast Hashing Library in Plain JS
<relative-time> Element 4.3
↳ Web component extension of <time>
↳ React hook for keyboard shortcuts.
AdminJS 7.0 – Admin panel for Node webapps.
lowdb 6.0 – Simple, local JSON database.
imaskjs 6.6 – Vanilla JS input masking.
CKEditor 5 37.1 – Rich text editor framework.
???????? Got a job listing to share? Here’s how.
???? Let’s get it arted..