Man vs Vibes

Yesterday I got nerd sniped into missing a workout.

{{< video fullWidth=true src="/rectangles.webm" type="video/webm" >}}

Frankenpenguin | Repository

[2:30 PM] I discovered a blog post about vibe coded performance benchmarks for drawing a large number of rectangles on the HTML canvas. It was an interesting read and I was nodding along until I saw that all the Typescript benchmarks were better than the Rust ones. That can't be right?

[3:00 PM] My hunch was that most of the time was spent crossing the boundary between Rust and Javascript. This is something I've been burned by in the past.

[3:30 PM] I decoupled the work scheduling from the sync compute and rendering [1]. Deleted a few lines of code that were creating the render loop and recursively calling it from the request_animation_frame. And then moved the scheduling to Javascript.

BEFORE

AFTER

[3:45 PM] I run the benchmarks. Hmmmm, it's 2x faster, not bad. I was mistakenly comparing the updated Rust + WebGL implementation to the TS + WebGL version.

[4:00 PM] The train is unusually late.

[4:38 PM] I get to the gym, but the person turns me away as I'm too late [2].

[5:21 PM] I push the repository to GitHub.

[This morning] I realize that I was comparing the wrong benchmarks and the diff resulted in a 10x bump in perf.

Aside 1: To schedule async work in the browser you can pass a callback to the requestAnimationFrame API. As Rust doesn't ship with a runtime, scheduling work requires using the closest one avaiable. In the browser it ends up being... the browser. So you have to use a crate that would provide the bindings to the requestAnimationFrame API.

Aside 2: I ended with playing Table Tennis afterwards so it's all good.