On the fly WebP decoding with Web Assembly and Service Workers (Main Stage)
summary
Demonstrates a concrete pipeline: compile a WebP C decoder to WebAssembly with Emscripten, load it in a Service Worker, intercept .webp requests, decode in the WASM heap, copy pixels into JavaScript, and emit PNG/BMP responses so browsers without native WebP render images. Notes practical hurdles: canvas not available in workers so off‑screen canvas is behind flags and inconsistent, and a custom BMP encoder replaces slower data URLs. AutoCAD and Google Earth examples show real legacy codebases running this way.
AI-written summary · about
chapters (17)
- 0:00Introduction
- 1:17The Web
- 2:35Web Assembly
- 4:23JavaScript
- 5:06Use Cases
- 6:23Why WebP
- 8:46The code
- 10:24Testing
- 11:40Different approaches
- 13:01How Web Assembly works
- 14:16My mini library
- 15:36WebP decoder
- 16:37Get info
- 17:09Copy info
- 17:56Generate image data
- 20:17C decoder RGB
- 20:41Wrap up
related talks
27mService Workers + WebAssembly
19mOn Dynamic Multimedia Pipelines for Opening Browsers to New Formats
28mWebAssembly: Of Portability, and Performance
16mWhy WebAssembly
27mWebAssembly for Performant Interactivity
29mWeb Assembly, the Future of JS, and a multi-language web
53mLet the main thread breathe!
42mWebAssembly? Web and Assembler? WTF!