Perf(renderer): LIS minimal-move for keyed-list reorder#216
Conversation
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
🟡 Mixed (mostly slower) for
|
| metric | Improvement |
|---|---|
krausest:swap-rows-20 |
-88% (104ms) 🏆 |
krausest:remove-row-back-100 |
-43% (10ms) 🌟 |
❌ Slower (6)
Metrics where this PR confidently regressed performance compared to main.
| metric | Regression |
|---|---|
krausest:remove-row-middle-20 |
+98% (5ms) 🚨 |
krausest:remove-row-front-20 |
+25% (3ms) ❗ |
todo:filter-cycle-20 |
+13% (32ms) |
todo:remove-50-middle |
+9% (0ms) |
todo:remove-50-back |
+8% (0ms) |
template:stable-ref-mutate-500 |
+7% (1ms) |
🏆 New peaks (1)
These metrics hit a new best on this PR. The most recent candidate is usually the cause.
| metric | improvement | prior peak | likely candidates |
|---|---|---|---|
krausest:remove-row-back-100 |
8% | be1eae7 |
— |
📜 Regressions from peak (1)
These metrics were faster on an earlier push to this PR. The most recent candidate is usually where to look.
| metric | regression | prior peak | likely candidates |
|---|---|---|---|
krausest:remove-row-front-20 |
36% | be1eae7 |
— |
⚪ No Change (24)
Metrics where this PR measured within ±2% of main — no meaningful performance change detected.
🔍 Unsure (17)
Too Fast to Measure Precisely (17)
On benches this short, OS jitter, GC, and JIT pauses drown out anything under 4%. Bigger changes than that still show up.
| metric | Change | Test Time | Expected Noise |
|---|---|---|---|
template:active-indicator-200 |
-2.1% – +1.7% | ~33ms | ±7% |
template:active-indicator-nested-200 |
-1.3% – +3.4% | ~16ms | ±8% |
todo:add-20 |
-0.8% – +2.6% | ~7ms | ±6% |
krausest:append-1k |
-0.1% – +4.8% | ~92ms | ±6% |
renderer-micros:dom-walker-1000x15 |
-2.2% – +0.2% | ~50ms | ±5% |
template:each-mount-1000 |
-0.8% – +2.1% | ~49ms | ±5% |
todo:edit-cycle-5 |
-2.0% – +1.6% | ~62ms | ±5% |
hydrate:helper-100-state-change-1k |
-2.9% – +0.9% | ~3ms | ±9% |
todo:remove-first-100 |
+0.8% – +6.4% | ~14ms | ±8% |
todo:remove-last-100 |
-4.4% – +11.6% | ~11ms | ±20% |
todo:remove-middle-100 |
-1.1% – +4.1% | ~14ms | ±7% |
todo:rename-500 |
+1.5% – +10.4% | ~17ms | ±11% |
template:snippet-in-subtemplate-100x1k |
-1.8% – +2.9% | ~22ms | ±8% |
todo:toggle-100 |
-3.9% – +3.5% | ~7ms | ±9% |
todo:toggle-first-100 |
-4.5% – +2.4% | ~13ms | ±9% |
todo:toggle-last-100 |
-5.2% – +2.6% | ~12ms | ±10% |
krausest:update-10th-50 |
-2.1% – +4.1% | ~34ms | ±8% |
📖 Bench glossary (49 metrics)
| metric | what it tests |
|---|---|
hydrate:each-100 |
Reassigns the items of a hydrated 1000-item list to a fresh array with the same keys and data. |
hydrate:each-100-mount |
Hydrates a server-rendered 1000-item list and waits for it to become interactive without re-rendering. |
hydrate:helper-100-mount |
Hydrates a 1000-item list where each item calls a helper that reads state shared across the list. |
hydrate:helper-100-state-change-1k |
Walks the shared activeID across every item in a hydrated 1000-item list so two items repaint per cycle. |
krausest:append-1k |
Appends 1000 new rows onto an existing 1000-row table. |
krausest:clear-10k |
Clears a 10000-row table back to empty in a single operation. |
krausest:create-10k |
Renders a fresh 10000-row table into an empty parent at ten times the create-1k scale. |
krausest:create-1k |
Renders a fresh 1000-row table into an empty parent. |
krausest:remove-row-back-100 |
Removes the last row 100 times from a 1000-row table, with no other rows needing to move. |
krausest:remove-row-front-20 |
Removes the first row 20 times from a 1000-row table, with all remaining rows sliding up each time. |
krausest:remove-row-middle-20 |
Removes the middle row 20 times from a 1000-row table, with the rows below it sliding up each time. |
krausest:replace-1k |
Replaces 1000 rows with a fresh 1000-row set, diffing the keyed list against a populated table. |
krausest:select-40 |
Highlights one row at a time across 40 rows so only the previous and newly highlighted rows update. |
krausest:swap-rows-20 |
Swaps the second and second-to-last rows in a 1000-row table, repeated 20 times. |
krausest:update-10th-50 |
Updates the label on every tenth row of a 1000-row table, looped 50 times to lift the work above noise. |
renderer-micros:build-html-string-10k |
Builds the HTML string for a realistic card AST 10000 times. Raw assembly throughput. |
renderer-micros:dom-walker-1000x15 |
Runs bindMarkers across a 1000-node card fragment 15 times. TreeWalker pass and binding dispatch. |
renderer-micros:expr-js-10k |
Evaluates one arithmetic expression and one ternary 10000 times each. JS-eval hot path. |
renderer-micros:expr-lisp-50k |
Evaluates one Lisp-style helper call 50000 times. Parse-cache lookup and helper dispatch. |
renderer-micros:expr-simple-100k |
Evaluates one simple identifier and one dotted path 100000 times each. Property-lookup hot path. |
template:active-indicator-200 |
Cycles selectedId across 200 list items. Only the previously and newly active items update their class. |
template:active-indicator-nested-200 |
Cycles currentUrl through 50 leaf urls in a 5×10×4 nav. Only the previously and newly active leaves should update their… |
template:each-mount-1000 |
Mounts a fresh 1000-item each block with five-field items so per-record allocation cost dominates the wall clock. |
template:snippet-args-per-key-100x500 |
Mutates one snippet arg's source across 100 invocations, 500 cycles. Adjacent no-signal expressions stay quiet. |
template:snippet-in-subtemplate-100x1k |
Mutates one subtemplate prop's source across 25 cards each invoking 4 inner snippets, 1000 cycles. Snippet bodies shoul… |
template:stable-ref-mutate-500 |
Replaces one item by index in a 500-item list across 100 cycles. Only that item's expressions re-render. |
template:subtemplate-data-blob-100 |
Mutates one field inside data=expression on 100 children. Every child re-renders by design. |
template:subtemplate-helpers-heavy-100x500 |
100 subtemplates, 4 inner bindings where three call helpers shaped like userland reality — Intl.NumberFormat, Array.fin… |
template:subtemplate-helpers-light-100x500 |
100 subtemplates, 4 inner bindings each calling formatDate / classIf / capitalize, 500 cycles. Mutates one source signa… |
template:subtemplate-reactive-data-100x500 |
Mutates one verbose reactiveData field across 100 child subtemplates, 500 cycles. Only the changed field re-evaluates. |
template:subtemplate-shorthand-props-100x500 |
Mutates one shorthand prop's source across 100 child subtemplates, 500 cycles. Only that prop re-evaluates. |
todo:add-20 |
Appends 20 todo items one at a time, like a user typing entries in a row. |
todo:bulk-add-500 |
Renders 500 todo items added at once from a single data load. |
todo:clear-completed-250 |
Clears 250 completed items from a 500-item list in one action, like clicking clear completed. |
todo:edit-cycle-5 |
Runs 5 full edit-then-save cycles on different items, like editing a row and saving it. |
todo:edit-start-10 |
Enters edit mode on 10 different items in a row, like double-clicking each one. |
todo:filter-cycle-20 |
Cycles through active, completed, and all filters 20 times on a 100-item list. |
todo:remove-50-back |
Deletes 50 items from the end of a 100-item list, one click at a time. |
todo:remove-50-front |
Deletes 50 items from the front of a 100-item list, one click at a time. |
todo:remove-50-middle |
Deletes 50 items from the middle of a 100-item list, one click at a time. |
todo:remove-first-100 |
Deletes the first item 100 times from a 200-item list, with remaining items moving up each time. |
todo:remove-last-100 |
Deletes the last item 100 times from a 200-item list, with no other items needing to move. |
todo:remove-middle-100 |
Deletes the middle item 100 times from a 200-item list, walking halfway through to find each target. |
todo:rename-500 |
Renames items in a 100-item list 500 times via single-field setProperty without editingId co-fires. |
todo:toggle-100 |
Cycles through the first 10 items 10 times each, like a user toggling items repeatedly down a list. |
todo:toggle-all-200 |
Toggles all 100 items completed and back across 200 cycles via the master checkbox. |
todo:toggle-first-100 |
Toggles the first item in a 100-item list 100 times, alternating completed on and off. |
todo:toggle-last-100 |
Toggles the last item in a 100-item list 100 times, alternating completed on and off. |
todo:toggle-middle-100 |
Toggles a middle item in a 100-item list 100 times, alternating completed on and off. |
Sample size: 80 floor / 280 max · Noise floor: ±2% · Timeout: 3min · Wall-clock: 15m46s
All-fresh reconciles (replace, create) carried a full pass over newRecords just to confirm no reordering. Track the fresh-record count in phase 1 and gate the scan on having at least two survivors.
Isolating this change's perf on CI; close after results.