Shimport: Use JavaScript modules in all browsers, including dynamic imports | Hacker News Reader

Shimport: Use JavaScript modules in all browsers, including dynamic imports

github.com

44 pointsoctosphere19 comments

The author highlights support of dynamic imports multiple times. But why; is there something particularly interesting about it? Other module systems did this ages ago, e.g. RequireJS, so it's not like that's the main reason to adopt JS modules.

The interesting part is that it's officially part of the ECMAScript spec and HTML standard, and this library is just polyfilling it temporarily until more browsers implement it – so eventually you can use the exact same syntax and function calls without this library.

Things like RequireJS have certainly served people perfectly well, but they're just systems that folks came up with and implemented in userland rather than any official standard – you will always need a library to use them.

A minor nitpick, but the dynamic import proposal [0] is actually in stage 3 of the TC39 process [1].

Although you are correct that the WHATWG HTML spec requires implementing the import() proposal if JavaScript is supported.

[0] https://github.com/tc39/proposal-dynamic-import

[1] https://tc39.github.io/process-document/

> in all browsers

Does it work in IE9 (still relevant since it is mandated by certain governments)? The GH README has no statement of browser support.

It looks like it expects Promises to be implemented (there’s a Promise.all call in the minified unpkg version), so unless you add a Promises polyfill then I’d say it isn’t compatible with IE9.

Can I Use says IE and Opera Mini are the only two major browsers that don’t have module support. [1]

It also says that the two browsers that don’t support promises are IE and Opera Mini. [2]

That seems like an issue if this needs promises.

1. https://caniuse.com/#feat=es6-module

2. https://caniuse.com/#feat=promises

> Can I Use says IE and Opera Mini are the only two major browsers that don’t have module support

Firefox doesn’t currently support dynamic imports and I’m not sure Edge does either, so maybe that’s the use case for this? Or if someone is locked into an older version of Chrome or Safari for some reason. But yes, all of the “major” browsers support modules for the most part.

It's unclear if Firefox is still a major browser. 1-2% of traffic support cutoff thresholds are fairly common and Firefox is sitting in that territory now (about 1.5% of our traffic last I looked).

Globally I believe Firefox is sitting around 3%. Of course for different sites, this may vary.

> Firefox doesn’t currently support dynamic imports [...]

I wasn’t looking up dynamic imports. I guess that’s the thing that makes this library useful.

> so unless you add a Promises polyfill then I’d say it isn’t compatible with IE9.

I agree with your technical assessment, but I'd put it: just add a Promises polyfill and it's compatible with IE9.

This is of course assuming someone is paying you large amounts of money to make a website that works on IE in 2018 - the gulf is so huge these days between the 4 major evergreens that's a bunch of extra work, but if you have a customer with fat pockets, then be my guest.

Edit: you added something about governments - which governments require IE9?

> just add a Promises polyfill and it's compatible with IE9.

I don’t disagree. It just wasn’t clear if the parent was looking for “native only” support or support with polyfills. Though given that this library itself is basically a polyfill I don’t see that really being an issue.

I can’t speak to 9 but I have to work on a site that requires Java applets (yeah) and the only browser left is IE 11. So until that changes it gets supported.

I only have to support one browser that doesn’t already have native module support. IE 11.

It seems REALLY weird to me to have a project advertise it self as “in all browsers“ and then never actually specify what browsers it works in.

Just curious, which governments mandate IE9?

See also the recent alpha release of SystemJS https://guybedford.com/systemjs-2.0-alpha

Can you cache modules?

> new Function('import("' + src + '")')();

oh god the horror. using EVAL AND not escaping the input. Can't you just check presence of `require`?

Unfortunately no, because `import` is special syntax that just happens to look like a function call. It's not actually a function/object/etc. in the global scope. Here's what Google's guide to `import` says about it:

> Note: Although import() looks like a function call, it is specified as syntax that just happens to use parentheses (similar to super()). That means that import doesn't inherit from Function.prototype so you cannot call or apply it, and things like const importAlias = import don't work — heck, import is not even an object! This doesn't really matter in practice, though.

Using eval (or the Function form of it in this case) doesn't seem like a huge issue here, because if you're accepting a user-supplied `src`, it doesn't have to contain any malicious syntax escapes in the `src` string itself to do whatever it wants...they could just supply a perfectly normal script URL of their choosing that will be executed anyway.

Reply on news.ycombinator.com