Converting a raster image to SVG sounds like a backend job: upload the file, enqueue a worker, run a native tracer, and return the result.
For simple logos, icons, badges, and flat illustrations, that architecture is often unnecessary. Modern browsers can decode the image, run a WebAssembly tracer, construct the SVG, and let the user download it without sending the source image to a server.
I recently used this approach for a browser-based JPG-to-SVG workflow. This post focuses on the engineering decisions that made the converter responsive and predictable rather than on the surrounding UI.
The pipeline
The browser-side pipeline has seven stages:
