Skills animejs

📦

animejs

Name: animejs
Author: heygen-com

Content revision r1 Safe ⚙️ External commands🌐 Network access

Create Deterministic Anime.js HyperFrames

Anime.js animations can drift when they run on their own clock. This skill shows deterministic HyperFrames patterns that register animations and seek them through the runtime adapter.

Supports: Claude Codex Code(CC)

🥉 78 Bronze

Install with my Agent

Copy this request to your Agent. It includes the canonical Skill page and manifest.

Agent request

Review the Skillstore skill "animejs" from https://skillstore.io/skills/heygen-com-animejs.md and its manifest at https://skillstore.io/api/skills/heygen-com-animejs/manifest. Verify the artifact. You may proceed after verification, subject to the environment's own policy.

Your Agent should still show its plan and request any confirmation required by the security policy.

Agent-readable resources

Use these links when an AI agent, crawler, or script needs clean context instead of reading the full page.

Markdown detail GET /skills/heygen-com-animejs.md Signed manifest GET /api/skills/heygen-com-animejs/manifest Signed lockfile GET /api/skills/heygen-com-animejs/lockfile

Test it

Using "animejs". A request to animate a title and accent line in HyperFrames.

Expected outcome:

A deterministic timeline plan with autoplay disabled, finite durations, and explicit registration on window.__hfAnime.

Using "animejs". An Anime.js browser example copied from documentation.

Expected outcome:

A render-safe adaptation that initializes synchronously and can be controlled by the HyperFrames clock.

Using "animejs". A composition that depends on timers and infinite loops.

Expected outcome:

A review summary that identifies nondeterministic animation patterns and suggests finite, seek-driven replacements.

Security Audit

Safe

v6 • 7/9/2026 Open versioned report

Most static findings are false positives caused by Markdown backticks, inline code, code fences, or safe prose. Two findings are confirmed because example snippets load Anime.js from jsDelivr, creating a real external dependency. No prompt injection or malicious intent was found in the reviewed skill file.

Files scanned

115

Lines analyzed

Review items

False positives ignored

Capability review items (2)

These are real local capabilities that may be expected for this skill, so they require review but are not counted as confirmed malicious behavior.

Low

SKILL.md:23

Hardcoded URL

The HTML example loads Anime.js from jsDelivr at runtime. This is a legitimate dependency pattern, but it creates a real external network and supply-chain dependency.

Low

SKILL.md:74

Hardcoded URL

import { animate } from "https://cdn.jsdelivr.net/npm/animejs/+esm";

The module example imports Anime.js directly from jsDelivr. The URL is intentional, but generated compositions may fetch third-party code at runtime.

Risk Factors

⚙️ External commands (17)

SKILL.md:8 SKILL.md:13 SKILL.md:14 SKILL.md:18 SKILL.md:22-38 SKILL.md:38-42 SKILL.md:42-66 SKILL.md:66-70 SKILL.md:70 SKILL.md:72-85 SKILL.md:85-97 SKILL.md:97-98 SKILL.md:98 SKILL.md:106-109 SKILL.md:109-113 SKILL.md:113-114 SKILL.md:114

🌐 Network access (3)

SKILL.md:23 SKILL.md:74 SKILL.md:114

Audited by: codex View Audit History →

Share & cite this report

Share the versioned assessment report, neutral badge, embed card, and citations. Skillstore reports evidence without deciding whether this Skill is safe.

Open versioned report

Copy report link

https://skillstore.io/skills/heygen-com-animejs/audits/6?utm_source=security_passport&utm_medium=share&utm_campaign=versioned_report

Markdown badge

[![Skillstore security assessment](https://skillstore.io/badges/skills/heygen-com-animejs/security.svg)](https://skillstore.io/skills/heygen-com-animejs?utm_source=security_passport_badge)

HTML badge

<a href="https://skillstore.io/skills/heygen-com-animejs?utm_source=security_passport_badge"><img src="https://skillstore.io/badges/skills/heygen-com-animejs/security.svg" alt="Skillstore security assessment" loading="lazy"></a>

Embed card

<iframe src="https://skillstore.io/embed/skills/heygen-com-animejs.html" title="Skillstore Security Assessment" sandbox="allow-popups allow-popups-to-escape-sandbox" loading="lazy" referrerpolicy="no-referrer" width="420" height="180"></iframe>

Academic citations (APA · BibTeX · CFF)

APA citation

heygen-com. (2026). animejs security audit report (audit version 6) [Author version unspecified]. Skillstore. https://skillstore.io/skills/heygen-com-animejs/audits/6

BibTeX citation

@techreport{heygen-com-heygen-com-animejs-2026,
  author = {heygen-com},
  title = {animejs security audit report (audit version 6)},
  institution = {Skillstore},
  year = {2026},
  number = {6},
  url = {https://skillstore.io/skills/heygen-com-animejs/audits/6},
  note = {Author version unspecified}
}

CITATION.cff

cff-version: 1.2.0
message: "If you use this Skill, cite its author and this versioned security audit report."
title: "animejs security audit report (audit version 6)"
version: "unspecified"
type: report
authors:
  - name: "heygen-com"
date-released: "2026-07-09"
url: "https://skillstore.io/skills/heygen-com-animejs/audits/6"
identifiers:
  - type: other
    value: "skillstore:heygen-com-animejs:audit:6"
    description: "Skillstore immutable audit report identifier"

Skillstore Score

Why this score Evidence Confidence: High

Architecture

Maintainability

Content

Community

Spec Compliance

What You Can Build

Convert Anime.js Examples

Adapt an existing Anime.js sample so HyperFrames can seek it deterministically.

Build Timeline Micro-Animations

Create compact DOM or SVG flourishes that register with the HyperFrames runtime.

Review Render Safety

Check a composition for autoplay, infinite loops, async setup, and unseeded randomness.

Try These Prompts

Add a Basic Animation

Use the animejs skill to add a simple seek-driven Anime.js animation to my HyperFrames composition.

Convert an Existing Snippet

Use the animejs skill to convert this Anime.js example into render-safe HyperFrames HTML.

Create a Registered Timeline

Use the animejs skill to build a finite Anime.js timeline and register it on window.__hfAnime.

Audit Determinism

Use the animejs skill to review my composition for autoplay, async setup, timers, and nondeterministic animation state.

Best Practices

Create animations synchronously during composition initialization.
Set autoplay to false and register every instance on window.__hfAnime.
Use finite durations and loop counts that match the composition duration.

Avoid

Do not rely on Anime.js autoplay for HyperFrames rendering.
Do not create animations after timers, promises, events, or async asset loads.
Do not depend on anime.running auto-discovery instead of explicit registration.

Frequently Asked Questions

What does this skill help me build?

It helps build Anime.js animations that HyperFrames can seek and render deterministically.

Does it replace GSAP in HyperFrames?

No. The skill says GSAP remains the primary path for complex scene sequencing.

Why should autoplay be disabled?

Autoplay uses Anime.js timing instead of the HyperFrames clock, which can make renders drift.

What is window.__hfAnime used for?

It is the registry where Anime.js animations and timelines are exposed to the HyperFrames adapter.

Can I use ES module imports?

Yes. The skill includes an ES module pattern, but CDN imports may need local replacement.

How should I validate changes?

Run the HyperFrames lint and validate checks after editing a composition that uses Anime.js.

Developer Details

Author

heygen-com

License

MIT

Skillstore revision

Version notice

The author did not declare a version.

Repository

https://github.com/heygen-com/hyperframes/tree/main/skills/animejs/

Ref

0519034dad657fb1f7706e0550e962beeda73fdf

Maintenance freshness

7/18/2026

Usage

4 downloads · 59 views

File structure

📄 SKILL.md