fix: correct animation frame rate calculation

Author: yuanchuan

src/utils/create-animation.js

@@ -1,43 +1,41 @@
-const STEP60 = 1000 / 60; // 60fps
-const STEP1 = 1000 / 1;   // 1fps
-
-export default function createAnimation(fn) {
-  let id;
-  let time = 0;
-  let lastTime = 0;
-  let lastStep = 0;
+export default function createAnimationFrame(fn, fps = 60) {
+  let id = null;
   let paused = false;
-  function loop(stamp) {
-    if (!time) time = stamp;
-    fn(time);
-    let step = (stamp - lastTime);
-    if (step < STEP60) step = STEP60;
-    if (step > STEP1) step = lastStep || STEP1;
-    if (lastTime) time += step;
-    lastStep = step;
-    lastTime = stamp;
+  let duration = 1000 / fps;
+  let time = 0;
+  let last = 0;
+
+  function loop(now) {
+    if (!time) {
+      time = now;
+    }
+    let delta = now - last;
+    if (last) {
+      time += delta;
+    }
+    if (delta >= duration) {
+      fn(time);
+      last = now;
+    }
     id = requestAnimationFrame(loop);
   }
+
   id = requestAnimationFrame(loop);
+
   return {
-    resume() {
-      if (id && paused) {
-        paused = false;
-        id = requestAnimationFrame(loop);
-      }
-    },
     pause() {
-      if (id) {
-        cancelAnimationFrame(id);
+      if (!paused && id) {
         paused = true;
-      }
-    },
-    cancel() {
-      if (id) {
-        paused = false;
         cancelAnimationFrame(id);
         id = null;
+        last = 0;
       }
     },
-  }
+    resume() {
+      if (paused) {
+        paused = false;
+        id = requestAnimationFrame(loop);
+      }
+    }
+  };
 }