SHARED detail

February 26, 2019

Google Performance Analyze Runtime

Source: Tomnerbtech

Users expect pages to be interactive and smooth. Each stage in the pixel pipeline represents an opportunity to introduce jank. Learn about tools and strategies to identify and fix common problems that slow down runtime performance.

TL;DR

  • Don’t write JavaScript that forces the browser to recalculate layout. Separate read and write functions, and perform reads first.
  • Don’t over-complicate your CSS. Use less CSS and keep your CSS selectors simple.
  • Avoid layout as much as possible. Choose CSS that doesn’t trigger layout at all.
  • Painting can take up more time than any other rendering activity. Watch out for paint bottlenecks.

JavaScript
JavaScript calculations, especially ones that trigger extensive visual changes, can stall application performance. Don’t let badly-timed or long-running JavaScript interfere with user interactions.

Tools
Make a Timeline recording and look for suspiciously long Evaluate Script events. If you find any, you can enable the JS Profiler and re-do your recording to get more detailed information about exactly which JS functions were called and how long each took.

If you’re noticing quite a bit of jank in your JavaScript, you may need to take your analysis to the next level and collect a JavaScript CPU profile. CPU profiles show where execution time is spent within your page’s functions. Learn how to create CPU profiles in Speed Up JavaScript Execution.

Contact US

If you want to design and develop website or re-build your website, please feel free to contact us by phone, email, Facebook, Telegram or other chat. Thank You!
#89B, St. 199A, Phnom Penh, Cambodia
© 2019. All rights reserved. Tomnerb TECH.