38 lines
1.6 KiB
Markdown
38 lines
1.6 KiB
Markdown
# DataTable Performance Tracking
|
|
|
|
## v1: Minimal Foundation
|
|
- **Data**: 10,000 items, 1 column.
|
|
- **Scroll Test**: 100 scrolls (20,000px total).
|
|
- **Results**:
|
|
- refreshCount: 101
|
|
- refreshTime (total): ~45.7ms
|
|
- averageRefreshTime: **0.45ms**
|
|
- totalNodes: 3030 (avg 30/frame)
|
|
- **Notes**: Silk smooth, base VirtualScroll works perfectly.
|
|
|
|
## v4: Optimized Responsiveness (Immediate Refresh)
|
|
- **Data**: 10,000 items, 10 columns.
|
|
- **Scroll Test**: 100 scrolls (20,000px total).
|
|
- **Results**:
|
|
- refreshCount: 101
|
|
- refreshTime (total): ~101.2ms
|
|
- averageRefreshTime: **1.01ms**
|
|
- totalNodes: 3030
|
|
- **Notes**: Removed `.dt-body` wrapper to simplify DOM depth. Changed `onScroll` to execute `container.refresh()` immediately instead of wrapping it in `requestAnimationFrame`.
|
|
|
|
## v5: Zero-Scan Extreme Performance
|
|
- **Data**: 10,000 items, 10 columns.
|
|
- **Scroll Test**: 100 scrolls (20,000px total).
|
|
- **Results**:
|
|
- refreshCount: 101
|
|
- refreshTime (total): ~100-120ms
|
|
- averageRefreshTime: **1.0ms - 1.2ms**
|
|
- totalNodes: 6060 (avg 60/frame)
|
|
- **scanCount (per frame)**: **0** (Achieved Zero-Scan status)
|
|
- **moveCount (per frame)**: 60 (Exact match for row count)
|
|
- **Notes**:
|
|
- Optimized framework `dom.js` to avoid redundant sub-tree scans during identity-based node reuse.
|
|
- Doubled the virtual buffer (from 3x to 5x) to eliminate fast-scroll "white areas".
|
|
- Switched from CSS Grid to Flexbox for lower layout overhead.
|
|
- The performance is now physically limited only by the browser's ability to move 60 DIVs per frame, with zero JS binding work during scrolling.
|