Welcome to the Treehouse Community

The Treehouse Community is a meeting place for developers, designers, and programmers of all backgrounds and skill levels to get support. Collaborate here on code errors or bugs that you need feedback on, or asking for an extra set of eyes on your latest project. Join thousands of Treehouse students and alumni in the community today. (Note: Only Treehouse students can comment or ask questions, but non-students are welcome to browse our conversations.)

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and a supportive community. Start your free trial today.

Development Tools Website Optimization Chrome DevTools Basics The Timeline Panel

Lorenzo Pieri
Lorenzo Pieri
19,772 Points

Page rendering at 60FPS or less

Let us take in consideration the fact that pages (just like games) might load at a lower FPS rate, dropping lower and lower (LoL much?)

If Im not mistaken, our naked eye can only see differences in framerate when the latter drops below 25FPS. If that is true, why would I care about the FPS rate dropping from 60+ to 30?

Thanks!

1 Answer

Gleb Vorobjev
Gleb Vorobjev
13,703 Points

The issue with a video game dropping to 30 FPS is that the rate of player's input may not quite correlate to the visuals, at least in terms of smoothness, depending on how the game is programmed. Some gamers claim that they can notice a difference between 30 and 60 FPS.

All that aside, dropping from 60 to 30 FPS should not be an issue for most web pages/apps. But if a certain effect causes a large drop in FPS, this should be a candidate for optimization from the developer's point of view. If the user is running a low-end machine with other processes competing for system resources, that 30 FPS might dip below ~25 FPS and cause noticeable visual lag.

I think the take away message is to use the Timeline panel to double check if your web page has any effects that are unusually resource intensive.