You are here
Most costly parts of browser rendering for browser performance and paint
Most Costly Parts of Browser Paints
As discussed at JSConf 2014, Paul Irish discusses the anatomy and breaks down the causes of browser paints.
The most costly parts of browser paints include the following:
- Layout - Changing the layout. This requires repaint.
- Visual Effects - Rendering that doesn't affect geometry therefore doesn't need to be painted.
- Compositing Layout - Handled at the compositor level.
Layout Changing the layout
Visual Effects - does not affect geometry:
Compositor Level Rendering
Paul irish discusses this around 9:25 in this video.
At 10:55, i found this pretty useful. Paul Irish describes 4 things a browser can transition jank-free:
- Position -
- Rotation -
- Opacity -