Skip to content

Commit 7daf8cb

Browse files
committed
docs(release-notes): Move Performance Theater section from Hero Story 2 to Hero Story 1 (#9341)
1 parent 1f34bc2 commit 7daf8cb

1 file changed

Lines changed: 4 additions & 4 deletions

File tree

resources/content/release-notes/v12.0.0.md

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -110,11 +110,14 @@ sequenceDiagram
110110
Store-->>Grid: Fire 'load' event
111111
```
112112

113+
4. **Performance Theater: The "Show Off" Effect:**
114+
* To prove the Main Thread is completely unblocked by the Grid's layout during a scroll, the DevIndex app intentionally **doubles the animation speed** of the complex 3D Luminous Flux header when you scroll. The Canvas worker smoothly accelerates the physics `timeScale` while the grid scrolls underneath it, proving visually that heavy canvas operations cannot block the App Worker's scrolling logic.
115+
113116
---
114117

115118
## 🏎️ Hero Story 2: Grid Supremacy (The Ultimate Flex)
116119

117-
The DevIndex UI is a torture test. It renders live, animated data charts ("Living Sparklines") inside every single row of a 50k-record grid, alongside complex icon components and country flags, while a 3D particle simulation ("Luminous Flux") runs in the header.
120+
The DevIndex UI is a torture test. It renders live, animated data charts ("Living Sparklines") inside every single row of a 50k-record grid, alongside complex icon components and country flags.
118121

119122
**The Challenge:** High-frequency scrolling a 50k-row grid causes severe DOM thrashing in traditional architectures. Previously, `Neo.grid.Body` acted as a monolithic renderer. While we had component-based columns before, they manually created and destroyed instances for the mounted row range, relying on expensive `moveNode` operations as rows cycled. The Main Thread simply cannot calculate virtualized DOM node insertions, removals, or reorders *while* executing heavy physics for 50+ canvas animations without dropping frames.
120123

@@ -167,9 +170,6 @@ flowchart TD
167170
* To maintain a strict 16ms frame budget (60fps) without Garbage Collection (GC) stutters, the physics engine uses a **Zero-Allocation** strategy (cached geometry, pre-allocated `CanvasGradient` objects).
168171
* To prevent GPU overload, it uses a **"Sparse Animation Strategy"**. A single master loop randomly selects *one* chart to pulse with a "Data Packet" every few seconds. This creates the visual impression of a highly active, living system ("The Server Room Effect") while keeping actual GPU load equivalent to rendering just a single chart.
169172

170-
6. **Performance Theater: The "Show Off" Effect:**
171-
* To prove the Main Thread is completely unblocked by the Grid's layout during a scroll, we intentionally **double the animation speed** of the complex 3D Luminous Flux header when you scroll. The Canvas worker smoothly accelerates the physics `timeScale` while the grid scrolls underneath it, proving visually that heavy canvas operations cannot block the App Worker's scrolling logic.
172-
173173
**The Best Part: Zero Migration Effort**
174174
Despite being a fundamental, ground-up rewrite of the framework's most complex component, the new Grid is a **100% drop-in replacement**. All your existing grid configurations, custom cell renderers, and stores will work out of the box with massively upgraded performance.
175175

0 commit comments

Comments
 (0)