http://jankfree.org/

Low level warning

jankfree.org for the intro versions of this talk

This is lower level: how we study jank in the Chrome/Blink teams.

Maybe you'll use these tricks one day when you're lost (or want to confirm/rip someone's results to shreds)

Basics: Frames and about:tracing

Jank-busting 101 (the lowlevel version)

  1. 1. How much are you painting?
  2. 2. See if your layers make sense
  3. 3. Check for scrolling bottlenecks
source http://www.flickr.com/photos/jurvetson/3031088430/ cc-by

Painting

Layers

Scrolling bottlenecks

Chrome can 'natively scroll' parts of your page, if the page is simple enough. But, not awlays. Beware: An uncooperative iframe and

If I lost you somewhere...

  • about:tracing is your friend when you get in hot water.
  • Chrome Frame Viewer for more on the demos here.

Keep an eye out for:

  • Paint storms & paint costs
  • Big main thread jank of any sort
  • Scrolling bottlenecks
  • (In)sane layers

Thanks!

For more:

  • jankfree.org
  • html5rocks.com
  • nduca@chromium.org, wiltzius@chromium.org