DEV Community

Marie Berezhna
Marie Berezhna

Posted on

Import Maps: Why Nobody Talks About Them (But Maybe Should)

#webdev #javascript #programming #frontend

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';
Enter fullscreen mode Exit fullscreen mode

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>
Enter fullscreen mode Exit fullscreen mode

Now, in your <script type="module">, you can write:

import React from "react";
Enter fullscreen mode Exit fullscreen mode

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?

  1. 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.)

  2. Tooling momentum is too big

    → Everyone already uses Vite, webpack, etc. Import Maps don’t fit the current “npm install + dev server” mindset.

  3. 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.

Top comments (1)

Collapse
 
xwero profile image
david duymelinck •

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.