Update and rename recordFrames.md to recordAnimationFrames.md

snippets/recordAnimationFrames.md

@@ -0,0 +1,36 @@
+### recordAnimationFrames
+
+Invokes the provided callback on each animation frame.
+
+Use recursion. Provided that `running` is `true`, continue invoking `window.requestAnimationFrame()` which invokes the
+provided callback. Return an object with two methods `start` and `stop` to allow manual control of the recording. Omit the second argument, `autoStart`, to implicitly call `start` when the function is invoked.
+
+```js
+const recordAnimationFrames = (callback, autoStart = true) => {
+  let running = true, raf
+  const stop = () => {
+    running = false
+    cancelAnimationFrame(raf)
+  }
+  const start = () => {
+    running = true
+    run()
+  }
+  const run = () => {
+    raf = requestAnimationFrame(() => {
+      callback()
+      if (running) run()
+    })
+  }
+  if (autoStart) start()
+  return { start, stop }
+}
+```
+
+```js
+const cb = () => console.log('Animation frame fired')
+const recorder = recordAnimationFrames(cb) // logs 'Animation frame fired' on each animation frame
+recorder.stop() // stops logging
+recorder.start() // starts again
+const recorder2 = recordAnimationFrames(cb, false) // `start` needs to be explicitly called to begin recording frames
+```