use requestAnimationFrame (ref #123)

raphamorim · Jun 21, 2022 · 3e92a09 · 3e92a09
1 parent 802a2da
commit 3e92a09
Show file tree

Hide file tree

Showing 2 changed files with 14 additions and 15 deletions.
diff --git a/packages/react-ape/renderer/core/render.js b/packages/react-ape/renderer/core/render.js
@@ -22,20 +22,20 @@ function renderApeQueue(
  onFinish: () => mixed
 ) {
  if (apeContextGlobal && apeContextGlobal.renderQueue.length) {
- // const renderFrame = () => {
- // requestAnimationFrame(renderFrame);
- // apeContextGlobal.renderQueue.forEach(element => {
- // // element.render(apeContextGlobal, element.parentLayout)
- // renderApeElement(apeContextGlobal, element);
- // });
- // cancelAnimationFrame(renderFrame);
- // }
- // renderFrame();
+ const queue = apeContextGlobal.renderQueue;
+ const frame = () => {
+ requestAnimationFrame(frame);
+ const element = queue.shift();
+ element.render(apeContextGlobal, element.parentLayout);
 
- apeContextGlobal.renderQueue.forEach(element => {
- renderApeElement(apeContextGlobal, element);
- });
- onFinish();
+ requestAnimationFrame(frame);
+
+ if (!queue.length) {
+ cancelAnimationFrame(frame);
+ onFinish();
+ }
+ }
+ frame();
  }
 }
 

diff --git a/packages/react-ape/renderer/reactApeRenderer.js b/packages/react-ape/renderer/reactApeRenderer.js
@@ -164,7 +164,6 @@ const ReactApeFiber = reconciler({
  // resetAfterCommit happens only for children changes
  renderQueue(apeContextGlobal, () => {
  apeContextGlobal.setSurfaceHeight(0);
- apeContextGlobal.renderQueue = [];
  });
  },
 
@@ -187,7 +186,7 @@ const ReactApeFiber = reconciler({
  schedulePassiveEffects: FrameSchedulingScheduleDeferredCallback,
  cancelPassiveEffects: FrameSchedulingCancelDeferredCallback,
  noTimeout: -1,
- useSyncScheduling: true,
+ useSyncScheduling: false,
  now: FrameSchedulingNow,
  isPrimaryRenderer: true,
  supportsMutation: true,