Native JSON modules, progressive web components, modern web types, and the current state of build tools. Issue #581 • Oct 20, 2026 • View in the browser

Smashing Newsletter

Ahoj Smashing Friends,

What’s going on in JavaScript these days? What are new ECMAScript features that are coming up? And do we actually need build tools still? In this newsletter, we dive into front-end engineering and focus on JavaScript — from modern web types to progressive web components and native JSON modules.

Smashing Workshops and Conferences
Meet Smashing Workshops and Smashing Conferences 2027. Friendly, practical and actionable, the smashing way.

If you want to prepare for what’s next in the world of front-end and UX, we’ve just launched our new online workshops. You can save 10–20% off today: prices will go up on Oct 27. You can also get a bundle of workshops for your (incredible!) team.

And now, let’s jump into all things JS! 🚀

— Vitaly


1. Native JSON Modules

Native JSON modules are here. With import attributes, the platform can finally handle JSON modules directly — no transforms, custom loaders, or build-time magic involved. Matt Smith compares native JSON modules with the bundler-based JSON import that we’ve historically relied on and explains why import attributes matter beyond JSON.

Native JSON Modules


2. Progressive Web Components

Layout shifts, accessibility problems, server-side rendering limitations, too much reliance on client-side JavaScript — web components have quite some pain points. To avoid common issues, Ariel Salminen created Elena, a small library for creating Progressive Web Components. They render HTML and CSS before JavaScript loads and add an enhancement layer of JavaScript to add reactivity, event handling, and more advanced templating.

Progressive Web Components


3. Modern Web Types

When you use TypeScript on a project with newer web features, you usually run into type errors. Philip Walton created a fix for the issue: modern-web-types. The library gives you full support for any API that’s shipped in a modern browser. It saves you from manually adding types to a project and avoids conflicts once TypeScript eventually adds support for them.

Modern Web Types


From our sponsor

Build Across Any UI With One Shared Customer Context For Every Agent

HubSpot
HubSpot unites teams and AI agents on one customer context. Its open platform provides data, APIs, and AI tools to build apps and agents. Use live customer data, build with MCP or APIs, and expect predictable releases. Join the live session for updates →


4. Highlighting A Range Of Text

Let’s say you have a textarea or input and want to highlight every instance of a particular word, updating as the user types. The OpaqueRange API together with the Custom Highlight API make it possible. Ollie Williams explains how each API works and how to put them together to style a selection of text.

Highlighting A Range Of Text


5. Do We Still Need Build Tools?

Build tools usually rank among the things that developers struggle with the most when working with JavaScript. So, how necessary are they for front-end development in 2026? Ollie Williams explores the benefits and drawbacks of JavaScript module bundlers, transpilers, types, minification, and frameworks, as well as of CSS build tools.

Do We Still Need Build Tools?


20 Years and Counting: Thanks For Being Smashing!

Do you know that SmashingMag has been around for 20 years? Thank you so much for reading articles, newsletters and attending workshops and conferences — online and offline.

Smashing Workshops and Conferences
This year, Smashing has turned 20 years old. You can show your support with a one-time contribution.

If Smashing has helped you learn something, solve a problem, or see things from a new perspective, please consider making a one-time contribution. Your support helps us keep practical web knowledge open and accessible to everyone.

Thank you for being part of the Smashing community! 🧡


6. What’s New In ECMAScript 2026

Every year after the final language specification approval, Paweł Grzybek summarizes the latest additions to ECMAScript. This year is no exception. In his blog post “What’s new in ECMAScript 2026,” Paweł explores the new additions, how they work, and the gaps they close.

What’s New In ECMAScript 2026


From our sponsor

Bring Wild Ideas: Spread Them At MozFest (October 28–30 In Barcelona)

Mozilla Festival
Last year, more than 2,000 people came together to unlearn old ways of building tech. This year, with eight tracks and a spot in Barcelona's Open Tech Week, MozFest gives your ideas room to run wild. Join us for three days of conversation and hands-on building. Get your badge →


7. How To Audit Dependencies

As the web platform evolves, a surprising number of the libraries you use in your project has become redundant. But which ones are safe to remove? Jad Joubran wrote a practical guide in which he breaks the audit down into clusters. By the end, you have a repeatable process that you can run on your package.json once a quarter to ensure you don’t ship any unnecessary bulk.

How Baseline Can Help You Ship Less JavaScript


8. Accessible UX Research, Now Shipping 📚

Our newest Smashing book, Accessible UX Research by Michele A. Williams, is shipping worldwide! Get the book right away or get the eBook and start reading.

Accessible UX Research
Meet our brand-new book: “Accessible UX Research” by Michele A. Williams. Printed copies shipping now.

Accessible UX Research is your practical guide to making UX research more inclusive of participants with different needs — from planning and recruiting to facilitation, asking better questions, avoiding bias, and building trust. Download a free sample (PDF, 2.3MB) or get the book right away.


9. Upcoming Workshops and Conferences

That’s right! We run online workshops on frontend and design, be it accessibility, performance, or design patterns. In fact, we have a couple of workshops coming up soon, and we thought that, you know, you might want to join in as well.

Smashing Online Events
With online workshops, we aim to give you the same experience and access to experts as in an in-person workshop from wherever you are.

As always, here’s a quick overview:


10. Person Of The Week: Carmen Ansio

Please give a warm round of applause for our Person of the Week: Carmen Ansio. Carmen is a Design Engineer focused on design systems, motion, and accessible UI. She is currently a Design Technologist at Stripe, where she builds components, patterns, and tooling for Stripe’s design system, Sail.

Person Of The Week: Carmen Ansio

Carmen writes about building at the intersection of design and code on her blog and occasionally speaks about it on stage. She also shares demos and experiments, exploring the possibilities of CSS, motion, and creative coding. Thank you for everything you do for the community, dear Carmen! 🏆


11. Recent Smashing Articles


This newsletter issue was written and edited by Cosima Mielke, Vitaly Friedman, and Iris Lješnjanin.


Sent to truly smashing readers via Mailchimp.
We sincerely appreciate your kind support. You
rock.

Follow us on Mastadon • Join us on Bluesky