JavaScript Weekly Issue 590: May 20, 2022

🇺🇦 #​590 — May 20, 2022

Unsubscribe | Read on the Web

JavaScript Weekly

Sliderland: A Minimalist Coding Playground — No obvious top feature this week so I’m leading with a little project I’ve enjoyed playing with. It’s a slider-style visualization you can code with simple formulas (check out this one). The code is simple but packs in some neat features such as a WebAssembly-powered MP4 recorder, courtesy of ffmpeg.wasm.

blinry

Playwright Can Now Test React, Vue and Svelte Components — Playwright, Microsoft’s browser control library for Node.js, takes an interesting step in allowing you to programattically test your components using all of Playwright's features using Playwright Test (Playwright's own test runner). Here are the docs.

Microsoft

Headless CMS with World-Class TypeScript Support — Kontent handles all your content management. Streamline your code using TypeScript SDK, CLI, Rich Text resolver, and strongly typed Model Generator and scale with no problems when your project grows. Have you seen our UI?

Kontent by Kentico sponsor

Web Applications 101 — A single article that touches on a lot of structural concepts involved in building a modern Web site from the simplest of HTML pages through to server-side rendering (SSR) and static-site generation (SSG). Not a tutorial but paints the architectural picture for you.

Robin Wieruch

IN BRIEF:

• Fastly has acquired Glitch, a popular online JavaScript development platform.

• You can now render math expressions using LaTeX style syntax in GitHub's Markdown including on projects or gists. And, apparently, we need more math.

• We've mentioned it before, but Jeremy Wagner reflects on the UK government's dropping of jQuery from its sites.

• The Deno project now has deno.news – an official newsletter for the project.

• New European Union rules being discussed may mean Apple has to give up its monopoly over the browser engine on iOS which could, too, have implications for JavaScript.

• Lars Kappert suggests using blocks to organize code better and get new scopes for let and const decalarations.

RELEASES:

Mithril.js 2.2 – Popular SPA framework with its first release in over 2 years.
Electron React Boilerplate 4.6 – Now uses React 18.
Helmet 5.1.0 – Secure Express.js apps with HTTP headers.
Deno 1.22
melonJS 10.8.0 – JS 2D game engine.
Angular 14 Release Candidate
Node 18.2.0 – More in Node Weekly on this.

📒 Articles & Tutorials

Building an Animated Piano Keyboard with JavaScript and MIDI — If you liked Tania Rascia’s accordion last week, this beautifully presented post is for you. The work Jamie is doing is feeding into his jazz piano training site too.

Jamie Smith

Rust for JavaScript Developers: Preorders Closing Soon — A comprehensive course that teaches you everything you need to know to get productive in Rust via text, interactive visualizations and videos.

Rust for JavaScript Developers sponsor

Why You Don't Need void 0 — JavaScript’s void operator has been used in some interesting ways over the years versus undefined but Lars thinks undefined is now the better option.

Lars Grammel

RFC 9239: Updates to ECMAScript Media Types — One of those "do I need to know this, even though it sounds important?" topics. Dr. Axel keeps it simple but essentially JavaScript’s MIME type is now unambiguously text/javascript and .mjs is a registered file extension for JS modules.

Dr. Axel Rauschmayer

Software Supply Chain Attacks Are No Joke — Industry experts expect supply chain attacks to increase by a factor of four over the course of 2022. Get the guide to Preventing JavaScript Supply Chain Attacks.

Feroot Security sponsor

Deploying Node-RED to Google App Engine — Node-RED is a JavaScript-powered low-code event-driven programming environment commonly associated with IoT and bringing together hardware devices in various ways. But you can deploy it in the cloud, too, to create your own automation systems.

CodeREVUE

▶ SolidJS Explained in 100 Seconds — A snappy explanation of where Solid fits in.
Fireship

🛠 Code & Tools

JSON Mask: A Way to Select Specific Parts of a JS Object — Give JSON Mask an object and a (XPath-esque) query and you get back an object with the same structure but only the required parts included with the rest ‘masked’ (hence the name).

Yuriy Nemtsov

Fontkit: An Advanced Font Engine for Node and Browser — Works with TrueType, OpenType, WOFF, and other formats - supports mapping characters to glyphs, substitutions, reading metrics, laying out glyphs, font subsetting, and more. Used as part of the PDFKit PDF generation library.

foliojs

PushIn.js: A Lightweight Parallax / Dolly / Push In Effect for Web Pages — Simulates an interactive dolly-in or push-in animation when scrolling. The homepage is itself a live demo.

Nathan Blair

Vuestic 1.4.0: An Open Source UI Library for Vue 3 — A library of more than 50 customizable components. 1.4.0 brings Nuxt 3 support plus new carousel and counter components.

Epicmax

Free Activity Feeds & Chat APIs for Qualifying Teams

Stream sponsor

Timewave: A Tiny Clock and Date Library (with Simulation Support) — Boasting "much of the same functionality as MomentJS and its replacement Luzxon in a smaller package", this library also lets you run multiple clocks in parallel at different speeds. GitHub repo.

Simon Y. Blackwell

Elder.js: An SEO-Focused Svelte-Based Static Site Generator — Designed for building SEO-friendly sites at scale and the name isn’t just random, it’s used in production to run a site about finding senior housing.

Elder.js Team

minimatch: A Glob Matcher — Converts glob-style expressions to regexes. Used internally by npm.

Isaac Z. Schlueter

A React Router Implemented in Under 100 LOC — One of those sorts of experiments that anyone can learn from.

Ashok Khanna

💚 Use Node? Check out the latest issue of Node Weekly, our sibling email about all things relating to Node.js — from tutorials and screencasts to news and releases. Yep, we do include some Node related items here in JavaScript Weekly, but we save most of it for there.

→ Check out Node Weekly today