#542 — June 11, 2021
Fred K. Schott
The Plan for React 18 — The React team has outlined some exciting things on the roadmap for React 18 (due in its final form in ‘several months’ time’):
Cassidy Williams has written an accessible ‘Now what?’ introduction.
The first alpha of React 18 is available – it’s not for production use.
A new Suspense-based server side rendering architecture.
A Transitions API for keeping an app responsive even during large updates.
The launch of a React 18 Working Group to enable invited members of the community to interact with the React team more directly through these public discussions.
The React Core Team
Learn to Build Scalable React Apps — Brian Holt covers the latest tools in the React ecosystem like TypeScript, TailwindCSS, Redux, Jest, and more in this new and updated video course!
Frontend Masters sponsor
Introducing Chrome’s New Memory Inspector — Landing in Chrome 91’s DevTools is the new memory inspector with which you can inspect your ArrayBuffer, TypedArray, DataView, and even WebAssembly Memory.
Kim-Anh Tran (Google)
Vue.js 3.1.0 (Pluto) Released — There’s now the migration build, a build of Vue 3 that offers Vue 2 compatible behavior to help with Vue 2 to 3 migrations. Cédric Exbrayat rounds up some other 3.1 additions here.
If you build extensions for Chrome, you’ll want to check out the new chrome.scripting API.
The Playwright project has introduced Playwright Test, a new test runner for parallel multi-browser tests. Playwright Trace Viewer can then let you explore recorded test traces later on.
use-sound 4.0 — React hook for sound effects.
Cypress 7.5.0 — Testing system.
Ghost 4.7.0 — Headless Node.js CMS / blogging system.
Frontend Developer at MIT (Remote, Contract to Full-Time) — Are you a frontend developer with React and UX skills? Join our team at MIT building a new platform for the energy industry.
MIT Energy Initiative
Find Software Engineering Jobs with Hired — Take 5 minutes to build your free profile & start getting interviews for your next job. Companies on Hired are actively hiring right now.
📖 Articles, Opinions & Tutorials
Creating a Serverless Function to Scrape Web Page Metadata — Metascraper is a Node.js package for scraping metadata from live web pages and this tutorial demonstrates its use via a Vercel hosted function.
[Free Download] Guide to Effective Feature Management — Learn feature management practices to accelerate release cycles and deploy every 6 hours, instead of every 6 weeks.
▶ Exploring Deno Land 🦕 with Ryan Dahl — Ryan Dahl, the original creator of Node.js creator and now creator of the Deno runtime, went on the popular Changelog podcast to talk about how the success of Node changed his life and what led him to creating Deno.
The Changelog Podcast podcast
Managing Shared State in Vue 3 — Writing large-scale Vue applications can be a challenge. In this article, Shawn Wildermuth dives into the pros and cons of approaches like factories, shared objects, and using Vuex. He also explains what is coming in Vuex 5.0 that might change how we all use shared state in Vue 3.
Why Tracing Might Replace (Almost) All Logging
How To Build a Geocoding App with Vue.js and Mapbox
Ten Tips for Building More Accessible Angular Apps
Emma Twersky (Google)
Don’t Use Functions As Callbacks Unless They’re Designed for It
🛠 Code & Tools
Handsfree.JS: Bring Face, Hand or Pose Tracking to Your Frontend Apps — Track up to four hands at once (more than I’ve got, at least), 21 ‘landmarks’ for a single hand, or even faces and bodies in detail. I’m also digging the rather retro homepage. GitHub repo.
Flicking 4.0: A Carousel Component with 30M Daily Users — Naver, a South Korean portal and search engine, claims 30 million people use their carousel component every day. Works with Angular, React, Vue and Preact.
FlexSearch.js 0.7.0: A Full Text Search Library with No Dependencies — Claims to outperform its competition while supporting features like multi-word matching and phonetic transformations. Happy in both the browser and Node.js.
PM2 5.0 Released: The Production Process Manager — PM2 is a popular process manager and load balancer for long running Node.js apps. 5.0 is a significant release adding a new local system monitoring feature for tracking metrics like CPU and memory use.
Naive UI: A Vue 3 Component Library — I kinda respect it describes itself as “not too slow” and “kinda interesting”(!)
Nanostores: A 152 Byte State Manager for React/Preact/Vue/Svelte with Many Atomic Tree-Shakable Stores
Angular Flex-Layout: A Sophisticated Layout API for Angular using Flexbox Media Queries
🎵 And one for fun..
RxJChess: A Chess Game Built on React, Redux and RxJS — You can play against the CPU or even find a friend. Plays pretty well. Once you’ve had enough of losing (or is that just me?) you can also check out the source.
Permanent link to this post here