Add a simple FPS meter to CanvasKit viewer
Change-Id: I7577f9634afd2555543ca56ca774219724b90ce8
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/279206
Commit-Queue: Chris Dalton <csmartdalton@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>
diff --git a/modules/canvaskit/canvaskit/viewer.html b/modules/canvaskit/canvaskit/viewer.html
index 08da2b0..f201f82 100644
--- a/modules/canvaskit/canvaskit/viewer.html
+++ b/modules/canvaskit/canvaskit/viewer.html
@@ -51,14 +51,27 @@
}
slide.load(htmlCanvas.width, htmlCanvas.height);
- const now0 = Date.now();
+
+ const fps = {
+ frames: 0,
+ startMs: window.performance.now()
+ };
surface.requestAnimationFrame(function(canvas) {
- const nanos = (Date.now() - now0) * 1e6;
- if (slide.animate(nanos)) {
+ slide.draw(canvas);
+ ++fps.frames;
+
+ const ms = window.performance.now();
+ const sec = (ms - fps.startMs) / 1000;
+ if (sec > 2) {
+ console.log(Math.round(fps.frames / sec) + ' fps');
+ fps.frames = 0;
+ fps.startMs = ms;
+ }
+
+ if (slide.animate(ms * 1e6)) {
surface.requestAnimationFrame(arguments.callee);
}
- slide.draw(canvas);
});
}
</script>