removed unneeded md
This commit is contained in:
Michael Freno
@@ -1,301 +0,0 @@
|
||||
# FlexLöve Performance Analysis & Optimization Opportunities
|
||||
|
||||
## Current State: Why FFI Gains Are Marginal
|
||||
|
||||
The current FFI optimizations provide minimal gains because:
|
||||
|
||||
1. **FFI isn't used in hot paths** - The batch calculation function exists but isn't called
|
||||
2. **Colors don't use FFI** - We disabled it due to method requirements
|
||||
3. **Real bottleneck is elsewhere** - Layout algorithm complexity, not memory allocation
|
||||
|
||||
## Actual Performance Bottlenecks (Profiled)
|
||||
|
||||
### 1. Layout Algorithm Complexity - **HIGHEST IMPACT**
|
||||
|
||||
**Problem:** O(n²) complexity in flex layout with wrapping
|
||||
- Iterates children multiple times per layout
|
||||
- Recalculates sizes repeatedly
|
||||
- No caching of computed values
|
||||
|
||||
**Impact:** 60-80% of frame time with 500+ elements
|
||||
|
||||
**Solution:**
|
||||
- Cache computed dimensions per frame
|
||||
- Single-pass layout algorithm
|
||||
- Dirty-flag system to skip unchanged subtrees
|
||||
|
||||
### 2. Table Access Overhead - **HIGH IMPACT**
|
||||
|
||||
**Problem:** Lua table lookups in tight loops
|
||||
```lua
|
||||
for i, child in ipairs(children) do
|
||||
local w = child.width + child.padding.left + child.padding.right
|
||||
local h = child.height + child.padding.top + child.padding.bottom
|
||||
-- Repeated table access: child.margin.left, child.margin.right, etc.
|
||||
end
|
||||
```
|
||||
|
||||
**Impact:** 15-20% of layout time
|
||||
|
||||
**Solution:**
|
||||
- Local variable hoisting
|
||||
- Flatten nested table access
|
||||
- Use numeric indices instead of string keys where possible
|
||||
|
||||
### 3. Function Call Overhead - **MEDIUM IMPACT**
|
||||
|
||||
**Problem:** Method calls in loops
|
||||
```lua
|
||||
for i, child in ipairs(children) do
|
||||
local w = child:getBorderBoxWidth() -- Function call overhead
|
||||
local h = child:getBorderBoxHeight() -- Another function call
|
||||
end
|
||||
```
|
||||
|
||||
**Impact:** 10-15% of layout time
|
||||
|
||||
**Solution:**
|
||||
- Inline critical getters
|
||||
- Direct field access where safe
|
||||
- JIT-friendly code patterns
|
||||
|
||||
### 4. Garbage Collection - **MEDIUM IMPACT**
|
||||
|
||||
**Problem:** Temporary table allocation in loops
|
||||
```lua
|
||||
for i, child in ipairs(children) do
|
||||
positions[i] = { x = x, y = y } -- New table every iteration
|
||||
end
|
||||
```
|
||||
|
||||
**Impact:** 10-20% overhead from GC pauses
|
||||
|
||||
**Solution:**
|
||||
- Reuse tables instead of allocating
|
||||
- Object pooling for frequently created objects
|
||||
- Preallocate arrays with known sizes
|
||||
|
||||
### 5. String Concatenation - **LOW IMPACT**
|
||||
|
||||
**Problem:** String operations in hot paths
|
||||
```lua
|
||||
local id = "layout_" .. elementId .. "_" .. frameCount
|
||||
```
|
||||
|
||||
**Impact:** 5-10% in specific scenarios
|
||||
|
||||
**Solution:**
|
||||
- Cache generated strings
|
||||
- Use string.format sparingly
|
||||
- Avoid string operations in inner loops
|
||||
|
||||
## High-Impact Optimizations (Recommended)
|
||||
|
||||
### Priority 1: Layout Algorithm Optimization
|
||||
|
||||
**Estimated Gain: 40-60% faster layouts**
|
||||
|
||||
```lua
|
||||
-- BEFORE: Multiple passes
|
||||
function LayoutEngine:layoutChildren()
|
||||
-- Pass 1: Calculate sizes
|
||||
for i, child in ipairs(children) do
|
||||
child:calculateSize()
|
||||
end
|
||||
|
||||
-- Pass 2: Position elements
|
||||
for i, child in ipairs(children) do
|
||||
child:calculatePosition()
|
||||
end
|
||||
|
||||
-- Pass 3: Layout recursively
|
||||
for i, child in ipairs(children) do
|
||||
child:layoutChildren()
|
||||
end
|
||||
end
|
||||
|
||||
-- AFTER: Single pass with caching
|
||||
function LayoutEngine:layoutChildren()
|
||||
-- Cache dimensions once
|
||||
local childSizes = {}
|
||||
for i, child in ipairs(children) do
|
||||
childSizes[i] = {
|
||||
width = child._borderBoxWidth or (child.width + child.padding.left + child.padding.right),
|
||||
height = child._borderBoxHeight or (child.height + child.padding.top + child.padding.bottom),
|
||||
}
|
||||
end
|
||||
|
||||
-- Single pass: position and recurse
|
||||
for i, child in ipairs(children) do
|
||||
local size = childSizes[i]
|
||||
child.x = calculateX(size.width)
|
||||
child.y = calculateY(size.height)
|
||||
child:layoutChildren() -- Recurse
|
||||
end
|
||||
end
|
||||
```
|
||||
|
||||
### Priority 2: Local Variable Hoisting
|
||||
|
||||
**Estimated Gain: 15-20% faster**
|
||||
|
||||
```lua
|
||||
-- BEFORE: Repeated table access
|
||||
for i, child in ipairs(children) do
|
||||
local x = parent.x + parent.padding.left + child.margin.left
|
||||
local y = parent.y + parent.padding.top + child.margin.top
|
||||
local w = child.width + child.padding.left + child.padding.right
|
||||
end
|
||||
|
||||
-- AFTER: Hoist to locals
|
||||
local parentX = parent.x
|
||||
local parentY = parent.y
|
||||
local parentPaddingLeft = parent.padding.left
|
||||
local parentPaddingTop = parent.padding.top
|
||||
|
||||
for i, child in ipairs(children) do
|
||||
local childMarginLeft = child.margin.left
|
||||
local childMarginTop = child.margin.top
|
||||
local childPaddingLeft = child.padding.left
|
||||
local childPaddingRight = child.padding.right
|
||||
|
||||
local x = parentX + parentPaddingLeft + childMarginLeft
|
||||
local y = parentY + parentPaddingTop + childMarginTop
|
||||
local w = child.width + childPaddingLeft + childPaddingRight
|
||||
end
|
||||
```
|
||||
|
||||
### Priority 3: Dirty Flag System
|
||||
|
||||
**Estimated Gain: 30-50% fewer layouts**
|
||||
|
||||
```lua
|
||||
-- Add dirty tracking to Element
|
||||
function Element:setProperty(key, value)
|
||||
if self[key] ~= value then
|
||||
self[key] = value
|
||||
self._dirty = true
|
||||
self:invalidateLayout()
|
||||
end
|
||||
end
|
||||
|
||||
function LayoutEngine:layoutChildren()
|
||||
if not self.element._dirty and not self.element._childrenDirty then
|
||||
return -- Skip layout entirely
|
||||
end
|
||||
|
||||
-- ... perform layout ...
|
||||
|
||||
self.element._dirty = false
|
||||
self.element._childrenDirty = false
|
||||
end
|
||||
```
|
||||
|
||||
### Priority 4: Dimension Caching
|
||||
|
||||
**Estimated Gain: 10-15% faster**
|
||||
|
||||
```lua
|
||||
-- Cache computed dimensions
|
||||
function Element:getBorderBoxWidth()
|
||||
if self._borderBoxWidthCache then
|
||||
return self._borderBoxWidthCache
|
||||
end
|
||||
|
||||
self._borderBoxWidthCache = self.width + self.padding.left + self.padding.right
|
||||
return self._borderBoxWidthCache
|
||||
end
|
||||
|
||||
-- Invalidate on property change
|
||||
function Element:setWidth(width)
|
||||
self.width = width
|
||||
self._borderBoxWidthCache = nil -- Invalidate cache
|
||||
self._dirty = true
|
||||
end
|
||||
```
|
||||
|
||||
### Priority 5: Preallocate Arrays
|
||||
|
||||
**Estimated Gain: 5-10% less GC pressure**
|
||||
|
||||
```lua
|
||||
-- BEFORE: Grow array dynamically
|
||||
local positions = {}
|
||||
for i, child in ipairs(children) do
|
||||
positions[i] = { x = x, y = y }
|
||||
end
|
||||
|
||||
-- AFTER: Preallocate
|
||||
local positions = table.create and table.create(#children) or {}
|
||||
for i, child in ipairs(children) do
|
||||
positions[i] = { x = x, y = y }
|
||||
end
|
||||
```
|
||||
|
||||
## FFI Optimizations (Current Implementation)
|
||||
|
||||
**Estimated Gain: 5-10% in specific scenarios**
|
||||
|
||||
Current FFI optimizations help with:
|
||||
- Vec2/Rect pooling for batch operations
|
||||
- Reduced GC pressure for position calculations
|
||||
- Better cache locality for large arrays
|
||||
|
||||
But they're limited because:
|
||||
- Not used in main layout algorithm
|
||||
- Colors can't use FFI (need methods)
|
||||
- Overhead of wrapping/unwrapping FFI objects
|
||||
|
||||
## Recommended Implementation Order
|
||||
|
||||
1. **Dirty Flag System** (1-2 hours) - Biggest bang for buck
|
||||
2. **Local Variable Hoisting** (2-3 hours) - Easy win
|
||||
3. **Dimension Caching** (1-2 hours) - Simple optimization
|
||||
4. **Single-Pass Layout** (4-6 hours) - Complex but high impact
|
||||
5. **Array Preallocation** (1 hour) - Quick win
|
||||
|
||||
**Total Estimated Gain: 2-3x faster layouts**
|
||||
|
||||
## Benchmarking Strategy
|
||||
|
||||
To measure improvements:
|
||||
|
||||
1. **Baseline** - Current implementation
|
||||
2. **After each optimization** - Measure incremental gain
|
||||
3. **Compare scenarios**:
|
||||
- Small UIs (50 elements)
|
||||
- Medium UIs (200 elements)
|
||||
- Large UIs (1000 elements)
|
||||
- Deep nesting (10 levels)
|
||||
- Flat hierarchy (1 level)
|
||||
|
||||
## Why Not More Aggressive FFI?
|
||||
|
||||
**Option: FFI-based layout engine**
|
||||
|
||||
Could implement entire layout algorithm in C via FFI:
|
||||
- 5-10x faster
|
||||
- Much more complex
|
||||
- Harder to maintain
|
||||
- Loses Lua flexibility
|
||||
|
||||
**Verdict:** Not worth it. The optimizations above give 80% of the benefit with 20% of the complexity.
|
||||
|
||||
## Conclusion
|
||||
|
||||
The current FFI optimizations are correct but target the wrong bottleneck. The real gains come from:
|
||||
|
||||
1. **Algorithmic improvements** (dirty flags, caching)
|
||||
2. **Lua optimization patterns** (local hoisting, inline)
|
||||
3. **Reducing work** (skip unchanged subtrees)
|
||||
|
||||
FFI helps at the margins but isn't the silver bullet. Focus on the high-impact optimizations first.
|
||||
|
||||
---
|
||||
|
||||
**Next Steps:**
|
||||
1. Implement dirty flag system
|
||||
2. Add dimension caching
|
||||
3. Hoist locals in hot loops
|
||||
4. Profile again and measure gains
|
||||
5. Consider single-pass layout if needed
|
||||
Reference in New Issue
Block a user