Adding an FPS Limit

Welcome back to OpenGL Fundamentals: Your First Triangle! Having successfully created our OpenGL window in the previous lesson, we're now ready to take control of an important aspect of real-time graphics: frame rate management. In this second lesson, we'll implement an FPS limiter that caps our application at 30 frames per second, giving us more predictable performance and resource usage.

Frame rate control might seem like a simple topic, but it's actually quite fundamental to creating smooth, responsive applications. Rather than letting our graphics run as fast as possible (which can waste energy and create inconsistent timing), we'll learn to limit our render loop to a specific target frame rate. This approach will serve us well as our graphics become more complex.

Before diving into code, let's understand why controlling the frame rate matters in graphics programming. When we run our current window, it renders as quickly as possible, potentially reaching hundreds of FPS on powerful hardware. This creates several problems: excessive power consumption, inconsistent timing between frames, and unnecessary strain on the graphics hardware.

Frame rate limiting solves these issues by introducing deliberate pauses in our render loop. Instead of rendering every possible frame, we only render when enough time has passed to maintain our target rate. For example, at 30 FPS, each frame should take approximately 33.33 milliseconds. If we finish rendering in 10 milliseconds, we wait an additional 23.33 milliseconds before starting the next frame.

This approach differs from V-Sync (Vertical Synchronization), which synchronizes rendering with the monitor's refresh rate. While V-Sync prevents screen tearing, it locks us to the monitor's frequency (usually 60Hz or higher). Manual FPS limiting gives us precise control over our target frame rate, regardless of monitor specifications.

The foundation of any FPS limiter lies in defining our target performance metrics. We need to establish both the desired frame rate and the corresponding time each frame should consume.

// FPS limiting
const float TARGET_FPS = 30.0f;
const float TARGET_FRAME_TIME = 1.0f / TARGET_FPS;

These constants define our performance goals clearly. TARGET_FPS represents our desired frames per second (30), while TARGET_FRAME_TIME calculates the duration each frame should take in seconds. Since we want 30 frames per second, each frame should consume 1/30th of a second, or approximately 0.033 seconds (33.33 milliseconds). Using constants makes our code more maintainable: changing the target FPS requires updating only one value.