Making Sense of the Long Animation Frames (LoAF) API

Over time the web has become more reliant on JavaScript… but we've very little information on how its growth is affecting our visitors' experience.

Some believe JavaScript is the only way to build the modern web and dismiss the performance concerns, while others hold opposing views.

Wouldn't it be great if we had data on how scripts actually perform in our visitor's browsers – when they delay loading, cause jankiness and slowdown interactions, and perhaps more importantly which scripts are responsible?

After all, if we can't measure it, how can we improve it?

The W3C Long Tasks API was a first attempt at providing this data but it only helped us to understand when the Main Thread was busy and couldn't answer the question of why it was busy.

The W3C Long Animation Frames (LoAF) API aims to overcome the weaknesses of the Long Tasks API and provides both information on when there were long frames during rendering the process, and where possible, details on what Main Thread activity caused the long frame.

In this talk we'll explore:

• What data the API provides and how it relates to the Main Thread activity we see when profiling pages using Chrome DevTools

• How we can use this data to get a better understanding of our visitors experience in the wild and identify scripts that are having a harmful impact on our visitors experience

• What data the API doesn't currently provide and how some of these gaps might be filled in the future

At the end of this talk you'll have a good understanding of the Long Animation Frames API and how to use the data to identify scripts that need improvement.