mirror of
https://github.com/Matysh/houseplan-card
synced 2026-10-02 12:49:56 +00:00
perf(stairs): draw all treads of a stair as one path (#740)
A floor with stairs pays for them on every switch to it: the stair layer is emptied on other floors, so Lit recreates every symbol on each return and the browser lays out and paints it again. With 250 stairs (the large-house fixture, the per-floor limit) that was 2,875 SVG elements and about 40 ms per entry locally; each stair carried 3-7 separate tread lines with four bound coordinates each. The treads of one stair are now a single <path class="hp-stair-tread"> with one `M a L b` subpath per tread, in geometry order and with the numbers the lines carried. Treads of one stair never overlap (straight: parallel, >= 20 cm apart; spiral: inner ends >= 6.7 cm apart at the 3.6 cm stroke), so the path paints the same pixels at any opacity. The outline points and the tread data are built once per cached geometry object (cachedStairMarkup, weak keys), not on every render. The View and plan-editor layers share the strings; outline, hit polygon, trapezoid, arrow, attributes and handlers are unchanged. Floor 1 of the fixture drops from 4,210 to 2,960 elements. Witnesses: the unit test for the path data and its cache, and the smoke_stairs markup checks in View and in the plan editor, are red on dev. The stairs-view-tread-lines mutant restores the View lines. Issue: #740 User-Visible: no Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_018qZfe7YS4rqEMKoVeS3GKd
This commit is contained in:
@@ -119,6 +119,18 @@ const MUTANT_DEFINITIONS = [
|
||||
replace: ' if (!active\n',
|
||||
}],
|
||||
},
|
||||
{
|
||||
id: 'stairs-view-tread-lines',
|
||||
guard: 'node demo/smoke_stairs.mjs',
|
||||
because: '#740 AC2: all treads of one stair are a single path; separate tread lines bring '
|
||||
+ 'back 3–7 DOM elements per stair that every floor switch rebuilds.',
|
||||
patches: [{
|
||||
file: 'src/stairs-view.ts',
|
||||
find: ' ${markup.treads ? svg`<path class="hp-stair-tread" d=${markup.treads}></path>` : nothing}\n',
|
||||
replace: ' ${geometry.treads.map((line) => svg`<line class="hp-stair-tread"\n'
|
||||
+ ' x1=${line.a[0]} y1=${line.a[1]} x2=${line.b[0]} y2=${line.b[1]}></line>`)}\n',
|
||||
}],
|
||||
},
|
||||
{
|
||||
id: 'stairs-fixed-floor-still-navigates',
|
||||
guard: 'node demo/smoke_stairs.mjs',
|
||||
|
||||
@@ -599,6 +599,14 @@ export const SMOKE_LINKS = [
|
||||
+ 'isometric smoke inspects door/window/gate bases from the same helper, but neither '
|
||||
+ 'browser bundle exposes the helper name in its test steps',
|
||||
},
|
||||
{
|
||||
symbols: ['cachedStairMarkup', 'stairTreadPath', 'StairMarkup'],
|
||||
smokes: ['smoke_stairs.mjs'],
|
||||
because: '#740: the strings of the stair symbol are observed only as the production markup of '
|
||||
+ 'the View and plan-editor layers — one `path.hp-stair-tread` whose `M` subpaths count the '
|
||||
+ 'physical treads, the outline and hit polygons, navigation and the editor gestures on them; '
|
||||
+ 'no smoke names the helpers',
|
||||
},
|
||||
{
|
||||
// #234: единый резолвер толщины отрезка цепочки. Смок перехода между
|
||||
// толщинами не называет ни `chainSegmentCms`, ни `_wallChainSegmentCms` — он
|
||||
|
||||
Reference in New Issue
Block a user