Forced Reflow observed while profiling
- Dominant language
- JavaScript
- Stars
- 15.7k
- Forks
- 3.9k
- Avg merge
- 4d 6h
- Merged PRs (30d)
- 34
Description
While hunting performance problems, I noticed Chrome profiler reporting "Recalculate Style" at every animationFrame sometimes leading into "Forced Reflow", which can have an important performance cost.
I believe I can trace this back to UniformState.prototype.update where the use of canvas.clientWidth is the most likely culprit. Perhaps the value could be cached until a resize event occurs.
Also, I am investigating the same behaviour triggered by the call of "widget.resize();" in the defaultRenderLoop. I am not sure what this is used for but it has the potential to generate a "forced reflow" too.
Contributor guide
Research direction
Start by profiling the animation frame path around UniformState.prototype.update, especially its use of canvas.clientWidth, then inspect widget.resize() in the defaultRenderLoop. Confirm which calls trigger forced reflow and whether the value can remain cached until resize. Done means the profiler no longer shows avoidable forced reflow during normal animation frames, with behavior preserved.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- javascript
- Domain
- frontend, performance
- Issue type
- Bug
- Difficulty
- 4/5
- Estimated time
- 3-5 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 35/100