Backend Development 8 min read

Can HTTP Imports Replace npm? Exploring Deno, ESM, and CDN‑Based Module Loading

From revisiting Deno’s impact on package management to introducing the imove visual workflow library, this article examines HTTP‑based module imports, ESM loaders, CDN services like esm.run, and the challenges of replacing Node’s npm ecosystem, highlighting practical code examples and future directions for JavaScript runtimes.

Taobao Frontend Technology
Taobao Frontend Technology
Taobao Frontend Technology
Can HTTP Imports Replace npm? Exploring Deno, ESM, and CDN‑Based Module Loading

Background

In 2018 the author wrote “Deno is not the next Node.js!” and now revisits Deno in 2021, noting how Deno changes package management by eliminating npm and enabling simple, low‑cost experimentation.

imove Project

imove is an open‑source, function‑oriented, visual workflow library for JavaScript. It supports:

Workflow visualization : easy drawing and intuitive logic expression.

Logic reuse : nodes can be reused and configured with parameters.

Extensible : a single function can add plugins.

Multi‑language compilation : supports output for JavaScript, Java, etc.

Each node corresponds to a JavaScript file that exports a function (as a Promise). Example of a “login check” node:

<code>import fetch from 'node-fetch';
export default async function(ctx) {
  return fetch('/api/isLogin')
    .then(res => res.json())
    .then(res => {
      const { success, data: { isLogin } } = res;
      return success && isLogin;
    })
    .catch(err => {
      console.log('fetch /api/isLogin failed, the err is:', err);
      return false;
    });
}
</code>

The library aims to let operations configure logic that developers can assemble, test, and export as code, using X6 graphics and a JSON protocol.

Import‑HTTP

Deno allows importing remote modules via

--allow-net

, caching them locally. Similar functionality exists in the Node ecosystem through projects like

import‑http

(webpack/rollup plugin) and the

import-http/webpack

plugin:

<code>const ImportHttpWebpackPlugin = require('import-http/webpack');
module.exports = {
  plugins: [new ImportHttpWebpackPlugin()]
};
</code>

After configuration, modules can be imported directly from URLs:

<code>import React from 'https://unpkg.com/react';
import Vue from 'https://unpkg.com/vue';
console.log(React, Vue);
</code>

The plugin resolves

http

/

https

imports, caches them in memory and on disk, and works for both browser and Node environments.

esm.run Service

esm.run provides a CDN‑style hosting for JavaScript modules, syncing npm and GitHub packages to Amazon S3 and serving them through various CDNs.

Its architecture diagram:

CJS to ESM Conversion

Tools such as

esm

enable converting CommonJS modules to ESM without Babel or bundlers:

<code>require = require('esm')(module);
module.exports = require('./main.js');
</code>

Similar conversions are offered by services like jspm.io, skypack.dev, and pika.dev.

Conclusion

Deno’s innovations, HTTP imports, and CDN‑based module services illustrate a shift away from traditional npm‑centric workflows, yet they are not yet sufficient to replace Node.js entirely; the Node community continues to adopt ESM features and may soon embrace HTTP imports.

Node.jsWebpackESMDenoJavaScript modulesHTTP import
Taobao Frontend Technology
Written by

Taobao Frontend Technology

The frontend landscape is constantly evolving, with rapid innovations across familiar languages. Like us, your understanding of the frontend is continually refreshed. Join us on Taobao, a vibrant, all‑encompassing platform, to uncover limitless potential.

0 followers
Reader feedback

How this landed with the community

login Sign in to like

Rate this article

Was this worth your time?

Sign in to rate
Discussion

0 Comments

Thoughtful readers leave field notes, pushback, and hard-won operational detail here.