Synchronized motion comparison

Ready

A panel cannot display more distinct updates than the browser and active display can present.

Ready

Synchronized motion demo

FPS Comparison Test

Compare multiple target frame rates with objects driven by the same elapsed-time motion. Change rates, add more lanes, adjust speed, pause on a frame, or use fullscreen for a clearer inspection.

What Is an FPS Comparison Test?

An FPS comparison displays the same motion with updates quantized to different target rates. Both objects use elapsed time and the same pixels-per-second speed, so the lower-rate object does not travel more slowly; it simply advances in larger, less frequent steps. That separation is essential for a fair visible comparison of temporal sampling.

This page supports common targets such as 30, 60, 120, 144, 165, and 240 FPS. A selected target is an animation rule, not a guarantee that the browser or display can present every requested update. A 60 Hz screen cannot visibly show 144 unique refreshes each second, and browser scheduling may reduce either lane under load.

30 FPS vs 60 FPS vs 120 FPS

At 30 FPS, a new position is scheduled every 33.33 milliseconds. At 60 FPS the step is 16.67 ms, and at 120 FPS it is 8.33 ms. With constant motion speed, higher temporal sampling produces smaller position jumps. The difference becomes easier to see at faster motion speeds and on a display whose refresh cadence is high enough to present the added updates.

Comparing 60 vs 144 FPS requires more than selecting 144 in the control. The active display must support a higher rate, the operating system must enable it, and the browser must receive suitable presentation opportunities. On a 60 Hz path, the 144 lane is downsampled by the real display chain. That limitation is useful information rather than a defect in the comparison.

How to Get Started

Choose at least two target rates and begin at 480 pixels per second. Use Add Rate to create another editable lane when you want a wider comparison. Track the crisp edge with your eyes, then try a faster speed. Pause to compare positions only after observing motion; a still frame cannot demonstrate temporal smoothness. Fullscreen provides a larger travel distance and can keep the window clearly assigned to one monitor.

  1. Start with 30 FPS and 60 FPS so the cadence difference is large and easy to identify.
  2. Next compare 60 FPS with 120 or 144 FPS on a suitably configured high-refresh display.
  3. Keep speed constant while changing rates, then keep rates constant while changing speed to understand both variables.

Why FPS Comparison Helps

Frame-rate labels are abstract until connected to moving content. The FPS comparison makes the size of temporal steps visible and shows why camera pans, scrolling edges, and fast targets benefit from more frequent updates. It can also demonstrate diminishing visible differences: the jump from 30 to 60 is usually larger than the jump from 120 to 144 because frame budgets change nonlinearly.

Perception varies with motion speed, viewing distance, content contrast, display persistence, and individual vision. The test avoids ranking viewers or claiming that everyone must perceive the same threshold. Its job is to present controlled browser motion and let you compare under your actual display conditions.

FPS and Refresh Rate in a Visual Comparison

FPS is the requested update rate for each animation lane; refresh rate is the display opportunity rate. If FPS is below refresh rate, positions may remain unchanged across some refreshes. If the requested FPS exceeds refresh rate, multiple calculated positions cannot all become distinct scans. Synchronization and compositor behavior determine which updates are ultimately visible.

Variable refresh displays can align presentation more flexibly within their operating range, but this browser demo cannot confirm whether VRR is engaged. V-Sync concepts, duplicated frames, and tearing are best understood as parts of the full presentation pipeline. The dedicated screen tearing test supplies a broad moving pattern for visual inspection.

What You Can Learn

You can learn how larger and smaller temporal steps look on the current setup, whether your browser appears able to distinguish the selected lanes, and how motion speed affects visibility. The test can support display education, animation design discussions, or a quick check after switching refresh modes. It is especially useful when paired with the FPS-to-MS calculator, which shows each rate’s ideal interval.

You cannot use the demo to benchmark a GPU, predict game FPS, prove a monitor’s exact refresh rate, or decide that one frame rate is universally necessary. The scene is intentionally lightweight and is not representative of a complex game workload. A lane label is a target cap within this animation, not measured native application throughput.

Limitations and Better Comparisons

Browser scheduling, foreground status, system load, display assignment, and refresh rate limit the result. Recording the screen can introduce load and may encode at a rate too low to preserve the comparison. Motion interpolation on a television or monitor can also alter appearance. Disable such processing only if you already understand the display setting and want a controlled comparison.

Keep the browser on one monitor, verify its refresh mode, avoid switching tabs, and repeat with the same speed. For measured cadence, use the refresh-rate test. For timing consistency, use frame pacing. For native games, compare captured in-game frame times rather than inferring performance from this lightweight browser animation.