Post

Joan León
@nucliweb.net

A Gaussian blur in Canvas 2D takes 280ms. The same filter with WebGPU: 8ms. I wrote the second article in the WebGPU series: image processing in the browser with WGSL shaders and real benchmarks. joanleon.dev/en/webgpu-im... #WebPerf #WebGPU #JavaScript #Performance

joanleon.devImage processing in the browser with WebGPU | Joan LeónHow to use WebGPU to apply filters and transformations to images in the browser. Real benchmarks comparing with Canvas 2D.
Joan León@nucliweb.net

For years, the performance ceiling in the browser has been clear: the CPU. WebGPU changes that. 🧵 It’s not a library or a framework. It’s a browser API that gives direct access to the device’s GPU, enabling a level of parallelism the CPU cannot match. #WebPerf #WebGPU

Joan León
@nucliweb.net

Fair point! WebGL is definitely the battle-tested veteran here. I focused on WebGPU to showcase the modern API and its compute shader capabilities, which handle memory and parallelization differently. 🧵

Alex Suzuki
@alexsuzuki.com

Who knows, if I find the time and inclination… Your blurs could be massively sped up by exploiting separability by the way (blur in one direction, then other). See: bartwronski.com/2020/02/03/s...

bartwronski.comSeparate your filters! Separability, SVD and low-rank approximation of 2D image processing filtersIn this blog post, I explore separable convolutional image filters: how can we check if a 2D filter is separable, and how to compute separable approximations to any arbitrary 2D filter represented …