diff --git a/packages/framer-motion/src/frameloop/render-step.ts b/packages/framer-motion/src/frameloop/render-step.ts index 47366c3590..8ad8c2ed42 100644 --- a/packages/framer-motion/src/frameloop/render-step.ts +++ b/packages/framer-motion/src/frameloop/render-step.ts @@ -91,8 +91,8 @@ export function createRenderStep(runNextFrame: () => void): Step { isProcessing = true - // Swap this frame and the next to avoid GC - ;[thisFrame, nextFrame] = [nextFrame, thisFrame] + // Swap this frame and the next to avoid GC + ;[thisFrame, nextFrame] = [nextFrame, thisFrame] // Clear the next frame queue nextFrame.clear() @@ -111,6 +111,7 @@ export function createRenderStep(runNextFrame: () => void): Step { callback(frameData) } + thisFrame.clear() } isProcessing = false diff --git a/packages/framer-motion/src/render/VisualElement.ts b/packages/framer-motion/src/render/VisualElement.ts index 18d29c2f09..0e7e8b16d8 100644 --- a/packages/framer-motion/src/render/VisualElement.ts +++ b/packages/framer-motion/src/render/VisualElement.ts @@ -441,7 +441,9 @@ export abstract class VisualElement< this.values.forEach((value, key) => this.bindToMotionValue(key, value)) - if (!hasReducedMotionListener.current) { + const isAutoConfig = this.reducedMotionConfig !== "never" && this.reducedMotionConfig !== "always"; + + if (isAutoConfig && !hasReducedMotionListener.current) { initPrefersReducedMotion() } @@ -449,8 +451,8 @@ export abstract class VisualElement< this.reducedMotionConfig === "never" ? false : this.reducedMotionConfig === "always" - ? true - : prefersReducedMotion.current + ? true + : prefersReducedMotion.current if (process.env.NODE_ENV !== "production") { warnOnce( @@ -745,8 +747,8 @@ export abstract class VisualElement< return this.isVariantNode ? this : this.parent - ? this.parent.getClosestVariantNode() - : undefined + ? this.parent.getClosestVariantNode() + : undefined } getVariantContext(startAtParent = false): undefined | VariantStateContext { @@ -862,7 +864,7 @@ export abstract class VisualElement< this.latestValues[key] !== undefined || !this.current ? this.latestValues[key] : this.getBaseTargetFromProps(this.props, key) ?? - this.readValueFromInstance(this.current, key, this.options) + this.readValueFromInstance(this.current, key, this.options) if (value !== undefined && value !== null) { if (