Compare SVG rasterizers

Render the same SVG with each of QIP’s SVG rasterizer components and compare the results. Edit the SVG, choose a component, and the image renders again in your browser. Nothing is uploaded.

SVG

Component Skia RGBA8 sRGB KTX2 ThorVG RGBA8 sRGB KTX2 QIP SIMD, linear light RGBA32F linear BT.709 KTX2 QIP SIMD RGBA8 sRGB KTX2 QIP center-sampled RGBA8 sRGB KTX2 QIP center-sampled B8G8R8A8 sRGB BMP

Width Height White background

The time shown is one render call on an already compiled and instantiated module. The first render of each component also downloads and compiles it. Width and height of zero use the SVG’s own size. The RGBA32F output is converted from linear light to sRGB for display.

Components #

Component	Renderer	Output	Size	Memory limit	Text
Skia	Skia CPU, analytic coverage	RGBA8 sRGB KTX2	3439.89 kB	544 MiB	TrueType, OpenType, WOFF, or WOFF2 fonts sent as `multipart/related` parts; this page sends Inter Display Regular and Bold
ThorVG	ThorVG CPU scan converter	RGBA8 sRGB KTX2	281.83 kB	512 MiB	None
QIP SIMD, linear light	4 by 4 sample grid	RGBA32F linear BT.709 KTX2	318.64 kB	512 MiB	Inter Display Regular and Bold outlines
QIP SIMD	4 by 4 sample grid	RGBA8 sRGB KTX2	316.82 kB	512 MiB	Inter Display Regular and Bold outlines
QIP center-sampled	One sample per pixel	RGBA8 sRGB KTX2	289.27 kB	128 MiB	Inter Display Regular and Bold outlines
QIP center-sampled BMP	One sample per pixel	B8G8R8A8 sRGB BMP	289.10 kB	128 MiB	Inter Display Regular and Bold outlines

Skia accepts up to 32 MiB of SVG and fonts together; the others accept up to 1 MiB of SVG. All output at most 8192 pixels per side and 25 million pixels in total. None of them load external resources. The BMP component has no width or height uniform.

Choosing one #

Skia has the broadest SVG support, including masks, filters, and <text>. It is by far the largest download.
ThorVG covers a broad SVG paint model with antialiased edges at a fraction of Skia’s size, but it does not render text.
QIP SIMD, linear light keeps floating-point linear-light output for later linear-light stages.
QIP SIMD uses the same antialiasing and quantizes to RGBA8.
QIP center-sampled uses the least memory and takes one sample per pixel, so edges are not antialiased.

The QIP rasterizers support a limited SVG subset: rect (including rx and ry), circle, line, path, polygon, polyline, text, and g elements with transforms, solid colors, linear and radial gradients, opacity, fill-opacity, and stroke-opacity. Text is always drawn with Inter Display, whatever font-family says. They use the current_color_rgba uniform for currentColor instead of the CSS color property, ignore the style attribute, approximate arcs with straight segments, and draw every stroke with round caps and joins. Group opacity is applied to each child separately, so overlapping children show through each other.

Run with Node.js and qipx #

qipx runs the same components locally:

npx @qip.dev/qipx qip.dev run -i drawing.svg \
  -F 'regular=@InterDisplay-Regular.ttf;type=font/ttf' \
  -F 'bold=@InterDisplay-Bold.ttf;type=font/ttf' \
  image/svg+xml/svg-rasterize-skia-with-fonts-to-ktx2-r8g8b8a8-srgb.wasm \
  -u width=640 -u height=400 > drawing.ktx2

Replace the component path to try a different rasterizer. The others take plain SVG, so drop the -F fonts for them.