v4.0

[samizdatco]

Skia Canvas is a ‘headless’ vector graphics renderer and on-screen windowing toolkit that lets you write code using the familiar Canvas API but without needing a browser to run it in. Instead, your graphics code runs anywhere Node.js does, making it possible to render image files from a web service or display interactive animations in a native OS window on your desktop. Behind the scenes, it’s all powered by Skia, the GPU-accelerated graphics engine used by Google Chrome.

See the project website for details and documentation.

Version 4.0 Highlights

Faster off-screen rendering & reduced memory usage

• dedicated render thread for GPU work reduces CPU↔GPU roundtrips and cache duplication
• canvas and vector content are cached between draws, accelerating repeated rasterizations
• native memory usage is now reported back to V8 for more responsive garbage collection
• the using keyword is now supported by canvas & image objects for explicit deallocation

Improved on-screen refresh & event handling

• redraws are now tied to the the display hardware’s ‘vblank’ signal for rock-solid frame rates
• the OS and Node event loops have been harmonized so setTimeout, requestAnimationFrame, etc. continue to run while the window animates & handles UI events
• now supports browser-style pointer* events, bridging mouse and touch inputs

Imagery

• added native PDF rendering as single-page images or multi-page documents
• embedded <style> tags in SVGs are now parsed and honored
• ImageData now supports Float16-based pixel buffers for ‘half float’ color types
• Sharp integration now supports all Skia colorspaces & types
• more efficient PNG exports via the filters property and its new "none" default

Typography

• text in PDF exports is now selectable/searchable
• variable fonts now automatically instance for weight (wght), width (wdth), and optical size (opsz)
• variable font axis values & OpenType features can now be configured manually
• each font’s supported features are now detectable using the FontLibrary
• antialiasing, kerning, and fake-bold/oblique synthesis are now configurable

Vector drawing

• drawing operations now use a batched drawlist, speeding up complex paths by reducing Node→Rust bridging
• paths (and their contours) can now be measured; length offsets can be used to calculate positions and angles or be used as start/end points for slicing.
• boolean operations now return paths that are compatible with canvas’s default "nonzero" winding rule

Wide-gamut colors

• all color strings now support the full CSS 4 Color spec and its new colorspaces
• canvas contexts can be created in Display P3 or sRGB mode (and exported bitmaps will use a matching color profile)
• canvas gradients’ interpolation colorspaces can now be customized
• on-screen rendering now uses Display P3 by default on macOS

Easier installation

• the package no longer uses an install script or needs network access aside from the npm registry
• uses only 3 third-party dependencies, cutting down on supply-chain risk

See the release notes for additional details and breaking changes.