@napi-rs/canvas

Highlights

Portable text rendering by default

Text now defaults to the portable renderer, using FreeType on macOS, Linux, and Windows to make rendering and measureText results consistent across operating systems when the same fonts are registered.

Behavior change: default text output, measurements, and system-font resolution can differ from v1.0.12/v1.0.13. To restore the previous Chrome-like, platform-specific behavior, call:

const { setTextRenderer } = require('@napi-rs/canvas')

setTextRenderer('system')

Use getTextRenderer() to inspect the active mode. Installed fonts and fallback for characters missing from registered fonts can still vary by OS and machine.

What's Changed

• build: Bind the addon's own symbols on Linux so Electron's cxx runtime cannot replace them

• text: Draw text the same on every OS by default, add setTextRenderer

• path: Draw full-sweep arc() and ellipse() for every start angle

• path: Draw a degenerate ellipse() as straight lines like Chrome

• build: Compile Windows Skia with -ffp-contract=off like Chromium

• path: follow-ups to #1408: rotate() path, arc() start == end, rotated ellipse, isPointInStroke state, one-point stroke prune

• build: Compile skia-c with -ffp-contract=off like Chromium

• ctx: Keep Blink's double CTM as the source of truth

• ctx: Decide CTM invertibility from Blink's double CTM

• ctx: Skip the stroke of every one-point path like Chrome

What's Changed

• canvas: Preserve fractional global alpha through native paints

• canvas: Preserve pattern snapshots and honor current image sampling quality

• canvas: Enable dithering for gradient fill and stroke paints

• Retain display-p3 backing surfaces through context acquisition and resize

• canvas: WebIDL conversion for ImageData, getContext, createPattern

• canvas: Match Chrome for hsl() colors and gradient edge cases

• canvas: ImageData patterns and SvgCanvas reads like Chrome

• Reset style getters on resize, tag AVIF color, exact PDF alpha

• canvas: Match Chrome for alpha:false, clearRect and 'copy'

• skia: Build Skia with Chrome's CPU raster defines and blitters

• canvas: Draw Image sources from Chrome's decode-cache levels

• crash-safe non-finite args, ImageData sizes, DOMMatrixInit

• canvas: WebIDL conversion, arity checks and exceptions like Chrome

• imagedata: ImageData and get/put/createImageData work like Chrome

• canvas: Paths, clips, roundRect and setTransform work like Chrome

• canvas: Style getters, shadowColor and canvas sizes like Chrome

• canvas: Gradients and SVG conic export work like Chrome

• color: CSS Color 4/5 at every canvas color site, like Chrome

• canvas: Compositing, shadows, drawCanvas and filters like Chrome

• codecs: Chrome's encoders, AVIF decode, data: URLs and SVG images

• canvas: Parse fonts, lay out and measure text like Blink

• canvas: Rasterize text like Chrome with CoreText and Fontations

• canvas: float16 canvas storage and float ImageData formats

• svg: Draw SVG images like Chrome: CSS, var(), <use>, <image>

• canvas: Write DPI and text metadata in toBuffer, encode and encodeSync

• chrome/m157

What's Changed

• Emit CycloneDX SBOMs for platform packages

• Start a new subpath for each Path2D.addPath call

What's Changed

• use-after-free when ctx.restore() revives a GC'd CanvasPattern

• Release deferred recording on reads and cap recorded memory

• chrome/m156

What's Changed

• Invalidate FontCollection typeface cache on font registration

• chrome/m154

What's Changed

• Capture call-time snapshot in async encode APIs

• Snapshot canvas source in drawImage to avoid per-call pixel copy

What's Changed

• Prefer raster signatures over SVG markers

• Reject malformed raster images

What's Changed

• shadow: Apply shadowColor alpha once instead of squaring it

• shadow: Align Canvas2D shadows with Chromium

• chrome/m151

What's Changed

• image: loadImage settles on invalid input

What's Changed

• drawImage gray halo on transparent PNG edges with imageSmoothingEnabled

• Allow canvas package postinstall script for benchmark CI

What's Changed

• Chrome m148

What's Changed

• Use signed integers for canvas APIs that accept negative coordinates

What's Changed

• Prevent memory leak when drawing canvas onto another via drawImage()

What's Changed

• Chrome m146

What's Changed

• Add node-canvas compatibility layer (@napi-rs/canvas/node-canvas)

• putImageData bypassed deferred rendering PageRecorder

What's Changed

• Copy font data in GlobalFonts.register to prevent buffer invalidation

• Support http url in image src

• Add Drop impl for SkPictureRecorder to prevent memory leak

• Prevent memory leaks in encode_stream callback and SkPixmap

What's Changed

• Napi feature

• Implement deferred rendering with incremental layer caching

What's Changed

• Make Image class HTML spec compliant for jsdom integration

• Ignore Letter Spacing in Cursive Scripts

• image: Make Buffer load synchronous and add decode() method

• Add ctx.lang property for language-specific text rendering

• Add textRendering property for text rendering hints

What's Changed

• Chrome m144

• RTL text fillText(maxWidth) x positioning calculation error

What's Changed

Lottie

See lottie-to-video.ts for example

const { LottieAnimation } = require('@napi-rs/canvas')

// Load from file
const animation = LottieAnimation.loadFromFile('animation.json')

// Load from JSON string with resource path for external assets
const animation = LottieAnimation.loadFromData(jsonString, {
  resourcePath: '/path/to/assets',
})

github.com/user-attachments/assets/e99d61a8-901…

Changelog

• Add fontVariantCaps

• feta: Support CanvasRenderingContext2D.reset()

• Initial black color string should be #000000 rather than #000

• Support windows arm64

• Basic support for direction

• Support Lottie API

What's Changed

• Add GIF encoding support

• Add fontStretch and fontKerning support

What's Changed

• Add variable font support

• Chrome m143

What's Changed

• PDFDocument support

• Add PDF annotation APIs using SkAnnotation.h for interactive links and navigation

• Add Uint16Array and Float32Array support to ImageData constructor

What's Changed

• Upgrade to chrome/142

What's Changed

• DOMMatrix.invertSelf() to return self for non-invertible matrices per DOM spec

• Prevent segfault when creating patterns from canvases

What's Changed

• Canvas pattern live reference issue causing incorrect rendering

• Chrome m140

What's Changed

• Return early if setLineDash param is invalid

What's Changed

• Data URL handling for non-image MIME types (resolves #1088)

• Implement toBlob method with HTML Canvas standard compliance for issue #1087

What's Changed

• Upgrade to NAPI-RS 3.0.0-beta.11

• Ref was deprecated in NAPI-RS

• Hsl color parsing

What's Changed

• Wrong data pointer to ImageData in Electron env

What's Changed

• Use this library with webpack

• putImageData doesn't work on Electron environment

What's Changed

• Chrome m137

• Upgrade to NAPI-RS beta

• Upgrade cssparser

• Wrong shadow alpha calculation

• Memory leak in createPattern

• Shadow clipping beyond canvas bounds

• Chrome m138

What's Changed

• Expose SkCornerPathEffect as round() fn on Path2D

• Resize svg from file path render an empty image

What's Changed

• Memory leak when creating bitmap from svg

• Accept non-string param as text

• Chrome m136

What's Changed

• Don't panic if current ts is not able to invert when transform

• Draw canvas on canvas clip

• Bitmap::from_image_data width and height

• Decode avif Image with libavif

• Create pattern from Canvas

• Make sure registered font Buffer is valid

• Memory leak in some blend mode

• BlendMode::Plus should be mapped to "plus" globalCompositeOperation

What's Changed

• Double free in putImageData

• Support encode stream

• chrome/m133

• armv7 glibc version

• Avoid memcpy while drawing canvas on canvas

• Flush svg stream after write end

What's Changed

• loadImage should handle file URL