App Life Cycles

Browser Rendering Optimization.txt

App Life Cycles
	- Response
	- Animations
	- Idle
	- Load (XHR, Websockets, HTML imports)

In Chronological Order:
	Load (~1 sec) Initial page load
	Idle (~ 50ms) Lazy load items
	Response (~100ms) On interaction, respond within 100ms
	Animations (~16ms) In reality we get ~12ms since the browser has some overhead


For an opacity change or transform animation, only the composite is triggered.
- The page isn't receiving any new HTML, so the DOM doesn't need to be built.
- The page isn't receiving any new CSS, so the CSSOM doesn't need to be built.
- The page isn't receiving any new HTML or CSS, so the Render Tree doesn't need to be touched.
- If an opacity or transform changes affects element on its own layer, layout won't need to be run.
- If an opacity or transform changes affects element on its own layer, paint won't need to be run.