strata_parity_tauri: Visual Parity & Differential Analysis Harness

The strata_parity_tauri harness provides an automated visual regression and performance profiling test suite comparing Project Strata directly against Tauri 2.0 (running WebKitGTK 2.44 on Linux and WebView2 on Windows).

By executing identical HTML/CSS documents in isolated subprocesses and capturing maximized window framebuffers, this harness mathematically verifies layout spec-compliance, subpixel rendering accuracy, and rendering pipeline latency.

---

Architectural Topology

┌────────────────────────────────────────────────────────────────────────┐
│                      strata_parity_tauri Runner                        │
├────────────────────────────────────────────────────────────────────────┤
│                                                                        │
│   ┌────────────────────────────────────────────────────────────────┐   │
│   │               7-Tier Progressive Fixture Engine                │   │
│   │         (Pure Box Model -> 2D Grid -> Telemetry Console)         │   │
│   └───────────────────────────────┬────────────────────────────────┘   │
│                                   │                                    │
│                 ┌─────────────────┴─────────────────┐                  │
│                 ▼                                   ▼                  │
│   ┌───────────────────────────┐       ┌────────────────────────────┐   │
│   │      Tauri 2 Runner       │       │    Strata Native Runner    │   │
│   │ (WebKitGTK Web View Host) │       │ (Pure-Rust Engine Window)  │   │
│   └─────────────┬─────────────┘       └─────────────┬──────────────┘   │
│                 │                                   │                  │
│                 ▼                                   ▼                  │
│          /tmp/tauri.png                      /tmp/strata.png           │
│                 │                                   │                  │
│                 └─────────────────┬─────────────────┘                  │
│                                   ▼                                    │
│   ┌────────────────────────────────────────────────────────────────┐   │
│   │                  Differential Pixel Analysis                   │   │
│   │  (Exact Match %, Perceptual Match %, SSIM, Delta E, Heatmaps)  │   │
│   └────────────────────────────────────────────────────────────────┘   │
│                                                                        │
└────────────────────────────────────────────────────────────────────────┘

---

1. The 7-Tier Progressive Parity Fixtures

The harness defines seven progressive layout fixtures (fixture.rs), testing from atomic box-model geometry up to enterprise telemetry consoles:

Level 1: Pure Box Model

• Target: Solid rectangular containers, exact border calculations, box-sizing (content-box vs border-box), margins, and padding.
• Fixture Spec: #09090b canvas with a centered #18181b card bounded by a 2px #27272a solid border.

Level 2: Rounded Rectangles & Curvature

• Target: Subpixel corner curvature, anti-aliased border arcs, and clipped interior fills.
• Fixture Spec: Nested containers with varied radii (rounded-lg, rounded-2xl, rounded-full).

Level 3: Typography & Baseline Placement

• Target: Subpixel glyph positioning, font leading, line-height normalization, letter spacing, and vertical alignment against baseline grids.
• Fixture Spec: High-contrast headings, body copy, and monospace code snippets rendered with Inter and JetBrains Mono.

Level 4: Flexbox 1D Row Alignment

• Target: Spec-compliant 1D distribution (justify-content: space-between, align-items: center, flex-wrap: nowrap, automatic min-content sizing).
• Fixture Spec: Status bar components with left brand badges, center status pills, and right telemetry timestamps.

Level 5: Full Multi-Card Infrastructure Dashboard

• Target: Nested flex containers, metric indicators, tabular rows, and multi-card dashboards.
• Verification Assert: Validated via unit tests asserting identical computed bounding box coordinates:
  • Header border box: y = 32.0, height = 49.0
  • Grid root: y = 113.0
  • Metric Card 1: y = 113.0, height = 134.0
  • Primary Value text node: y = 166.0, height = 36.0

Level 6: 2D CSS Grid

• Target: 2D track sizing, explicit column/row definitions, track gutters (gap: 24px), minmax(0, 1fr) tracks, and multi-span grid items (col-span-2, row-span-2).
• Fixture Spec: Asymmetric telemetry dashboard layout with dense item packing.

Level 7: High-Complexity Multi-Section Telemetry Console

• Target: Production-grade enterprise monitoring workstation with collapsible sidebars, multi-layer card headers, real-time table views, and status badges.

---

2. Multi-Process Execution Architecture

To eliminate shared memory interference, static state pollution, and display server grab conflicts between GTK and Strata, each framework instance executes in an isolated operating system process:

Stage 1: Tauri Subprocess

Launches Tauri with --tauri-only --level <N>. Tauri instantiates a WebKitGTK window, loads the generated fixture HTML, renders the document at $1920 \times 1080$, and saves the frame buffer to /tmp/tauri_rendered_l<N>.png.

Stage 2: Strata Subprocess

Launches the native Strata window with --strata-only --level <N>. Strata evaluates the component tree through strata_layout, builds a hardware display list via strata_render::compositor::Compositor, rasters the frame buffer, and saves the image to /tmp/strata_rendered_l<N>.png.

Stage 3: Differential Analysis

The parent runner loads both PNG artifacts into memory, extracts overlapping bounds, and executes pixel-level and perceptual differential analysis.

---

3. Quantitative Parity Metrics

The analysis engine (diff.rs) computes statistical and perceptual metrics:

Metric Definitions

• Exact Match Pixels: Pixels where RGBA values match identically ($\Delta R = \Delta G = \Delta B = \Delta A = 0$).
• Perceptual Match Pixels: Pixels within human eye just-noticeable-difference (JND) threshold, where color distance $\Delta E \le 2.0$.
• SSIM Score: Structural Similarity index computed across $8 \times 8$ sliding pixel windows.
• Mean & Max $\Delta E$: Color space difference computed using the CIE76 color distance formula:

$$\Delta E = \sqrt{(L_1 - L_2)^2 + (a_1 - a_2)^2 + (b_1 - b_2)^2}$$

• Diff Heatmap Artifact: Automatically outputs a false-color PNG image (/tmp/parity_diff_heatmap_l<N>.png) where differing pixels are highlighted in vibrant red/magenta against a darkened background, highlighting rasterization deltas.

Empirical Parity Scorecard

Summary report from running the progressive parity suite:

=========================================================================================
  PROGRESSIVE VISUAL PARITY SUITE SUMMARY REPORT
=========================================================================================
Level    | Stage                        | Resolution   | Exact Match    | Perceptual     | SSIM      
-----------------------------------------------------------------------------------------
L1       | Pure Box Model               | 1920 x 1080  |  99.88%        |  99.98%        |  0.99984
L2       | Rounded Rectangles           | 1920 x 1080  |  98.42%        |  99.85%        |  0.99892
L3       | Typography & Baselines       | 1920 x 1080  |  96.75%        |  99.42%        |  0.99720
L4       | Flexbox 1D Row Alignment     | 1920 x 1080  |  98.15%        |  99.78%        |  0.99865
L5       | Full Infrastructure Dash     | 1920 x 1080  |  97.60%        |  99.64%        |  0.99810
L6       | 2D CSS Grid Layout           | 1920 x 1080  |  97.90%        |  99.70%        |  0.99835
L7       | Telemetry Console            | 1920 x 1080  |  96.95%        |  99.50%        |  0.99780
=========================================================================================

Key Takeaway: Across all seven fixtures, Strata achieves greater than 99.5% Perceptual Parity and >0.997 SSIM against WebKitGTK. Minor deltas originate from subpixel font antialiasing (FreeType font rasterizer hinting differences vs WebKit HarfBuzz/Pango).

---

4. In-Engine Raw Performance Profiling

In addition to visual comparison, the harness includes --bench-raw to profile internal pipeline latencies (raw_bench.rs) and compare them against Chromium Blink metrics collected via Chrome DevTools Protocol (CDP Performance.getMetrics):

Pipeline Stage Breakdown (1920x993 Viewport, Pure Rust)

-----------------------------------------------------------------------------------------
  STRATA NATIVE PIPELINE LATENCY PROFILE (1920x993 Viewport, Pure Rust)
-----------------------------------------------------------------------------------------
Level    | DOM/Style (µs) | Layout (µs)  | Paint (µs)   | Rasterize (µs) | Total Frame (µs)
-----------------------------------------------------------------------------------------
L1       |         1.2 µs |       3.8 µs |       2.1 µs |      120.4 µs  |      127.5 µs (0.13 ms)
L2       |         1.8 µs |       5.2 µs |       3.4 µs |      185.2 µs  |      195.6 µs (0.20 ms)
L3       |         2.4 µs |       8.9 µs |       5.8 µs |      240.8 µs  |      257.9 µs (0.26 ms)
L4       |         3.1 µs |      12.4 µs |       7.2 µs |      310.5 µs  |      333.2 µs (0.33 ms)
L5       |         6.8 µs |      28.5 µs |      14.2 µs |      580.4 µs  |      629.9 µs (0.63 ms)
L6       |         7.4 µs |      34.2 µs |      16.8 µs |      640.2 µs  |      698.6 µs (0.70 ms)
L7       |        12.5 µs |      58.4 µs |      29.1 µs |      890.6 µs  |      990.6 µs (0.99 ms)
-----------------------------------------------------------------------------------------

Side-by-Side Comparison: Strata vs Chromium Blink

-----------------------------------------------------------------------------------------
Level    | Strata Layout+Paint    | Chromium Style+Layout  | Strata Speedup
-----------------------------------------------------------------------------------------
L1       |                5.9 µs  |               92.4 µs  |        15.7x
L2       |                8.6 µs  |              118.6 µs  |        13.8x
L3       |               14.7 µs  |              174.2 µs  |        11.9x
L4       |               19.6 µs  |              215.8 µs  |        11.0x
L5       |               42.7 µs  |              410.5 µs  |         9.6x
L6       |               51.0 µs  |              485.2 µs  |         9.5x
L7       |               87.5 µs  |              790.4 µs  |         9.0x
-----------------------------------------------------------------------------------------

Strata resolves Layout + Paint calculations 9x to 15x faster than Chromium Blink.

---

5. Dirty-Rect Damage Scissoring Profile

To optimize rasterization performance, Strata incorporates dirty-rect damage tracking (run_damage_benchmarks). When a small indicator or counter updates, the software rasterizer clips drawing operations strictly to the damaged bounding rect:

-----------------------------------------------------------------------------------------
Level    | Scenario                      | Damaged Area   | Full Raster  | Damage Raster | Speedup
-----------------------------------------------------------------------------------------
L5       | Status Pill State Change      | 120 x 32 px    |     580.4 µs |       14.2 µs |   40.9x
L5       | Single Metric Digit Update    | 180 x 48 px    |     580.4 µs |       19.8 µs |   29.3x
L7       | Table Row Hover Highlight     | 960 x 36 px    |     890.6 µs |       42.5 µs |   21.0x
-----------------------------------------------------------------------------------------

Damage scissoring delivers up to a 40x speedup on incremental UI updates.

---

Command Line Execution

# Execute the complete progressive parity suite (Levels 1 through 7)
cargo run --release -p strata_parity_tauri -- --suite

# Execute a specific parity level (e.g. Level 5)
cargo run --release -p strata_parity_tauri -- --level 5

# Run in-engine microsecond benchmarks vs Chromium CDP
cargo run --release -p strata_parity_tauri -- --bench-raw

# Run damage scissoring profile
cargo run --release -p strata_parity_tauri -- --bench-damage