From the course: Vanilla JavaScript: Web Performance Optimization APIs

Unlock the full course today

Join today to access over 22,600 courses taught by industry experts or purchase this course individually.

Detect frame rate drops

Detect frame rate drops - JavaScript Tutorial

From the course: Vanilla JavaScript: Web Performance Optimization APIs

Start my 1-month free trial

Detect frame rate drops

“

- [Instructor] I'm back in the project, in this case, in 03_07, Begin, and we have already talked about Long Task API and there is a new one coming, but it's not yet available at the time of shooting this video in any browser. But, it's in development in Chrome and many others. There isn't a standard in W3C so it will be available. It's called the Frame Timing API. That API will let us detect frame rate drops. So we know that to create a consistent animation, typically we want to have 60 frames per second. And sometimes our transcript code, or too many CSS styles will harm that frame break. While the browsers will start warning us when we are dropping a frame, so we are not consistently providing 60 frames per second. This works very similar to Long Task API, so we need to create in this case an observer, frameObserver. We are going to create the PerformanceObserver again, so it's pretty similar to the previous example. I'm going to try to do this because it's not yet available, and…

Contents