motion 12.16.1-alpha.0 → 12.17.0-alpha.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/cjs/debug.js CHANGED
@@ -2,300 +2,13 @@
2
2
 
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
- const MotionGlobalConfig = {};
5
+ var debug = require('framer-motion/debug');
6
6
 
7
- /*#__NO_SIDE_EFFECTS__*/
8
- const noop = (any) => any;
9
7
 
10
- const stepsOrder = [
11
- "setup", // Compute
12
- "read", // Read
13
- "resolveKeyframes", // Write/Read/Write/Read
14
- "preUpdate", // Compute
15
- "update", // Compute
16
- "preRender", // Compute
17
- "render", // Write
18
- "postRender", // Compute
19
- ];
20
8
 
21
- const statsBuffer = {
22
- value: null,
23
- addProjectionMetrics: null,
24
- };
25
-
26
- function createRenderStep(runNextFrame, stepName) {
27
- /**
28
- * We create and reuse two queues, one to queue jobs for the current frame
29
- * and one for the next. We reuse to avoid triggering GC after x frames.
30
- */
31
- let thisFrame = new Set();
32
- let nextFrame = new Set();
33
- /**
34
- * Track whether we're currently processing jobs in this step. This way
35
- * we can decide whether to schedule new jobs for this frame or next.
36
- */
37
- let isProcessing = false;
38
- let flushNextFrame = false;
39
- /**
40
- * A set of processes which were marked keepAlive when scheduled.
41
- */
42
- const toKeepAlive = new WeakSet();
43
- let latestFrameData = {
44
- delta: 0.0,
45
- timestamp: 0.0,
46
- isProcessing: false,
47
- };
48
- let numCalls = 0;
49
- function triggerCallback(callback) {
50
- if (toKeepAlive.has(callback)) {
51
- step.schedule(callback);
52
- runNextFrame();
53
- }
54
- numCalls++;
55
- callback(latestFrameData);
56
- }
57
- const step = {
58
- /**
59
- * Schedule a process to run on the next frame.
60
- */
61
- schedule: (callback, keepAlive = false, immediate = false) => {
62
- const addToCurrentFrame = immediate && isProcessing;
63
- const queue = addToCurrentFrame ? thisFrame : nextFrame;
64
- if (keepAlive)
65
- toKeepAlive.add(callback);
66
- if (!queue.has(callback))
67
- queue.add(callback);
68
- return callback;
69
- },
70
- /**
71
- * Cancel the provided callback from running on the next frame.
72
- */
73
- cancel: (callback) => {
74
- nextFrame.delete(callback);
75
- toKeepAlive.delete(callback);
76
- },
77
- /**
78
- * Execute all schedule callbacks.
79
- */
80
- process: (frameData) => {
81
- latestFrameData = frameData;
82
- /**
83
- * If we're already processing we've probably been triggered by a flushSync
84
- * inside an existing process. Instead of executing, mark flushNextFrame
85
- * as true and ensure we flush the following frame at the end of this one.
86
- */
87
- if (isProcessing) {
88
- flushNextFrame = true;
89
- return;
90
- }
91
- isProcessing = true;
92
- [thisFrame, nextFrame] = [nextFrame, thisFrame];
93
- // Execute this frame
94
- thisFrame.forEach(triggerCallback);
95
- /**
96
- * If we're recording stats then
97
- */
98
- if (stepName && statsBuffer.value) {
99
- statsBuffer.value.frameloop[stepName].push(numCalls);
100
- }
101
- numCalls = 0;
102
- // Clear the frame so no callbacks remain. This is to avoid
103
- // memory leaks should this render step not run for a while.
104
- thisFrame.clear();
105
- isProcessing = false;
106
- if (flushNextFrame) {
107
- flushNextFrame = false;
108
- step.process(frameData);
109
- }
110
- },
111
- };
112
- return step;
113
- }
114
-
115
- const maxElapsed = 40;
116
- function createRenderBatcher(scheduleNextBatch, allowKeepAlive) {
117
- let runNextFrame = false;
118
- let useDefaultElapsed = true;
119
- const state = {
120
- delta: 0.0,
121
- timestamp: 0.0,
122
- isProcessing: false,
123
- };
124
- const flagRunNextFrame = () => (runNextFrame = true);
125
- const steps = stepsOrder.reduce((acc, key) => {
126
- acc[key] = createRenderStep(flagRunNextFrame, allowKeepAlive ? key : undefined);
127
- return acc;
128
- }, {});
129
- const { setup, read, resolveKeyframes, preUpdate, update, preRender, render, postRender, } = steps;
130
- const processBatch = () => {
131
- const timestamp = MotionGlobalConfig.useManualTiming
132
- ? state.timestamp
133
- : performance.now();
134
- runNextFrame = false;
135
- if (!MotionGlobalConfig.useManualTiming) {
136
- state.delta = useDefaultElapsed
137
- ? 1000 / 60
138
- : Math.max(Math.min(timestamp - state.timestamp, maxElapsed), 1);
139
- }
140
- state.timestamp = timestamp;
141
- state.isProcessing = true;
142
- // Unrolled render loop for better per-frame performance
143
- setup.process(state);
144
- read.process(state);
145
- resolveKeyframes.process(state);
146
- preUpdate.process(state);
147
- update.process(state);
148
- preRender.process(state);
149
- render.process(state);
150
- postRender.process(state);
151
- state.isProcessing = false;
152
- if (runNextFrame && allowKeepAlive) {
153
- useDefaultElapsed = false;
154
- scheduleNextBatch(processBatch);
155
- }
156
- };
157
- const wake = () => {
158
- runNextFrame = true;
159
- useDefaultElapsed = true;
160
- if (!state.isProcessing) {
161
- scheduleNextBatch(processBatch);
162
- }
163
- };
164
- const schedule = stepsOrder.reduce((acc, key) => {
165
- const step = steps[key];
166
- acc[key] = (process, keepAlive = false, immediate = false) => {
167
- if (!runNextFrame)
168
- wake();
169
- return step.schedule(process, keepAlive, immediate);
170
- };
171
- return acc;
172
- }, {});
173
- const cancel = (process) => {
174
- for (let i = 0; i < stepsOrder.length; i++) {
175
- steps[stepsOrder[i]].cancel(process);
176
- }
177
- };
178
- return { schedule, cancel, state, steps };
179
- }
180
-
181
- const { schedule: frame, cancel: cancelFrame, state: frameData, steps: frameSteps, } = /* @__PURE__ */ createRenderBatcher(typeof requestAnimationFrame !== "undefined" ? requestAnimationFrame : noop, true);
182
-
183
- const activeAnimations = {
184
- layout: 0,
185
- mainThread: 0,
186
- waapi: 0,
187
- };
188
-
189
- function record() {
190
- const { value } = statsBuffer;
191
- if (value === null) {
192
- cancelFrame(record);
193
- return;
194
- }
195
- value.frameloop.rate.push(frameData.delta);
196
- value.animations.mainThread.push(activeAnimations.mainThread);
197
- value.animations.waapi.push(activeAnimations.waapi);
198
- value.animations.layout.push(activeAnimations.layout);
199
- }
200
- function mean(values) {
201
- return values.reduce((acc, value) => acc + value, 0) / values.length;
202
- }
203
- function summarise(values, calcAverage = mean) {
204
- if (values.length === 0) {
205
- return {
206
- min: 0,
207
- max: 0,
208
- avg: 0,
209
- };
210
- }
211
- return {
212
- min: Math.min(...values),
213
- max: Math.max(...values),
214
- avg: calcAverage(values),
215
- };
216
- }
217
- const msToFps = (ms) => Math.round(1000 / ms);
218
- function clearStatsBuffer() {
219
- statsBuffer.value = null;
220
- statsBuffer.addProjectionMetrics = null;
221
- }
222
- function reportStats() {
223
- const { value } = statsBuffer;
224
- if (!value) {
225
- throw new Error("Stats are not being measured");
226
- }
227
- clearStatsBuffer();
228
- cancelFrame(record);
229
- const summary = {
230
- frameloop: {
231
- setup: summarise(value.frameloop.setup),
232
- rate: summarise(value.frameloop.rate),
233
- read: summarise(value.frameloop.read),
234
- resolveKeyframes: summarise(value.frameloop.resolveKeyframes),
235
- preUpdate: summarise(value.frameloop.preUpdate),
236
- update: summarise(value.frameloop.update),
237
- preRender: summarise(value.frameloop.preRender),
238
- render: summarise(value.frameloop.render),
239
- postRender: summarise(value.frameloop.postRender),
240
- },
241
- animations: {
242
- mainThread: summarise(value.animations.mainThread),
243
- waapi: summarise(value.animations.waapi),
244
- layout: summarise(value.animations.layout),
245
- },
246
- layoutProjection: {
247
- nodes: summarise(value.layoutProjection.nodes),
248
- calculatedTargetDeltas: summarise(value.layoutProjection.calculatedTargetDeltas),
249
- calculatedProjections: summarise(value.layoutProjection.calculatedProjections),
250
- },
251
- };
252
- /**
253
- * Convert the rate to FPS
254
- */
255
- const { rate } = summary.frameloop;
256
- rate.min = msToFps(rate.min);
257
- rate.max = msToFps(rate.max);
258
- rate.avg = msToFps(rate.avg);
259
- [rate.min, rate.max] = [rate.max, rate.min];
260
- return summary;
261
- }
262
- function recordStats() {
263
- if (statsBuffer.value) {
264
- clearStatsBuffer();
265
- throw new Error("Stats are already being measured");
266
- }
267
- const newStatsBuffer = statsBuffer;
268
- newStatsBuffer.value = {
269
- frameloop: {
270
- setup: [],
271
- rate: [],
272
- read: [],
273
- resolveKeyframes: [],
274
- preUpdate: [],
275
- update: [],
276
- preRender: [],
277
- render: [],
278
- postRender: [],
279
- },
280
- animations: {
281
- mainThread: [],
282
- waapi: [],
283
- layout: [],
284
- },
285
- layoutProjection: {
286
- nodes: [],
287
- calculatedTargetDeltas: [],
288
- calculatedProjections: [],
289
- },
290
- };
291
- newStatsBuffer.addProjectionMetrics = (metrics) => {
292
- const { layoutProjection } = newStatsBuffer.value;
293
- layoutProjection.nodes.push(metrics.nodes);
294
- layoutProjection.calculatedTargetDeltas.push(metrics.calculatedTargetDeltas);
295
- layoutProjection.calculatedProjections.push(metrics.calculatedProjections);
296
- };
297
- frame.postRender(record, true);
298
- return reportStats;
299
- }
300
-
301
- exports.recordStats = recordStats;
9
+ Object.keys(debug).forEach(function (k) {
10
+ if (k !== 'default' && !Object.prototype.hasOwnProperty.call(exports, k)) Object.defineProperty(exports, k, {
11
+ enumerable: true,
12
+ get: function () { return debug[k]; }
13
+ });
14
+ });