You know what sucks?
Bundling.
Install react
→ ends up in node_modules/
, goes through Vite/Rollup/webpack, gets transpiled, hashed, minified… just so you can write:
import React from 'react';
But what if you didn’t need a bundler at all?
🧩 What Are Import Maps?
Import Maps are a native browser feature (yep, no polyfill needed in modern Chromium) that let you map bare module specifiers to real URLs — directly in the browser.
Here’s the magic:
<script type="importmap">
{
"imports": {
"react": "https://esm.sh/react@18",
"react-dom": "https://esm.sh/react-dom@18"
}
}
</script>
Now, in your <script type="module">
, you can write:
import React from "react";
And the browser knows where to get it, no bundler, no build step, no CDN script tags.
🚀 Why It’s Cool
- No build step: Instant dev workflow
-
No
node_modules/
: Zero install, zero bloat - Works with CDNs like Skypack, ESM.sh, JSPM
- Great for micro frontends, prototypes, and fast loading islands
😬 So… Why Isn’t Everyone Using This?
-
Not supported in all browsers yet
→ Mostly just Chromium for now. Firefox is dragging. Safari? Radio silence.
(You can polyfill it, but it kills the whole “zero tooling” idea.)
-
Tooling momentum is too big
→ Everyone already uses Vite, webpack, etc. Import Maps don’t fit the current “npm install + dev server” mindset.
-
No ecosystem support
→ Most tutorials, libraries, and docs assume you're bundling. Period.
✅ When Should You Use It?
Import Maps shine when you want:
- No build tools at all
- To prototype quickly
- To ship something truly small
- To combine multiple micro-apps without a monolith
They’re especially useful with:
- Web components
- Vanilla JS apps
- Islands architecture setups (Astro, Marko, etc.)
- JAMstack sites that want dynamic bits without bundling
🧠 Final Thought
Import Maps don’t want to replace your build system.
They’re just saying: "Hey... you might not need one."
They're not mainstream (yet), but they offer a glimpse at a simpler frontend world — one where browsers do more and you ship less.
Worth keeping an eye on.
MDN shows Firefox doesn't support multiple import maps. And Safari supports import maps.
So you can use them on most browsers with the caveat that it is a single import map.
The biggest problem I see with import maps, or any import functionality that allows third party websites, are toolchain attacks. With backend languages, like Go, It is safer because the app goes through a build process.
If a third party website is taken over by malicious people and a library is imported from it, there will be a certain amount of time your site could host malware until it the import is changed.