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.
Understand frame rate execution - JavaScript Tutorial
From the course: Vanilla JavaScript: Web Performance Optimization APIs
Understand frame rate execution
- [Narrator] To improve responsiveness of our app, we need to understand frames. So the browser is rendering frames all the time. We want to achieve 60 frames per second for better performance, unless we are doing VR, virtual reality or augmented reality. In those cases, we might want more frames per second, but on a normal screen, 60 frames per second is enough. And to achieve 60 frames per second, we need to understand how the system works. At least, at a high level overview and then use a new approach. So, this is a simplified version of the architecture of how the browser is rendering frames. Each frame, so 60 frames per second. So this diagram will try to be executed 60 times per second. So a frame starts. In that case, the browser will start processing your input demands. So if you have an on click handler, on scroll, or something like that, after you do some changes, there might be some new HTML that needs to be parsed. The browser will calculate the styles, the layout, new CSS…
Practice while you learn with exercise files
Download the files the instructor uses to teach the course. Follow along and learn by watching, listening and practicing.