Skip to content

Developer mode

Developer mode makes the diff pipeline transparent. When it is on, every compared page in the diff view gains a Pipeline button that opens the intermediate artifacts for both screenshots.

Go to WP Diff → Settings → Developer settings. There are two independent switches:

  • Diff pipeline stages shows the scanner’s internals: the next diff you open is computed with debug output and each compared page gains a Pipeline panel.
  • Client debug info shows what the WordPress client sends with each scan: the page inventory broken down by post type (including custom post types and archives), the paused motion libraries, and the ignore selectors. It appears as a strip above the timeline when you start a scan.

Turning either off returns the UI to normal.

For the baseline and the current screenshot side by side:

  1. Feature detection: the raw feature mask, Harris corners combined with Canny edges. White pixels are the parts of the grayscale screenshot the diff watches.
  2. Dilation: the feature mask after dilation, showing how features merged into connected blobs.
  3. Regions and matching: the screenshot with every region of interest drawn in blue and every unmatched region drawn in red.

Above the images you get the run parameters: the dilation kernel size the segmentation settled on, the region count, and the number of unmatched regions.

Below them, a table lists every unmatched region with:

  • its bounding box (x, y, width, height)
  • its grey score, the best normalised correlation found near its old position
  • its colour delta, the largest per channel mean difference at the matched location

A region is flagged when the grey score falls below the structural threshold, or when the score is fine but the colour delta is above the colour threshold. The thresholds in force are shown at the top of the panel.

  • A flagged region with a grey score near zero usually means added or removed content.
  • A grey score just under the threshold on many regions suggests a global rendering difference, for example font hinting after a browser update.
  • A high grey score with a high colour delta is a colour only change, such as a button changing hue without moving.

Debug diffs write extra images per page and skip the normal diff cache, so they are slower and use more disk. Leave developer mode off day to day.