CSS Master

Figure 3.15. SitePoint.com as viewed using Safari 9’s responsive design mode

ToenterSafari 9 ’sresponsivedesignmode,selectDevelop > Responsive Design Mode,
orAlt+Command+R.

Debugging for UI Responsiveness

CSS properties and values that trigger reflows are particularly expensive. They can
slow user interface responsiveness―page rendering, animation smoothness, and
scroll performance―especially on low-powered devices such as phones and smart
TVs.

What is a reflow?

Areflowisanyoperationthatchangesthelayoutofpartorallofapage.Examples
includechangingthedimensionsofanelementorupdatingitsleftposition.They’re

Debugging and Optimization 107