WebAssembly Debugging Demystified

on YouTube ↗13m

" summary

Explains how to get line-level stacks out of wasm: DWARF debug file format and Source Maps enable original filenames and line numbers, browser DevTools then set breakpoints and show scopes, the webassembly binary toolkit decompiles and interprets binaries to find logic bugs, a demo edits the text-format and reassembles it to fix a Fibonacci bug, memory leaks get diagnosed with Memory Inspector in Chrome and heap dumps, and production symbolication uses wasm-split and Sentry to upload debug files.

AI-written summary · about

" chapters (9)

1. 0:00WebAssembly debugging intro
2. 1:46DWARF and Source Maps
3. 3:56Browser DevTools for WASM
4. 4:17Advanced WABT debugging
5. 6:45Memory leaks in WASM
6. 8:08Release binary prep
7. 9:12Debug data with Build IDs
8. 10:55Production exception monitoring
9. 11:17Q&A on non-browser WASM

" related talks

• 09mDebugging WebAssembly with modern toolsIngvar Stepanyan · Chrome Dev Summit 2020
• 46mWebAssembly (Digging a bit deeper)Steve Klabnik · Open Source 101 at Home 2020
• 26mNavigating Strategies for Debugging WASMShivay Lamba, Ashwin Kumar Uppala · Cloud Native Wasm Day NA 2023
• 24mNo More Printf: Interactive Debugging Wasm for web and serverTill Schneidereit, Ralph Squillace · Wasm I/O 2025
• 32mWebAssembly DemystifiedJay Phelps · Jazoon TechDays Spring 2017
• 37mDecoding the hype behind WebAssembly: Looking under the hoodSohan Maheshwar · Heapcon 2024
• 25mBehind the Scenes: Debugging Kotlin/WasmArtem Kobzar · WasmCon 2024
• 52mWebAssembly: Taking Your C++ and Going PlacesNipun Jindal, Pranay Kumar · CppCon 2022