github.com beachballs ~30s on load: CPU Gaussian blur runs per tile on the UI thread (+ hydration, shutdown-abort follow-ups)

[codymullins]

Loading https://github.com in the live GUI shows the macOS spinning wheel for ~30s+. Root-caused on 2026-06-10 (branch feat/js-stack-trampoline) with a UI-thread CPU trace during the stall: the navigation itself completes (first paint at ~4.8s), but show_page(+firstPresent) took 31s and the deferred-phase re-show another 23s. After load, the live loop keeps the process at ~200% CPU.

The trace shows the UI thread spending 20.9s of a 26.3s sample inside SixLabors GaussianBlur, reached via:

WebviewPanel.PresentSurface
-> Compositor.RenderToSurface -> EmitGpuTextureTile
-> ImageSharpBackend.RenderTexture -> ApplyFilterGroup -> ApplyFilterChain
-> GaussianBlur

GitHub's homepage CSS has large blurs on hero glow elements: blur(180px) x2, blur(150px), blur(100px) x2, blur(40-60px) several (site-*.css, home-*.css). The cost is new with the Tier-5 filters/backdrop work — before it, filter: was ignored.

Three multipliers stack:

1. ImageSharpBackend.ApplyFilterGroup (src/Starling.Paint/Backend/ImageSharpBackend.cs:2803) rasterizes the whole padded filter-group bounds into an offscreen Image<Rgba32> (up to 64M px) and blurs it on the CPU. Sigma scales with device scale, so retina doubles the kernel and quadruples the pixels.
2. Compositor.EmitGpuTextureTile (src/Starling.Paint/Compositor/Compositor.cs:422) hands every tile miss the layer's full display list, so the complete group blur re-runs once per 2048x512 tile the blurred layer touches.
3. It all runs synchronously inside ShowPage -> PresentSurface on the UI thread.

Work items

• Cache the filtered-group raster keyed by (group content hash, scale) and slice tiles from it, instead of re-running the full blur per tile. Biggest payoff.
• Clip the filter-group raster to the tile rect inflated by the blur halo (~3 sigma) so per-tile cost is proportional to the tile, not the group.
• Large-sigma blur strategy: downsample -> blur -> upsample for sigma above ~16, and/or move blur to the WebGPU backend so the CPU leaves the filter pipeline.
• GitHub hydration failures (separate from the stall; body content mostly absent): TypeError: Class extends value is not a constructor across bundles (custom-elements path), JS stack overflow in element-registry-*.js, Index was outside the bounds of the array in marketing-essentials-*.js.
• Shutdown abort: quitting the busy GUI dies with SIGABRT (exit 134) in a CoreCLR EbrCollector::EnterCriticalRegion assert during exit finalizers (-[NSApplication terminate:] -> __cxa_finalize_ranges -> managed VSD resolve). .NET 11 preview shutdown path; needs a repro/workaround (e.g. clean managed teardown before exit).

Evidence

• UI-thread dotnet-trace during the stall: 20.9s GaussianBlur inclusive, thread-pool workers pegged ~20s each in ImageSharp parallel convolution; OnScrollChanged 14.8s inclusive (scroll re-blurs).
• Aspire structured logs: first-paint: 4800 ms, show_page ... showPage(+firstPresent)=30999ms, second pass =23038ms.
• Memory note: github-blur-present-stall (Claude Code project memory).

[codymullins]

Progress: the first three work items are implemented on feat/js-stack-trampoline (working tree, not yet committed).

What landed

• filter chains now ride the CompositorLayer (the slice's PushFilter bracket is suppressed at build time, like the root transform) and are folded into the layer content hash. Filtered ::before/::after glows promote too — pseudo-element boxes now get LayerHints (BoxTreeBuilder.AppendPseudoElement was skipping StackingContextResolver), which was the last source of per-tile re-filtering on github.com.
• Compositor.EmitFilteredLayer rasters the padded layer ONCE, applies the chain once, caches the post-filter surface keyed by content+chain+size, and blends it as a single quad. Oversized surfaces (> 64M px or > 8192 px a side) and drop-shadow chains fall back to the legacy bracket path.
• New GpuFilterEngine (WGSL, Silk.NET, shares the blend engine's device/queue): separable Gaussian with a downsample pyramid for large sigmas (sigma capped at 6 per pass), plus the §10.2 color matrices (brightness/contrast/grayscale/sepia/saturate/hue-rotate/invert/opacity), premultiplied-alpha correct, straight-alpha output to match the adopt contract. CPU path gets the same once-per-layer treatment via IPaintBackend.RenderFiltered.

Measured on github.com (live GUI, Aspire harness)

metric	before	after
show_page(+firstPresent)	30,999 ms	2,571 ms
legacy per-tile filter groups (headless render)	many	0

Visual check: new fixture testdata/sites/filters/ renders blur(4/24), grayscale, brightness, hue-rotate, a blur+grayscale chain, and a ::before glow correctly on the GPU surface path. Paint/CSS/Layout/Engine suites green; 4 new tests in FilteredLayerCompositeTests pin the once-per-layer raster + caching behavior.

Remaining from this issue: hydration failures (item 4), shutdown abort (item 5), and backdrop-filter still takes the segmented CPU path (github's backdrop-filter: blur(100px) search dialog) — same GPU engine can serve it as a follow-up.

[codymullins]

backdrop-filter now runs on the GPU too (merged via worktree agent, commits 2c4ae310 + crash fix 3da9bd6c):

• New LayerHint.BackdropFilter promotes backdrop elements. The chain rides the CompositorLayer and the blend stage splits the frame into segments at each backdrop op: snapshot the composited pixels under the element (CopyTextureToTexture), run GpuFilterEngine, draw the filtered patch back, continue. The present path renders backdrop frames into an intermediate scene texture (the swapchain texture cannot be a copy source) and reaches the screen via one full-frame blit.
• One crash on the way: the blit bind group was released while its render pass was still open, which faults wgpu inside RenderPassEncoderEnd (SIGABRT on the second live frame). Fixed by releasing after the pass ends, with a repeat-render regression test on the readback path.
• Verified live on the extended testdata/sites/filters/ fixture: backdrop blur(8px)/blur(24px)/saturate(.15) panels filter exactly the pixels behind them. github.com (which uses backdrop blur on its nav) still presents in ~2.5s.
• Known limitations, documented in code: rectangular paint-back clip (no rounded corners yet), rotated elements filter their device AABB, drop-shadow chains keep the no-effect behavior on GPU paths.