Skip to content

feat(canvas): headless Editor for non-browser testing #630

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
softmarshmallow merged 3 commits into from
Apr 6, 2026
Merged

feat(canvas): headless Editor for non-browser testing #630

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
29b68c7
feat(canvas): add headless Editor for non-browser testing
softmarshmallow Apr 6, 2026
c5413e5
docs
softmarshmallow Apr 6, 2026
7be6e53
docs(canvas): add LOD property catalog and Skia cost probes (#631)
softmarshmallow Apr 6, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
32 changes: 16 additions & 16 deletions .agents/skills/cg-perf/SKILL.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -123,19 +123,19 @@ reports `min/p50/p95/p99/MAX` plus per-stage breakdown and settle cost.

**Scenario types in the expanded matrix:**

| Kind | Scenarios | What it tests |
| ----------------- | --------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------ |
| `pan` | slow/fast × fit/zoomed | Linear back-and-forth panning |
| `circle_pan` | small/large radius × fit/zoomed | Circular trackpad gesture (unpredictable edges) |
| `zigzag` | fast (continuous) / slow (with pauses) × fit/zoomed | Diagonal reading pattern with direction changes |
| `zoom` | slow/fast × around-fit/high | Zoom oscillation at different levels |
| `pan_with_settle` | slow/fast × fit/zoomed | Pan with settle frames interleaved every 12 frames |
| `zoom_with_settle`| slow/fast × fit/high | Zoom with settle frames interleaved every 12 frames — captures cache-cold spike after settle nukes zoom cache |
| `zoom_forced_stable` | slow/fast × fit/high (BUG prefix) | Forces `stable=true` on every zoom frame — reproduces the `redraw()` bug for A/B comparison |
| `realtime` | fast/slow × fit/zoomed | **Real-time event loop simulation** with sleep, 240Hz tick thread, and settle countdown matching the native viewer |
| `frameloop` | 16/50/80/120/200/300/500ms interval | **Real FrameLoop path** — the only bench that captures stable-frame jank during panning (see below) |
| `frameloop_zoom` | 16/50/80/120/200/500ms interval | **Real FrameLoop path for zoom** — captures stable-frame intrusion during zoom gestures |
| `resize` | alternating viewport sizes | `--resize` flag. Measures `resize()` + `redraw()` cost per cycle (layout rebuild + cache invalidation + repaint) |
| Kind | Scenarios | What it tests |
| -------------------- | --------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------ |
| `pan` | slow/fast × fit/zoomed | Linear back-and-forth panning |
| `circle_pan` | small/large radius × fit/zoomed | Circular trackpad gesture (unpredictable edges) |
| `zigzag` | fast (continuous) / slow (with pauses) × fit/zoomed | Diagonal reading pattern with direction changes |
| `zoom` | slow/fast × around-fit/high | Zoom oscillation at different levels |
| `pan_with_settle` | slow/fast × fit/zoomed | Pan with settle frames interleaved every 12 frames |
| `zoom_with_settle` | slow/fast × fit/high | Zoom with settle frames interleaved every 12 frames — captures cache-cold spike after settle nukes zoom cache |
| `zoom_forced_stable` | slow/fast × fit/high (BUG prefix) | Forces `stable=true` on every zoom frame — reproduces the `redraw()` bug for A/B comparison |
| `realtime` | fast/slow × fit/zoomed | **Real-time event loop simulation** with sleep, 240Hz tick thread, and settle countdown matching the native viewer |
| `frameloop` | 16/50/80/120/200/300/500ms interval | **Real FrameLoop path** — the only bench that captures stable-frame jank during panning (see below) |
| `frameloop_zoom` | 16/50/80/120/200/500ms interval | **Real FrameLoop path for zoom** — captures stable-frame intrusion during zoom gestures |
| `resize` | alternating viewport sizes | `--resize` flag. Measures `resize()` + `redraw()` cost per cycle (layout rebuild + cache invalidation + repaint) |

**SurfaceUI overlay measurement (`--overlay`):**

Expand All @@ -157,7 +157,7 @@ cargo run -p grida-dev --release -- bench-report ./fixtures/ --frames 100 --over
The overlay cost is opt-in because it is a devtools feature, not user
content. Overlay cost scales with visible labeled nodes — viewport
culling skips off-screen labels, so zoomed-in views are nearly free.
At fit-zoom on large scenes (yrr-main, 437 labels visible), overlay
At fit-zoom on large scenes (e.g. 500 labels visible), overlay
adds ~1.8ms per frame (paragraph layout dominates). At typical editing
zoom, the cost drops to ~190µs or less.

Expand Down Expand Up @@ -552,7 +552,7 @@ after content `flush()` and requires a second GPU flush. The overlay
cost is dominated by Skia paragraph creation (one per visible label) —
viewport culling skips off-screen labels, and style objects are hoisted
out of the per-label loop. On scenes with many labeled nodes at
fit-zoom (e.g. yrr-main with 437 labels), the overlay adds ~1.8ms per
fit-zoom (e.g. 500 visible labels), the overlay adds ~1.8ms per
frame. At typical editing zoom, most labels are culled and cost drops
to ~190µs. Standard benchmarks exclude overlay by default — use
`--overlay` to include it. If the app feels slower after adding new
Expand Down Expand Up @@ -627,7 +627,7 @@ WASM-on-Node benchmark:
# Build WASM first
just --justfile crates/grida-canvas-wasm/justfile build

# Run benchmark (requires fixtures/local/perf/local/yrr-main.grida for 136k test)
# Run benchmark (requires a large .grida fixture in fixtures/local/perf/local/)
cd crates/grida-canvas-wasm && npx vitest run __test__/bench-load-scene.test.ts
```

Expand Down
10 changes: 10 additions & 0 deletions crates/grida-canvas/Cargo.toml
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -117,6 +117,16 @@ name = "skia_bench_primitives"
path = "examples/skia_bench/skia_bench_primitives.rs"
required-features = ["native-gl-context"]

[[example]]
name = "skia_bench_rrect_vs_rect"
path = "examples/skia_bench/skia_bench_rrect_vs_rect.rs"
required-features = ["native-gl-context"]

[[example]]
name = "skia_bench_text_lod"
path = "examples/skia_bench/skia_bench_text_lod.rs"
required-features = ["native-gl-context"]

[[example]]
name = "skia_bench_effects"
path = "examples/skia_bench/skia_bench_effects.rs"
Expand Down
Loading
Loading