Update @wordpress/vips package with fully inlined wasm-vips build#74478
Update @wordpress/vips package with fully inlined wasm-vips build#74478adamsilverstein wants to merge 6 commits into
Conversation
* Add wasmInlinePlugin to inline vips * Add wasm inlining tests * doc blocks
* Add shopify/webworker to babel config * Add "@shopify/web-worker" dependency * Add vips-worker build files
* Add wasmInlinePlugin to inline vips * Add wasm inlining tests * prettier * Tests, try 2 * Improve doc blocks * plugin: match other plugin pattern * Add shopify/webworker to babel config * Add "@shopify/web-worker" dependency * Add vips-worker build files * try: add worker setup test * prettier * correct package order * Fix the build * fix @shopify/web-worker version * stub shopify/web-worker * remove console log
|
Size Change: 0 B Total Size: 3.05 MB ℹ️ View Unchanged
|
|
Flaky tests detected in 6ced360. 🔍 Workflow run URL: https://github.com/WordPress/gutenberg/actions/runs/20837824644
|
|
The following accounts have interacted with this PR and/or linked issues. I will continue to update these lists as activity occurs. You can also manually ask me to refresh this list by adding the If you're merging code through a pull request on GitHub, copy and paste the following into the bottom of the merge commit message. To understand the WordPress project's expectations around crediting contributors, please review the Contributor Attribution page in the Core Handbook. |
| test( 'should have substantial inlined WASM data', async () => { | ||
| // The inlined WASM should be large (original files are several MB) | ||
| // This ensures we're actually inlining the full WASM, not just a stub | ||
| // The built file should be at least 10MB due to the inlined WASM | ||
| expect( buildContent.length ).toBeGreaterThan( 10 * 1024 * 1024 ); | ||
| } ); |
There was a problem hiding this comment.
I'm a bit of a noob when it comes to all this (Base64-encoded WASM especially). I was just curious about the actual size impact, or will it vary? Will there be any memory impact for lower-end devices?
There was a problem hiding this comment.
I don't really know the impact, here is what Claude said which seemed sensible:
Base64 encoding has a fixed overhead of approximately 33% increase in size. This is because Base64 converts every 3 bytes of binary data into 4 ASCII characters (encoding 6 bits per character instead of 8 bits per byte).
So if your WASM binary is 1 MB, the Base64-encoded version will be roughly 1.33 MB.
For memory impact it said:
Memory Impact
This is where it gets more interesting for lower-end devices. When you load Base64-encoded WASM, you're looking at a memory sequence like:
- Base64 string in memory — the full 1.33x sized string
- Decoded ArrayBuffer — the original binary size (these briefly coexist during decoding)
- Compiled WebAssembly.Module — browser-optimized representation
- Instantiated module — runtime memory for the actual execution
Steps 1 and 2 create a brief spike where you're holding ~2.33x the original binary size in memory simultaneously before the string can be garbage collected.
A few other points worth considering:
- Client Side Media(CSM) processing is a relatively heavy operation that won't work well on low powered devices. Once we determine device capability requirements, we can skip CSM for those clients
- Should the device be underpowered (and not detected as sunch) and the processing times out, we can fall back to the server
- My hunch is the vast of desktop computers used to edit WordPress sites will have no trouble with the requirements, only lower end phones would fail (or maybe very low powered devices like Chromebooks)
There was a problem hiding this comment.
Thanks for confirming @adamsilverstein
Once we determine device capability requirements, we can skip CSM for those clients
...
My hunch is the vast of desktop computers used to edit WordPress sites will have no trouble with the requirements
Sounds good 👍🏻
|
This builds branch builds and nothing stands out to me. I'll just tentatively ping @youknowriad to check that it aligns with the all the new work around the build, and maybe @adamziel who has a lot of experience with WASM to run his eye over it. Otherwise it LGTM. |
|
Closing in favor of #74629 which eliminates the |
|
Updated version in #74785 |
Fixes #74352
Configure Build Pipeline:
Implement Blob-Based Worker Loader:
Implement Custom Vips Instantiation:
Decode the WASM_BINARY_BASE64 string to a Uint8Array.
Pass this buffer directly to the Vips module constructor (via the wasmBinary or locateFile override) to bypass the network request entirely.