Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Runtime performance evaluation of Javascript Applications

Runtime performance evaluation of Javascript Applications

Optimising for faster page loads is just one part of providing users with a great web experience. For the complete and perfect experience, the web application has to be fast, reliable and performant at both load and run times.

In this session, we'll learn about tools and strategies to identify and fix common problems that slow down runtime performance.
We'll learn how to speed up JavaScript execution, the best practices to writing code that does not introduce performance bottlenecks, and most importantly how to profile and get rid of runtime performance issues from our web applications.

Kati Frantz

November 09, 2019
Tweet

More Decks by Kati Frantz

Other Decks in Programming

Transcript

  1. How the browser renders at runtime - Frame rates 60fps

    is required for a non janky , silky smooth UI The browser takes ~16ms to make a frame We have ~12ms on our part to make a frame
  2. JAVASCRIPT Analyse JavaScript performance with devtools Offload long running tasks

    to web workers Write memory efficient applications Demos here runtime-talk.katifrantz.com
  3. RECALCULATING STYLES AND LAYOUT Use better selector matching. Use BEM

    The less elements affected, the better. Demos here runtime-talk.katifrantz.com
  4. PAINT AND COMPOSITE Avoid paint when you can. It’s expensive

    Promote elements with will-change Stick to transform and opacity for animations