/dev tips

🎊   The Modern DevTools course has now started! Visit ModernDevTools.com to find out more   🎊

(146) Network Requests on Performance Panel Show Timelime History (148)

Chrome DevTools: Understand your FPS score and potential scrolling performance issues

29th May 2017
Understand your FPS score and potential scrolling performance issues

You can open the Render Pane from the DevTools drawer. It contains multiple checkboxes which overlay your webpage with various performance annotations.

Enable the FPS meter and then scroll your webpage. If your FPS score dips low, there may be an opportunity for scrolling optimisation.

Enable the 'Scrolling Performance Issues' checkbox. When you scroll your page, indicators may appear if there is a potential scroll bottleneck. At this point, you can begin to explore further as you have identified a potential scrolling issue.

Sign up to receive a developer tip, in the form of a gif, in your inbox each week.