Verified:GitHub

animejs

118|12|Updated May 5, 2026

Search Tags:#javascript #animation #deterministic #adapter #animejs #hyperframes #seek

Ready to run

npx skills add https://github.com/alecs5am/ralphy --skill animejs-alecs5am

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: animejs
Source: https://github.com/alecs5am/ralphy/tree/main/.agents/skills/animejs
Command: npx skills add https://github.com/alecs5am/ralphy --skill animejs-alecs5am

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

HyperFrames users need a reliable pattern to drive Anime.js animations with deterministic timing, shared registration, and safe seek-driven playback within compositions.

Core Features & Use Cases

Adapter pattern to initialize Anime.js instances with autoplay disabled, register them on window.__hfAnime, and expose seek and playback controls to HyperFrames.
Support for both standalone animations and timelines, enabling precise sequencing and deterministic rendering in HyperFrames compositions.
Use case: convert common Anime.js examples into render-safe, seek-driven animations that render consistently across runs.

Quick Start

Create a non-autoplay Anime.js instance, register it on window.__hfAnime, and ensure its duration is finite and seekable within a HyperFrames composition.

Frequently Asked Questions about animejs

High-intent search queries and answers about installing and using this skill.

FAQPage Schema

How do I make Anime.js animations deterministic and seekable in HyperFrames?▼

To make Anime.js animations deterministic in HyperFrames, you must disable autoplay, register each instance synchronously on window.__hfAnime during initialization, use finite durations, and avoid DOM-mutating or time-based callbacks.

What is deterministic animation control and why is it needed for HyperFrames compositions?▼

Deterministic animation control ensures JavaScript animations render consistently and reproducibly across runs. It is needed for HyperFrames compositions to enable precise seek-driven playback and reliable sequencing of timeline effects.

Can I use Anime.js timelines for sequencing animations inside HyperFrames?▼

Yes, you can use Anime.js timelines for sequencing animations inside HyperFrames. You must create them synchronously during initialization, disable autoplay, and register them on window.__hfAnime for seek controls.

What are the limitations when running Anime.js animations in HyperFrames?▼

Limitations of running Anime.js in HyperFrames include requiring synchronous creation during initialization, finite durations, finite loop counts, and strict avoidance of DOM-mutating or time-based callbacks for proper seeking.

Why does my Anime.js animation not render correctly when seeking in HyperFrames?▼

Anime.js animations fail to render correctly when seeking in HyperFrames if autoplay is enabled, instances are not registered on window.__hfAnime, or if they use infinite durations and time-based callbacks.