webpack: Unable to import WebAssembly modules bigger than 4KB

Do you want to request a feature or report a bug?

Bug

What is the current behavior?

When importing WebAssembly modules bigger than 4KB browser throws

RangeError: WebAssembly.Instance is disallowed on the main thread, if the buffer size is larger than 4KB. Use WebAssembly.instantiate.

If the current behavior is a bug, please provide the steps to reproduce.

Import the WASM module bigger than 4KB.

What is the expected behavior?

The module should be imported and instantiated correctly.

If this is a feature request, what is motivation or use case for changing the behavior?

Please mention other relevant information such as the browser version, Node.js version, webpack version and Operating System.

Browser: Google Chrome 64.0.3282.140 (Official Build) (64-bit) Node.js: 8.9.1 webpack: 4.0.0-beta.1 Operating System: macOS 10.13

About this issue

Original URL
State: closed
Created 6 years ago
Reactions: 2
Comments: 20 (10 by maintainers)

Most upvoted comments

We have no plans of removing the size limit from Chrome. Using WebAssembly.{Instance,Module} is a bad practice, and hurts the user experience especially for large modules. Use the WebAssembly.instantiateStreaming pattern instead.

+17

mathiasbynens on Apr 13, 2018

@mathiasbynens Imposing arbitrary limits on APIs is a bad practice. Super disappointed in Chrome’s direction on this. It’s fine to encourage async use but to offer a sync API and then make it broken is super wonky. As discussed in #6433 there are other ways to discourage API without delivering a broken one.

@sokra From the https://github.com/webpack/webpack/issues/6433#issuecomment-368094760 it looks like there’s not supposed to be a 4kB limit in workers. Have you found that to be the case and is that something currently being leveraged by webpack?

Update:

It looks like Chrome 66, due out in a few days, will remove the 4kB limit in workers.

jdalton on Apr 13, 2018

Is there a known workaround for this? At the moment it seems like this pretty much renders webpack + wasm unusable. What does the timeline for a fix look like?

moritzuehling on Apr 27, 2018

@jolestar Don’t forget to call URL.revokeObjectURL afterwards:

const blob = new Blob([buffer], { type: "application/wasm" });
const url = URL.createObjectURL(blob);
wasm = await instantiateStreaming(fetch(url), {});
URL.revokeObjectURL(url);

Pauan on Apr 23, 2019

fixed

sokra on May 13, 2018

@fschutt we’re adding a fallback here https://github.com/webpack/webpack/pull/7983

xtuc on Sep 30, 2018

yes @Eruant Webpack is going to use instantiateStreaming in the future to bypass this limitation.

xtuc on May 1, 2018