BlazeDiff vs pixelmatch

@blazediff/core runs the pixelmatch algorithm with the pixelmatch call signature, and it is ~3.2x faster over our 34 fixtures. The WebAssembly build is ~4.3x faster. Switching is a one-line import change.

pixelmatch is the reference pixel diff for JavaScript: a few hundred lines, anti-aliasing detection, and a YIQ color delta. BlazeDiff started as a faster implementation of the same algorithm. It skips identical blocks of pixels before it runs the per-pixel delta, so unchanged areas cost almost nothing.

At a glance

Benchmarks

Decode is excluded for the JavaScript and WebAssembly charts, so they measure the diff kernel only. The charts use pixelmatch 7.2.0.

Switching

The arguments, the options and the return value are the same as pixelmatch 7.x.

// Before
import pixelmatch from "pixelmatch";
// After
import pixelmatch from "@blazediff/core";
 
const diffCount = pixelmatch(img1, img2, diff, width, height, { threshold: 0.1 });

If your images come from files, @blazediff/core-native also decodes them, so the pngjs step goes away:

import { compare } from "@blazediff/core-native";
 
const result = await compare("baseline.png", "current.png", "diff.png", {
  threshold: 0.1,
  antialiasing: true,
});

Python

The PyPI pixelmatch package is a pure Python port by a different author. The blazediff wheel runs the Rust core and decodes the files itself. This chart includes image decode for both sides.

from blazediff import compare
 
result = compare("baseline.png", "current.png", "diff.png", threshold=0.1)

When to keep pixelmatch

• You need the pixelmatch 8.0 features: windowSize noise filtering or ignoreMask.
• You want the smallest possible dependency and diff speed does not matter.
• Your project depends on pixelmatch 8.0 diff counts exactly.

Related

• Pixel comparison in JavaScript
• Pixel comparison in WebAssembly
• @blazediff/core API and Python API
• All benchmarks