Phase 1

Visual Diff API for release reviews, landing pages, and archived states.

Send two snapshot sources, let Snapshot Site normalize the renders, and get back a third image that highlights what changed. The MVP ships with a single endpoint, a clean diff image, and mismatch metrics teams can plug into QA, launch checks, or monitoring.

1 endpoint
POST /api/v3/compare for before, after, and diff
PNG diff
Shareable image output stored like every other capture
Mismatch %
Fast signal for QA gates and release review workflows
Before
After
Diff
POST /api/v3/compareCompare two live captures or two PNG screenshots, then inspect the diff image and mismatch rate.
Mismatch Pixels
14,382
Mismatch Rate
1.27%
Output
before + after + diff

How the MVP works

The endpoint is intentionally simple: capture or load two states, normalize them into the same canvas, and return a diff image plus stats. That is enough to unlock QA triage, visual approval, and customer-facing release checks.

1

Capture the two states

Use live URLs when you want Snapshot Site to render both pages, or provide existing PNG screenshots when you already have captures in storage.

2

Normalize and compare

The engine aligns both images on the same canvas, then highlights changed pixels in a dedicated diff image with a configurable sensitivity threshold.

3

Use the output in your workflow

Store the three image URLs, surface mismatch percentage in CI, or send the diff link to product, QA, or growth teams for approval.

Sample Request

Minimal compare payload

JSON
{
  "before": {
    "url": "https://snapshot-site.com/pricing",
    "width": 1440,
    "fullSize": true,
    "hideCookie": true
  },
  "after": {
    "url": "https://staging.snapshot-site.com/pricing",
    "width": 1440,
    "fullSize": true,
    "hideCookie": true
  },
  "threshold": 0.1
}
Sample Response

What teams get back

200 OK
{
  "status": "success",
  "message": "Visual diff successfully created!",
  "fetchTime": "2026-03-29T09:30:00.000Z",
  "before": {
    "link": "https://api.prod.ss.snapshot-site.com/screenshots/snapshot-site.com/uuid-1/1.png",
    "width": 1440,
    "height": 3980,
    "source": "https://snapshot-site.com/pricing"
  },
  "after": {
    "link": "https://api.prod.ss.snapshot-site.com/screenshots/staging.snapshot-site.com/uuid-2/2.png",
    "width": 1440,
    "height": 3980,
    "source": "https://staging.snapshot-site.com/pricing"
  },
  "diff": {
    "link": "https://api.prod.ss.snapshot-site.com/screenshots/comparisons/uuid-3/3.png",
    "width": 1440,
    "height": 3980
  },
  "summary": {
    "mismatchPixels": 14382,
    "mismatchPercentage": 1.27,
    "totalPixels": 5731200,
    "sameDimensions": true
  }
}

Three client workflows this unlocks immediately

The first release is already useful because it solves one painful question clearly: what changed between version A and version B?

QA Teams

Release review for staging vs production

A SaaS team compares key pages before every deploy to catch layout shifts, missing components, or regression bugs before customer traffic sees them.

  • Compare production against staging on login, dashboard, pricing, and checkout pages
  • Use mismatch percentage as a gate before sign-off
  • Send the diff image directly into Slack or the release checklist
Growth Teams

Landing page approval before paid traffic

A performance marketing team validates hero copy swaps, pricing card edits, and CTA changes before turning paid campaigns back on.

  • Review ad landing pages visually without manual side-by-side screenshots
  • Catch accidental mobile-first breakage on desktop layouts
  • Keep an audit trail of what changed between launches
Archive & Compliance

Track what changed on a monitored page

A compliance or archive workflow snapshots the same page regularly and uses the diff output to highlight exactly what changed since the previous capture.

  • Detect visual edits even when the DOM changed too much for a raw HTML diff
  • Store before, after, and diff images for later review
  • Focus review time on pages with meaningful visual delta