---
title: "Getting animated"
publication: "JavaScript Weekly"
issue: 590
published_at: "2022-05-20"
canonical_url: "https://javascriptweekly.com/issues/590"
---

Plus Angular 14 RC, a Svelte SSG, and Deno's news news. |        

🇺🇦 #​590 — May 20, 2022 

[Unsubscribe](https://javascriptweekly.com/leave/*|UID|*)|[Read on the Web](https://javascriptweekly.com/issues/590)   

JavaScript Weekly 

[![\](https://res.cloudinary.com/cpress/image/upload/w_1280,e_sharpen:60/vbn7pgjaedjxfv8bhkfx.jpg)](https://sliderland.blinry.org/)  

[Sliderland: A Minimalist Coding Playground](https://sliderland.blinry.org/) — 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](https://sliderland.blinry.org/#%28i%5E%28t*20%29%2564%29%2F63)). [The code](https://github.com/blinry/sliderland) is simple but packs in some neat features such as a WebAssembly-powered MP4 recorder, courtesy of [ffmpeg.wasm](https://github.com/ffmpegwasm/ffmpeg.wasm). 

blinry   

[Playwright Can Now Test React, Vue and Svelte Components](https://github.com/microsoft/playwright/releases/tag/v1.22.0) — [Playwright](https://playwright.dev), 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](https://playwright.dev/docs/test-components). 

Microsoft   [![\](https://copm.s3.amazonaws.com/2cde4bed.png)](https://kontent.ai/developers/?utm_source=jsweekly&utm_medium=cooperpress_newsletter&utm_campaign=q4_newsletter_cooperpress) 

[Headless CMS with World-Class TypeScript Support](https://kontent.ai/developers/?utm_source=jsweekly&utm_medium=cooperpress_newsletter&utm_campaign=q4_newsletter_cooperpress) — 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](https://www.robinwieruch.de/web-applications/) — 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](https://www.fastly.com/blog/fastly-announces-acquisition-of-glitch-a-future-of-yes-code-at-the-edge) acquired [Glitch,](https://glitch.com/) a popular online JavaScript development platform.
- You can now [render math expressions using LaTeX style syntax](https://github.blog/changelog/2022-05-19-render-mathematical-expressions-in-markdown/) in GitHub's Markdown including on projects or gists. And, apparently, [we need more math](https://www.quantamagazine.org/computing-expert-says-programmers-need-more-math-20220517/).
- We've mentioned it before, but Jeremy Wagner reflects on the UK government's [dropping of jQuery](https://web.dev/gov-uk-drops-jquery/) from its sites.
- The Deno project now has [deno.news](https://deno.news/) – an official newsletter for the project.
- [New European Union rules being discussed](https://www.theregister.com/2022/04/26/apple_ios_browser/) 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](https://www.webpro.nl/scraps/javascript-block-statement) to organize code better and get new scopes for `let` and `const` decalarations. 

**RELEASES:** 

[Mithril.js 2.2](https://github.com/MithrilJS/mithril.js) – Popular SPA framework with its first release in over 2 years.
 [Electron React Boilerplate 4.6](https://github.com/electron-react-boilerplate/electron-react-boilerplate) – Now uses React 18.
 [Helmet 5.1.0](https://helmetjs.github.io/) – Secure Express.js apps with HTTP headers.
 [Deno 1.22](https://deno.com/blog/v1.22)
 [melonJS 10.8.0](https://github.com/melonjs/melonJS) – JS 2D game engine.
 [Angular 14 Release Candidate](https://github.com/angular/angular/releases/tag/14.0.0-rc.1)
 [Node 18.2.0](https://nodejs.org/en/blog/release/v18.2.0/) – More in [Node Weekly](https://nodeweekly.com/issues/438) on this.    

💻 Jobs  

[Calling all Empathetic + People-Focused Sr. JavaScript Engineers](https://app.jobvite.com/j?cj=oFwshfwE&s=CooperPress_RS) — We're looking for Node + React developers who want to design architecture, lead teams, and ship features directly to customers. 
Moz Group   

[Full Stack Developer – JavaScript/TypeScript (f/m/d) and More](https://jobs.ioki.com/l/en) — Join our team working on real life solutions for the future of public transport. 
ioki   

[Backend Engineer](https://feather-insurance.com/careers/backend-engineer) — We’ve built a product thousands of people love (see [Trustpilot](https://www.trustpilot.com/review/feather-insurance.com) if you don’t believe us). We need your help with Node & TypeScript. 
Feather   

[Find JavaScript Jobs with Hired](https://hired.com/join/?utm_source=newsletter&utm_medium=sponsor&utm_campaign=%28b2c%29%28l-all%29%28r-all%29%28cooper-javascriptweekly%29&utm_content=find-your-next-job) — Create a profile on Hired to connect with hiring managers at growing startups and Fortune 500 companies. It's free for job-seekers. 
Hired    

📒 Articles & Tutorials 

[![\](https://res.cloudinary.com/cpress/image/upload/w_1280,e_sharpen:60/hav0gk9fz9iuehl8evcy.jpg)](https://www.jamieonkeys.dev/posts/piano-keyboard-javascript/)   

[Building an Animated Piano Keyboard with JavaScript and MIDI](https://www.jamieonkeys.dev/posts/piano-keyboard-javascript/) — If you liked Tania Rascia’s [accordion](https://www.taniarascia.com/musical-instrument-web-audio-api/) last week, this beautifully presented post is for you. The work Jamie is doing is feeding into his [jazz piano training](https://www.jazzkeys.fyi/) site too. 

Jamie Smith   

[Rust for JavaScript Developers: Preorders Closing Soon](https://rustforjs.dev) — 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`](https://p42.ai/blog/2022-05-10/you-dont-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](https://2ality.com/2022/05/rfc-9239.html) — 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](https://www.feroot.com/preventing-client-side-javascript-supply-chain-attacks/?utm_campaign=Anchored%3A%20A%20deep%20dive%20into%20JS%20software%20supply%20chain%20security&utm_source=Media%20Advertisement&utm_medium=JS-Weekly-Newsletter&utm_term=Newsletter-Sponsored-Link&utm_content=Supply-Chain-WP) — 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](https://coderevue.net/posts/deploy-node-red-gcp/) — [Node-RED](https://nodered.org/) 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](https://www.youtube.com/watch?v=hw3Bx5vxKl0) — A snappy explanation of where Solid fits in. 
Fireship  

🛠 Code & Tools 

[![\](https://res.cloudinary.com/cpress/image/upload/w_1280,e_sharpen:60/myquvyrl2szybd0weamv.jpg)](https://github.com/nemtsov/json-mask)   

[JSON Mask: A Way to Select Specific Parts of a JS Object](https://github.com/nemtsov/json-mask) — 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](https://github.com/foliojs/fontkit) — 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](https://github.com/foliojs/pdfkit) PDF generation library. 

foliojs   

[PushIn.js: A Lightweight Parallax / Dolly / Push In Effect for Web Pages](https://nateplusplus.github.io/pushin/) — 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](https://github.com/epicmaxco/vuestic-ui) — A library of more than 50 customizable components. [1.4.0](https://github.com/epicmaxco/vuestic-ui/releases/tag/v1.4.0) brings Nuxt 3 support plus new carousel and counter components. 

Epicmax   

[Free Activity Feeds & Chat APIs for Qualifying Teams](https://getstream.io/maker-account/?utm_source=JavascriptWeekly&utm_medium=Newsletter_Logo_Ad&utm_content=Developer&utm_campaign=JavascriptWeekly_May2022_MakerAccount) 

Stream sponsor   

[Timewave: A Tiny Clock and Date Library (with Simulation Support)](https://timewave.dev/) — 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](https://github.com/anywhichway/timewave). 

Simon Y. Blackwell   

[Elder.js: An SEO-Focused Svelte-Based Static Site Generator](https://elderguide.com/tech/elderjs/) — 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](https://github.com/isaacs/minimatch) — Converts glob-style expressions to regexes. Used internally by `npm`. 

Isaac Z. Schlueter   

[A React Router Implemented in Under 100 LOC](https://github.com/ashok-khanna/react-snippets/blob/main/Router.js) — One of those sorts of experiments that anyone can learn from. 

Ashok Khanna    

**💚 Use Node?** Check out the [latest issue of _Node Weekly_](https://nodeweekly.com/latest), 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](https://nodeweekly.com/)**         

Published by [Cooperpress](https://cooperpress.com/) and edited by [Peter Cooper](https://twitter.com/peterc) 

'JavaScript' is a trademark of Oracle Corporation in the US
We are not endorsed by or affiliated with Oracle. 

[Change your email address](https://javascriptweekly.com/edit_subscription/*|UID|*) or [stop getting this newsletter](https://javascriptweekly.com/leave/*|UID|*). 

© Cooper Press Ltd · Fairfield Enterprise Centre, Louth, LN11 0LS, United Kingdom