# Before and after

Two pages, live, next to each other, right now. No capture step, no artifacts, nothing to go stale.

**STATIC AND DYNAMIC ARE BOTH REAL, AND NEITHER SUBSTITUTES.** `[MARK]` 2026-09-09. This is the dynamic
one. SideBySide compose is the static one. Framing this as "daily versus crossing" was wrong: the axis is
what the artifact IS.

| | **STATIC** — SideBySide compose | **DYNAMIC** — this file |
|---|---|---|
| what it is | PNG pair-shots, frozen at a moment | two live pages in two panes |
| current? | as of capture, and it ages from there | as of this second, reload and it moves |
| interactive? | no. A picture cannot open a menu | yes. Scroll, click, hover, open the phone nav |
| survives the source? | **yes** — the only record once a site is redeployed or gone | no. If the host changes, the panes change |
| diffable by machine? | **yes** — pixel diff, band metrics, an answer key | no |
| sendable? | **yes** — a folder or a link a person reviews on their own time | no. It is a thing you sit at |
| needs the host to allow framing? | no | **yes**, and some correctly refuse |
| costs | a capture run per side, and it goes stale | nothing, and there is nothing to archive |

**Use STATIC when the answer must outlive the moment**: evidence in a done-pack, proof a client's site looked
a certain way before a change, an answer key an agent fills band by band, anything a machine must diff,
anything sent to a person to review later. **John cannot be handed an iframe.**

**Use DYNAMIC when you need the truth right now**: after a deploy, while fixing a page, checking a phone
menu actually opens, or walking a boat before signing line 6. A screenshot cannot tell you whether the
hamburger works, and a static board captured yesterday cannot tell you what you shipped an hour ago.

**The trap is using one where the other belongs.** A pixel diff of a page that has since been redeployed is
archaeology. A live pane offered as proof is a claim with no artifact behind it — it cannot be checked
tomorrow, because tomorrow it shows something else.

## Who you are while you run it

You are opening a door, not writing a verdict. Your job ends when the two pages are on one screen and the
person can see them. **You are not the reviewer, and neither is any agent**: this instrument exists because
`[MARK]` 2026-09-04 measured one tenant's new build as PASSED on every grader while it carried 128 major visual
differences. Every grader was green because no grader has eyes.

## Run it

```
python3 projects/tracker/sidebyside.py
```

Writes `beargrassai/SIDEBYSIDE.html` and opens it. Linked from the top of `TRACKER.html` and from every site
page, because a board that is generated and never opened is not a review — `[MARK]` 2026-09-09: "what I find
infuriating is that the sidebyside isn't opened up regularly for me."

`j` / `k` step through pages · `1`-`5` nothing, this is not the diff tool · `Desktop` / `Phone` set both
panes · `r` reloads both · the slug box takes a path directly.

## What it measures, so nothing is typed

- **Routes** come from the v2 repo's own `.html` files. A page in the build cannot be missing from the
  review, and a deleted one cannot linger in it.
- **Sources** come from `projects/tracker/FLEET.csv` — every generation a boat actually has: LIVE, V0, V1, V2.
- **Framing** is probed per host. A host that sends `X-Frame-Options` or `frame-ancestors` cannot be put in
  a panel; the pane says so and offers a tab. **A silently blank panel is the worst lie this tool could
  tell**, because it reads as "the build is broken" when the host simply declined.

## The person picks both panes. Never choose for them.

`[MARK]` 2026-09-09: "how do I decide which is the before and which is the after?" The first cut chose with
a rule and the rule was wrong twice over, because these are DIFFERENT QUESTIONS:

- *Does v2 match our v1?* → V1 left, V2 right. The parity question.
- *Is the new site better than what a visitor sees today?* → LIVE left, V2 right. The go-live question, and
  the only meaningful one where the live site is a client's WordPress or Wix.

Defaults open the likelier one. Both panes are dropdowns and the person overrides.

## Review mirrors

A live site may rightly refuse to be framed. Some send `X-Frame-Options: DENY`, which is correct
clickjacking protection and is **not weakened for our convenience**.

**Never redeploy a live project to relax a header.** Measured 2026-09-09 on one tenant: nothing on disk
reproduced the live bytes, because the deployment was three months old. Editing `_headers` and redeploying
would have shipped different CONTENT to a live client site in order to fix a header. Check that a local
build matches live BEFORE you plan a deploy, not after.

Instead publish the dated freeze to its own project: no custom domain, `noindex`, no framing headers, an
`_headers` comment saying why it exists, and never the site of record. The mirror is a source in
`projects/tracker/FLEET.csv` like any other, so nothing here needs to name a host.

**A freeze is trustworthy when it reproduces the site's DEFECTS.** On that tenant the frozen page for one
deep route is byte-identical to the home page — the live routing bug, captured faithfully. A freeze that
looked tidy would have been re-rendered and worth nothing.

## Done when

The person has looked. That is the entire gate, and it is why line 6 of a done-pack is a file only Mark
writes. **Do not sign `spim-qa/packs/<site>.looked` on anyone's behalf.**

## Temptations (refuse these)

- Reviewing from screenshots when both pages are live and one keystroke apart
- Choosing the before source with a rule instead of a dropdown
- Redeploying a live site to make it framable
- Calling this Spot the diff. Spot the diff is the agent's band-by-band answer key on a crossing
- Offering a live pane as EVIDENCE. It cannot be checked tomorrow, because tomorrow it shows something else
- Reaching for a static board to answer a question about what is deployed right now
- Reporting that a boat was reviewed because the file was generated