modules icon indicating copy to clipboard operation
modules copied to clipboard

hot reload modules w/ es6 modules

Open seiyria opened this issue 4 years ago • 7 comments

Hey! @Fishrock123 pointed me here for something I was thinking about.

While I don't have a particularly large project, back when all I had was a require cache, I could clear it out to "hot reload" a file/module/chunk of code. It wasn't the best possible way to get my code running without a restart (nodemon or similar) but it worked without forcing me to do fresh restarts all the time.

I'm using Typescript these days and, with that, ES6 imports (like most are I imagine). For reference, I'm making a game but it has a few hundred files (which is probably not a lot in comparison to some larger applications), and restarting it (I'm using ts-node-dev at the moment) still takes a solid 20-30 seconds to get everything running again. I think it would be much easier if I could hotswap my code in by somehow clearing out parts of the ES6 module cache.

I realize after talking with @Fishrock123 that ES6 modules are meant to be immutable and probably for good reason, but is it possible node will allow a dev to override this issue in development environments?

seiyria avatar Dec 20 '19 23:12 seiyria

Hiya @seiyria ! Thanks for the investigation.

Unfortunately neither the spec, nor the engines allow for hot reloading at this time. There could be future investigations with things like the debugger protocol are likely what I'd recommend but cannot provide a path forward on how to do this currently. We are actively discussing an unload API for the cache, but it likely is not going to do what most hot swapping/mocking libraries do today and might require some migrations of the tools using the current techniques.

bmeck avatar Dec 21 '19 00:12 bmeck

There could be future investigations with things like the debugger protocol are likely what I'd recommend but cannot provide a path forward on how to do this currently.

The inspector protocol's Debugger.setScriptSource?

weswigham avatar Dec 29 '19 23:12 weswigham

The inspector protocol's Debugger.setScriptSource?

IIRC there's an open bug somewhere in the V8 tracker for setScriptSource ("live edit") for modules. I asked a few years ago and it wasn't a priority. I hope that'll change eventually though. 🤞 Last I saw was: https://chromium.googlesource.com/v8/v8.git/+/6b6ed60155314fc608504b235382909ebedc23d8

jkrems avatar Dec 30 '19 00:12 jkrems

To immediately correct myself: Looks like thanks to @ak239 Debugger.setScriptSource does work these days for modules! https://github.com/v8/v8/commit/0cec56a4099d00e7ff0f67653d809b75e353703a

jkrems avatar Dec 30 '19 01:12 jkrems

Ref: nodejs/tooling#51

boneskull avatar Aug 26 '20 19:08 boneskull

You could do this with an ESM loader. When I implemented a mocking library for testdouble (https://github.com/testdouble/quibble) I had to implement "deleting a module" because in a test you can mock a module differently many times.

Obviously, you can't do this by deleting the module from the cache, because as mentioned above, this isn't available. But the next best thing is to load the module again as a separate "module".

You can see the explanation of how it works here: https://dev.to/giltayar/mock-all-you-want-supporting-es-modules-in-the-testdouble-js-mocking-library-3gh1.

giltayar avatar Aug 28 '20 05:08 giltayar

Removing the label, we've discussed this extensively and @giltayar has one way to solve this.

MylesBorins avatar Oct 07 '20 19:10 MylesBorins