A factorial project, to show hot-reloading changes being reflected in the browser.
Hot-reloading has been a huge productivity boost to projects like React and other front-end tools, but with Web Assembly, it has been a challenge to enable live changes to be propagated to the browser due to a compile step from a non-JS language (eg. Go or Rust). We hoped to get it to work with zero configuration on the part of the user, via the Parcel bundler.
What it does
The project enables Web Assembly to be hot-reloaded in the browser on file change, for the Parcel bundler. In practical terms, whenever a project file changes (eg. a Rust project), the browser will automatically reflect this change without needing a page reload, theoretically allowing state to be preserved. This is a significant development improvement from the current ability of Parcel, which only shows changes on each page reload.
How we built it
Challenges we ran into
Parcel's code base is massive, and due to its young age, has much less documentation than other more mature build tools. A lot of approaches we looked into simply required changing too much of the code base that wasn't originally built to support Web Assembly originally. Due to its zero-config approach, adding features often required changing a lot of internal code, so we tried to strike a balance of not rewriting too much versus adding functionality and generalizing where it made sense to.
Accomplishments that we're proud of
We got the Rust project to be hot-reloaded!!!!!!! This is the first time I've seen Web Assembly be hot-reloaded in the browser working out-of-the-box, with zero configuration beforehand on the part of the user.
What we learned
Over the course of this weekend, our team has learned a lot of the internals of how Parcel works. We've explored how the Rust compiler gets called, how bundles are hashed differently in production and development, how caching refreshes work, which processes get called on each refresh and update, and so much more. We've also learned a lot about the challenges of Web Assembly and its limits compared to other traditional assets.
What's next for WASM hot-loading for Parcel
The next step would be to be able to support other static file types, and improving incremental build performance, perhaps via more intelligent caching, and better tree traversal to hot-reload the minimal number of modules on each change.