CODEWITHSUNDEEP
cssbenchmarking
John Hoffman
John Hoffman

Reputation: 18617

How do I benchmark the FPS of a CSS3 animation?

In WebGL, I can measure frames per second by recording the timestamps of when requestAnimationFrame occur.

How do I measure the frames-per-second of a CSS3 animation? I can measure how long the animation took, but how do I quantify the jank during the animation?

Upvotes: 3

Views: 562

Answers (1)

easwee
easwee

Reputation: 15915

If you are using a webkit based browser do:

1.) ctrl + shift + j to bring up the dev tools.

2.) At the bottom you will see a tab called "Rendering", drag it up so you can see it's content.

4.) Put a check to "Show FPS" meter.

FPS metter should appear in your top right corner of the browser viewport, showing you the current fps and a graph.

Upvotes: 4

Related Questions