animejs 4.4.0 → 4.5.0

package/dist/modules/core/clock.cjs

@@ -1,6 +1,6 @@
 /**
  * Anime.js - core - CJS
- * @version v4.4.0
+ * @version v4.5.0
  * @license MIT
  * @copyright 2026 - Julian Garnier
  */
@@ -36,8 +36,6 @@ class Clock {
     /** @type {Number} */
     this._lastTime = initTime;
     /** @type {Number} */
-    this._scheduledTime = 0;
-    /** @type {Number} */
     this._frameDuration = consts.K / consts.maxFps;
     /** @type {Number} */
     this._fps = consts.maxFps;
@@ -56,14 +54,12 @@ class Clock {
   }
 
   set fps(frameRate) {
-    const previousFrameDuration = this._frameDuration;
     const fr = +frameRate;
     const fps = fr < consts.minValue ? consts.minValue : fr;
     const frameDuration = consts.K / fps;
     if (fps > globals.defaults.frameRate) globals.defaults.frameRate = fps;
     this._fps = fps;
     this._frameDuration = frameDuration;
-    this._scheduledTime += frameDuration - previousFrameDuration;
   }
 
   get speed() {
@@ -80,17 +76,17 @@ class Clock {
    * @return {tickModes}
    */
   requestTick(time) {
-    const scheduledTime = this._scheduledTime;
-    this._lastTickTime = time;
-    // If the current time is lower than the scheduled time
-    // this means not enough time has passed to hit one frameDuration
-    // so skip that frame
-    if (time < scheduledTime) return consts.tickModes.NONE;
     const frameDuration = this._frameDuration;
-    const frameDelta = time - scheduledTime;
-    // Ensures that _scheduledTime progresses in steps of at least 1 frameDuration.
-    // Skips ahead if the actual elapsed time is higher.
-    this._scheduledTime += frameDelta < frameDuration ? frameDuration : frameDelta;
+    const elapsed = time - this._lastTickTime;
+    const scaled = frameDuration * .25;
+    const tolerance = scaled < 4 ? scaled : 4;
+    // Tolerance prevents dropping frames that arrive a bit early due to RAF jitter
+    // typically <= ~25% of frame duration and capped at 4ms so it doesn't dominate at high fps.
+    // e.g. at 60fps (frameDuration=16.667ms) a frame arriving after 15ms:
+    // - without tolerance: 15 < 16.667 -> skip
+    // - with tolerance: 15 + 4 >= 16.667 -> tick
+    if (elapsed + tolerance < frameDuration) return consts.tickModes.NONE;
+    this._lastTickTime = elapsed >= frameDuration ? time - (elapsed % frameDuration) : time;
     return consts.tickModes.AUTO;
   }
 

package/dist/modules/core/clock.d.ts

@@ -18,8 +18,6 @@ export class Clock {
     /** @type {Number} */
     _lastTime: number;
     /** @type {Number} */
-    _scheduledTime: number;
-    /** @type {Number} */
     _frameDuration: number;
     /** @type {Number} */
     _fps: number;

package/dist/modules/core/clock.js

@@ -1,6 +1,6 @@
 /**
  * Anime.js - core - ESM
- * @version v4.4.0
+ * @version v4.5.0
  * @license MIT
  * @copyright 2026 - Julian Garnier
  */
@@ -34,8 +34,6 @@ class Clock {
     /** @type {Number} */
     this._lastTime = initTime;
     /** @type {Number} */
-    this._scheduledTime = 0;
-    /** @type {Number} */
     this._frameDuration = K / maxFps;
     /** @type {Number} */
     this._fps = maxFps;
@@ -54,14 +52,12 @@ class Clock {
   }
 
   set fps(frameRate) {
-    const previousFrameDuration = this._frameDuration;
     const fr = +frameRate;
     const fps = fr < minValue ? minValue : fr;
     const frameDuration = K / fps;
     if (fps > defaults.frameRate) defaults.frameRate = fps;
     this._fps = fps;
     this._frameDuration = frameDuration;
-    this._scheduledTime += frameDuration - previousFrameDuration;
   }
 
   get speed() {
@@ -78,17 +74,17 @@ class Clock {
    * @return {tickModes}
    */
   requestTick(time) {
-    const scheduledTime = this._scheduledTime;
-    this._lastTickTime = time;
-    // If the current time is lower than the scheduled time
-    // this means not enough time has passed to hit one frameDuration
-    // so skip that frame
-    if (time < scheduledTime) return tickModes.NONE;
     const frameDuration = this._frameDuration;
-    const frameDelta = time - scheduledTime;
-    // Ensures that _scheduledTime progresses in steps of at least 1 frameDuration.
-    // Skips ahead if the actual elapsed time is higher.
-    this._scheduledTime += frameDelta < frameDuration ? frameDuration : frameDelta;
+    const elapsed = time - this._lastTickTime;
+    const scaled = frameDuration * .25;
+    const tolerance = scaled < 4 ? scaled : 4;
+    // Tolerance prevents dropping frames that arrive a bit early due to RAF jitter
+    // typically <= ~25% of frame duration and capped at 4ms so it doesn't dominate at high fps.
+    // e.g. at 60fps (frameDuration=16.667ms) a frame arriving after 15ms:
+    // - without tolerance: 15 < 16.667 -> skip
+    // - with tolerance: 15 + 4 >= 16.667 -> tick
+    if (elapsed + tolerance < frameDuration) return tickModes.NONE;
+    this._lastTickTime = elapsed >= frameDuration ? time - (elapsed % frameDuration) : time;
     return tickModes.AUTO;
   }
 

package/dist/modules/core/colors.cjs

@@ -1,6 +1,6 @@
 /**
  * Anime.js - core - CJS
- * @version v4.4.0
+ * @version v4.5.0
  * @license MIT
  * @copyright 2026 - Julian Garnier
  */

package/dist/modules/core/colors.js

@@ -1,6 +1,6 @@
 /**
  * Anime.js - core - ESM
- * @version v4.4.0
+ * @version v4.5.0
  * @license MIT
  * @copyright 2026 - Julian Garnier
  */

package/dist/modules/core/consts.cjs

@@ -1,6 +1,6 @@
 /**
  * Anime.js - core - CJS
- * @version v4.4.0
+ * @version v4.5.0
  * @license MIT
  * @copyright 2026 - Julian Garnier
  */
@@ -73,6 +73,11 @@ const maxFps = 240;
 const emptyString = '';
 const cssVarPrefix = 'var(';
 
+// Arrays
+
+// Shared sentinel for tween slots that don't hold array data. Never mutated, only read; COMPLEX and COLOR tweens always replace the slot before writing.
+const emptyArray = [];
+
 const shortTransforms = /*#__PURE__*/ (() => {
   const map = new Map();
   map.set('x', 'translateX');
@@ -106,6 +111,13 @@ const transformsFragmentStrings = /*#__PURE__*/ validTransforms.reduce((a, v) =>
 /** @return {void} */
 const noop = () => {};
 
+/**
+ * @template T
+ * @param  {T} v
+ * @return {T}
+ */
+const noopModifier = v => v;
+
 // Regex
 
 const validRgbHslRgx = /\)\s*[-.\d]/;
@@ -128,6 +140,7 @@ exports.cssVarPrefix = cssVarPrefix;
 exports.cssVariableMatchRgx = cssVariableMatchRgx;
 exports.digitWithExponentRgx = digitWithExponentRgx;
 exports.doc = doc;
+exports.emptyArray = emptyArray;
 exports.emptyString = emptyString;
 exports.hexTestRgx = hexTestRgx;
 exports.hslExecRgx = hslExecRgx;
@@ -141,6 +154,7 @@ exports.maxFps = maxFps;
 exports.maxValue = maxValue;
 exports.minValue = minValue;
 exports.noop = noop;
+exports.noopModifier = noopModifier;
 exports.proxyTargetSymbol = proxyTargetSymbol;
 exports.relativeValuesExecRgx = relativeValuesExecRgx;
 exports.rgbExecRgx = rgbExecRgx;

package/dist/modules/core/consts.d.ts

@@ -43,10 +43,12 @@ export const K: 1000;
 export const maxFps: 240;
 export const emptyString: "";
 export const cssVarPrefix: "var(";
+export const emptyArray: any[];
 export const shortTransforms: Map<any, any>;
 export const validTransforms: string[];
 export const transformsFragmentStrings: {};
 export function noop(): void;
+export function noopModifier<T>(v: T): T;
 export const validRgbHslRgx: RegExp;
 export const hexTestRgx: RegExp;
 export const rgbExecRgx: RegExp;

package/dist/modules/core/consts.js

@@ -1,6 +1,6 @@
 /**
  * Anime.js - core - ESM
- * @version v4.4.0
+ * @version v4.5.0
  * @license MIT
  * @copyright 2026 - Julian Garnier
  */
@@ -71,6 +71,11 @@ const maxFps = 240;
 const emptyString = '';
 const cssVarPrefix = 'var(';
 
+// Arrays
+
+// Shared sentinel for tween slots that don't hold array data. Never mutated, only read; COMPLEX and COLOR tweens always replace the slot before writing.
+const emptyArray = [];
+
 const shortTransforms = /*#__PURE__*/ (() => {
   const map = new Map();
   map.set('x', 'translateX');
@@ -104,6 +109,13 @@ const transformsFragmentStrings = /*#__PURE__*/ validTransforms.reduce((a, v) =>
 /** @return {void} */
 const noop = () => {};
 
+/**
+ * @template T
+ * @param  {T} v
+ * @return {T}
+ */
+const noopModifier = v => v;
+
 // Regex
 
 const validRgbHslRgx = /\)\s*[-.\d]/;
@@ -120,4 +132,4 @@ const lowerCaseRgx = /([a-z])([A-Z])/g;
 const relativeValuesExecRgx = /(\*=|\+=|-=)/;
 const cssVariableMatchRgx = /var\(\s*(--[\w-]+)(?:\s*,\s*([^)]+))?\s*\)/;
 
-export { K, compositionTypes, cssVarPrefix, cssVariableMatchRgx, digitWithExponentRgx, doc, emptyString, hexTestRgx, hslExecRgx, hslaExecRgx, isBrowser, isDomSymbol, isRegisteredTargetSymbol, isSvgSymbol, lowerCaseRgx, maxFps, maxValue, minValue, noop, proxyTargetSymbol, relativeValuesExecRgx, rgbExecRgx, rgbaExecRgx, shortTransforms, tickModes, transformsFragmentStrings, transformsSymbol, tweenTypes, unitsExecRgx, validRgbHslRgx, validTransforms, valueTypes, win };
+export { K, compositionTypes, cssVarPrefix, cssVariableMatchRgx, digitWithExponentRgx, doc, emptyArray, emptyString, hexTestRgx, hslExecRgx, hslaExecRgx, isBrowser, isDomSymbol, isRegisteredTargetSymbol, isSvgSymbol, lowerCaseRgx, maxFps, maxValue, minValue, noop, noopModifier, proxyTargetSymbol, relativeValuesExecRgx, rgbExecRgx, rgbaExecRgx, shortTransforms, tickModes, transformsFragmentStrings, transformsSymbol, tweenTypes, unitsExecRgx, validRgbHslRgx, validTransforms, valueTypes, win };

package/dist/modules/core/globals.cjs

@@ -1,6 +1,6 @@
 /**
  * Anime.js - core - CJS
- * @version v4.4.0
+ * @version v4.5.0
  * @license MIT
  * @copyright 2026 - Julian Garnier
  */
@@ -23,10 +23,13 @@ var consts = require('./consts.cjs');
 /**
  * @typedef {Object} EditorGlobals
  * @property {boolean} showPanel
- * @property {boolean} synced
  * @property {Function} addAnimation
+ * @property {Function} addSet
  * @property {Function} addTimeline
  * @property {Function} addTimelineChild
+ * @property {Function} addTimelineLabel
+ * @property {Function} addTimelineCall
+ * @property {Function} addTimelineSync
  * @property {Function} resolveStagger
  * @property {Object|null} _head
  * @property {Object|null} _tail
@@ -49,7 +52,7 @@ const defaults = {
   loopDelay: 0,
   ease: 'out(2)',
   composition: consts.compositionTypes.replace,
-  modifier: v => v,
+  modifier: consts.noopModifier,
   onBegin: consts.noop,
   onBeforeUpdate: consts.noop,
   onUpdate: consts.noop,
@@ -79,7 +82,7 @@ const globals = {
   editor: null,
 };
 
-const globalVersions = { version: '4.4.0', engine: null };
+const globalVersions = { version: '4.5.0', engine: null };
 
 if (consts.isBrowser) {
   if (!consts.win.AnimeJS) consts.win.AnimeJS = [];

package/dist/modules/core/globals.d.ts

@@ -11,10 +11,13 @@
 /**
  * @typedef {Object} EditorGlobals
  * @property {boolean} showPanel
- * @property {boolean} synced
  * @property {Function} addAnimation
+ * @property {Function} addSet
  * @property {Function} addTimeline
  * @property {Function} addTimelineChild
+ * @property {Function} addTimelineLabel
+ * @property {Function} addTimelineCall
+ * @property {Function} addTimelineSync
  * @property {Function} resolveStagger
  * @property {Object|null} _head
  * @property {Object|null} _tail
@@ -38,10 +41,13 @@ export namespace globalVersions {
 }
 export type EditorGlobals = {
     showPanel: boolean;
-    synced: boolean;
     addAnimation: Function;
+    addSet: Function;
     addTimeline: Function;
     addTimelineChild: Function;
+    addTimelineLabel: Function;
+    addTimelineCall: Function;
+    addTimelineSync: Function;
     resolveStagger: Function;
     _head: any | null;
     _tail: any | null;

package/dist/modules/core/globals.js

@@ -1,11 +1,11 @@
 /**
  * Anime.js - core - ESM
- * @version v4.4.0
+ * @version v4.5.0
  * @license MIT
  * @copyright 2026 - Julian Garnier
  */
 
-import { isBrowser, win, noop, compositionTypes, K, maxFps, doc } from './consts.js';
+import { isBrowser, win, noop, noopModifier, compositionTypes, K, maxFps, doc } from './consts.js';
 
 /**
  * @import {
@@ -21,10 +21,13 @@ import { isBrowser, win, noop, compositionTypes, K, maxFps, doc } from './consts
 /**
  * @typedef {Object} EditorGlobals
  * @property {boolean} showPanel
- * @property {boolean} synced
  * @property {Function} addAnimation
+ * @property {Function} addSet
  * @property {Function} addTimeline
  * @property {Function} addTimelineChild
+ * @property {Function} addTimelineLabel
+ * @property {Function} addTimelineCall
+ * @property {Function} addTimelineSync
  * @property {Function} resolveStagger
  * @property {Object|null} _head
  * @property {Object|null} _tail
@@ -47,7 +50,7 @@ const defaults = {
   loopDelay: 0,
   ease: 'out(2)',
   composition: compositionTypes.replace,
-  modifier: v => v,
+  modifier: noopModifier,
   onBegin: noop,
   onBeforeUpdate: noop,
   onUpdate: noop,
@@ -77,7 +80,7 @@ const globals = {
   editor: null,
 };
 
-const globalVersions = { version: '4.4.0', engine: null };
+const globalVersions = { version: '4.5.0', engine: null };
 
 if (isBrowser) {
   if (!win.AnimeJS) win.AnimeJS = [];

package/dist/modules/core/helpers.cjs

@@ -1,6 +1,6 @@
 /**
  * Anime.js - core - CJS
- * @version v4.4.0
+ * @version v4.5.0
  * @license MIT
  * @copyright 2026 - Julian Garnier
  */
@@ -155,7 +155,7 @@ const snap = (v, increment) => isArr(increment) ? increment.reduce((closest, cv)
  * @param  {Number} factor - Interpolation factor in the range [0, 1]
  * @return {Number} The interpolated value
  */
-const lerp = (start, end, factor) => start + (end - start) * factor;
+const lerp = (start, end, factor) => factor === 1 ? end : factor === 0 ? start : start + (end - start) * factor;
 
 /**
  * Replaces infinity with maximum safe value

package/dist/modules/core/helpers.js

@@ -1,11 +1,11 @@
 /**
  * Anime.js - core - ESM
- * @version v4.4.0
+ * @version v4.5.0
  * @license MIT
  * @copyright 2026 - Julian Garnier
  */
 
-import { isBrowser, maxValue, minValue, lowerCaseRgx, hexTestRgx, validRgbHslRgx } from './consts.js';
+import { isBrowser, maxValue, minValue, hexTestRgx, lowerCaseRgx, validRgbHslRgx } from './consts.js';
 import { globals } from './globals.js';
 
 /**
@@ -153,7 +153,7 @@ const snap = (v, increment) => isArr(increment) ? increment.reduce((closest, cv)
  * @param  {Number} factor - Interpolation factor in the range [0, 1]
  * @return {Number} The interpolated value
  */
-const lerp = (start, end, factor) => start + (end - start) * factor;
+const lerp = (start, end, factor) => factor === 1 ? end : factor === 0 ? start : start + (end - start) * factor;
 
 /**
  * Replaces infinity with maximum safe value