Surpass JS Performance with Optimized Collision Detection in WASM using a Linked List Grid

Share this video with your friends

Send Tweet

To write a grid collision detection optimization in C requires thinking about the data structure of the grid more than in JS. In C we can represent this with a linked list and show how to convert the JS optimization code into this structure. When we compare the final performance, the WebAssembly code is now faster than the JS code - being able to write a low-level, more efficient data structure in memory is what gives WebAssembly its best advantage over JS. For those new to the principles, a good introduction to data structures and algorithms is the CLRS Introduction to Algorithms book.

Demo repo: https://github.com/guybedford/wasm-demo

Note the demo is currently only supported in Chrome Canary with the Experimental Web Platform flag (chrome://flags/#enable-experimental-web-platform-feature) enabled due to the use of ES modules and WebGL 2.0.

Eon
Eon
~ 7 years ago

I liked the lesson about WASM! It really opens new doors. But there is a lot of C/C++ lingo I (simple js-programmer) don't understand. I need more dummy lessons into C/C++ ;).

ben
ben
~ 6 years ago

Great lessons! I keep getting a "page unresponsive" warning from Chrome on this lesson page (Chrome 67 2015 Macbook pro). It would make sense to turn of the live code preview pane?