Import maps go universal

#​632 — March 31, 2023

Read on the Web

JavaScript Weekly

JavaScript Import Maps Now Supported Cross-Browser — ES modules provide a modern way to include and reuse JavaScript code in web apps, and import maps provide the bridge between using module names in code and where those modules can actually be loaded from.

Thomas Steiner (Chrome Developers)

???? The import map news comes off the back of the release of Safari 16.4 which introduces a lot of new functionality to the Mac-based browser, from Web Push and import maps to improved Web Component support and lazy-loading support for iframes.

Updates from the 95th TC39 Meeting — Working group meetings might not seem interesting on the surface, but a lot of what TC39 discusses ends up in our day to day code. Of special interest this time are the progression of support for ranges and the async context proposal to stage 2, and awaiting a dictionary of promises and decorators for class constructors/methods to stage 1.

Hemanth HM

React Authentication, Simplified — In this article, we lay out a new approach to authentication (plus access control & SSO) in React applications.

Userfront sponsor

React Labs: What React Core Has Been Working On — The latest update from the React core team. The most striking update comes around the progress of React Forget, an optimizing compiler with the goal being able to build fully reactive systems using the JavaScript and React mental models you already have, with the compiler tackling the trickiest parts.

The React Core Team

IN BRIEF:

Over on Twitter, ???? Stefan Judis notes that Firefox Nightly is the first browser shipping support for @media (scripting: none) to detect disabled JavaScript in CSS.

???? Over half of new npm packages are junk. Though that’s an improvement on packages riddled with malware… Could we improve things by using ChatGPT to analyze packages? Maybe, says Socket.

???? Excited about the future of Angular? Next Tuesday, the Angular team is doing a livestream on YouTube about the Angular Signals RFC.

Microsoft has ‘rebuilt Teams from the ground up’ with React replacing AngularJS at the heart of the UI.

Did you know SVG almost got built-in network socket support? ????

The Cloudflare Workers edge serverless platform is based around V8 isolates rather than Node.js but is now gaining support for some Node.js APIs.

RELEASES:

Rome 12
↳ Big release for the linter & formatter.

Solid 1.7
↳ Flexible declarative library for UIs.

Visual Studio Code March 2023
↳ Now with improved switch scaffolding for TS/JS.

Ionic 7.0
↳ Powerful cross-platform mobile app toolkit.

Docusaurus 2.4
↳ React-powered docs site generator.

Node.js v16.20.0 (LTS)

???? Articles & Tutorials

Janet for MortalsJanet is a Lisp-like functional dynamic language that can nonetheless be compiled and interact with C libraries. This online book about Janet targets folks who already know JavaScript in particular.

Ian Henry

In Praise of Vite“The single best feature of Vite, as far as I’m concerned, is its simplicity. Compared to the nightmare of configuring WebPack and Babel? Vite is delightfully easy to use.”

Scott Vandehey

???? Robin Wieruch has just published a tutorial on migrating to Vite from Create React App (CRA) if you want to give it a go for yourself.

The Easiest Way to Add Chat to Your Application. Try Stream for Free — Build and ship real-time messaging in less time with our highly reliable chat infrastructure and feature-rich SDKs. Free 30-day trial.

Stream sponsor

Building Framer Motion Animations Inside a Qwik Application — Also touches on Motion One as a bonus, an animation library similar to Framer but lighter and faster to use.

Yoav Ganbar

A Business Case for SvelteKit — A good post covering the experience of migrating from Meteor to SvelteKit, the process this team undertook, and the outcomes from both a performance and UX point of view.

Chris Ellis

How to Enable OpenTelemetry Traces in React Apps — A ten-step approach to enabling OpenTelemetry traces in React apps all the way through to viewing the end results in Jaeger.

Purva Naik (Red Hat)

Build Developer-First Automations with Retool Workflows

Retool sponsor

Understanding module.exports and exports in Node

James Hibbard

???? Code & Tools

NPKILL 0.11.1: Delete node_modules Even Faster — NPKILL (homepage) is a popular tool for listing node_modules folders and how much space they take up, before allowing you to quickly delete them. This new release makes it even faster than before through using worker threads.

Gallardo and Gómez

Inferno 8.1: A Fast, React-a-Like with a Different Approach — React-like, but you might be more intrigued by its differences (which include a different approach to optimizing performance and lifecycle events on functional components).

Inferno

Breakpoints and console.log Is the Past, Time Travel Is the Future — 15x faster JavaScript debugging than with breakpoints and console.log, supports Vitest, Jest, Karma, Jasmine, and more.

Wallaby.js sponsor

Nano JSX: A Lightweight SSR-First JSX Library — Features include no Virtual DOM, no external dependencies, on-demand hydration, and support for Node and Deno-based server-side rendering situations.

Nano JSX

Concurrent.js: Load Modules into Background Threads — For JS environments including the browser, Node and Deno, this library dynamically imports modules into worker threads (in Node) or Web Workers (in the browser) to run them away from the main thread.

Bitair

cron-schedule 4.0: Cron Parser and Scheduler — Parse and query cron style expressions in the browser, Node or Deno.

Pascal Sthamer

Bright: A React Server Component for Syntax Highlighting — Customizable and includes all of VS Code’s syntax highlighting themes, some of which are demonstrated on the page.

Code Hike

typescript-json-serializer 6.0 — Deserialize JSON into TypeScript classes and serialize classes into JSON.

Gillian Pérard

???? Jobs

Full Stack JavaScript Engineer @ Emerging Cybersecurity Startup — Small team/big results. Fun + flexible + always interesting. Come build our award-winning, all-in-one cybersecurity platform.

Defendify

Software Engineer — Join our happy team. Stimulus is a social platform started by Sticker Mule to show what’s possible if your mission is to increase human happiness.

Stimulus

Find JavaScript Jobs with Hired — Hired makes job hunting easy-instead of chasing recruiters, companies approach you with salary details up front. Create a free profile now.

Hired

????‍???? Got a job listing to share? Here’s how.

QUICK RELEASES:

Ink 4.1
↳ Use React to build interactive CLI apps.

Ember Simple Auth 5.0
↳ Authentication and authorization for Ember apps.

Cypress 12.9
↳ Browser-oriented testing framework.

SVGR 7.0
↳ Transform SVGs into React components.

???? JZZ 1.6.1
↳ MIDI library for Node and browsers.

Vue Sonner
↳ The Sonner toast component but for Vue.

np 7.7 – A better npm publish.

Qwik 0.100 – The HTML-first framework.

DOM Testing Library 9.2

React Date Picker 4.11

pnpm 8.1

Leave a Reply

Your email address will not be published. Required fields are marked *