animejs
결정적 Anime.js HyperFrames 만들기
Anime.js 애니메이션은 자체 시계로 실행될 때 드리프트가 발생할 수 있습니다. 이 스킬은 애니메이션을 등록하고 런타임 어댑터를 통해 seek하는 결정적 HyperFrames 패턴을 보여줍니다.
내 에이전트로 설치
이 요청을 에이전트에 복사하세요. 공식 Skill 페이지와 매니페스트가 포함되어 있습니다.
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.에이전트는 계속해서 계획을 표시하고 보안 정책에서 요구하는 확인을 요청해야 합니다.
에이전트가 읽기 쉬운 리소스
AI 에이전트, 크롤러, 스크립트가 전체 페이지 대신 정리된 컨텍스트만 필요할 때 이 링크를 사용하세요.
테스트해 보기
"animejs" 사용 중입니다. HyperFrames에서 제목과 강조선을 애니메이션화해 달라는 요청.
예상 결과:
autoplay가 비활성화되고, 유한한 durations를 사용하며, window.__hfAnime에 명시적으로 등록하는 결정적 타임라인 계획.
"animejs" 사용 중입니다. 문서에서 복사한 Anime.js 브라우저 예제.
예상 결과:
동기적으로 초기화되고 HyperFrames clock으로 제어할 수 있는 렌더링 안전 적용 예시.
"animejs" 사용 중입니다. timers와 무한 루프에 의존하는 컴포지션.
예상 결과:
비결정적 애니메이션 패턴을 식별하고 유한한 seek 기반 대체안을 제안하는 검토 요약.
보안 감사
안전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.
기능 검토 항목 (2)
이 스킬에 대해 예상될 수 있는 실제 로컬 기능이므로 검토가 필요하지만, 확인된 악의적 동작으로는 집계되지 않습니다.
위험 요인
⚙️ 외부 명령어 (17)
🌐 네트워크 접근 (3)
이 보고서 공유 및 인용
버전이 지정된 평가 보고서, 중립 배지, 임베드 카드 및 인용을 공유하세요. Skillstore는 근거를 보고하지만 이 Skill의 안전 여부를 판단하지 않습니다.
보고서 링크 복사
https://skillstore.io/skills/heygen-com-animejs/audits/6?utm_source=security_passport&utm_medium=share&utm_campaign=versioned_reportMarkdown 배지
[](https://skillstore.io/skills/heygen-com-animejs?utm_source=security_passport_badge)HTML 배지
<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>임베드 카드
<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>학술 인용 (APA · BibTeX · CFF)
APA 인용
heygen-com. (2026). animejs security audit report (audit version 6) [Author version unspecified]. Skillstore. https://skillstore.io/skills/heygen-com-animejs/audits/6BibTeX 인용
@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 점수
이 점수의 이유 증거 신뢰도: 높음만들 수 있는 것
Anime.js 예제 변환
기존 Anime.js 샘플을 조정하여 HyperFrames가 이를 결정적으로 seek할 수 있게 합니다.
타임라인 마이크로 애니메이션 제작
HyperFrames 런타임에 등록되는 간결한 DOM 또는 SVG 장식을 만듭니다.
렌더링 안전성 검토
컴포지션에서 autoplay, 무한 루프, async setup, 시드 없는 랜덤성을 확인합니다.
이 프롬프트를 사용해 보세요
animejs 스킬을 사용하여 내 HyperFrames 컴포지션에 간단한 seek 기반 Anime.js 애니메이션을 추가하세요.
animejs 스킬을 사용하여 이 Anime.js 예제를 렌더링 안전 HyperFrames HTML로 변환하세요.
animejs 스킬을 사용하여 유한한 Anime.js 타임라인을 만들고 window.__hfAnime에 등록하세요.
animejs 스킬을 사용하여 내 컴포지션에서 autoplay, async setup, timers, 비결정적 애니메이션 상태를 검토하세요.
모범 사례
- 컴포지션 초기화 중에 애니메이션을 동기적으로 생성하세요.
- autoplay를 false로 설정하고 모든 인스턴스를 window.__hfAnime에 등록하세요.
- 컴포지션 duration과 일치하는 유한한 durations 및 loop counts를 사용하세요.
피하기
- HyperFrames 렌더링에 Anime.js autoplay에 의존하지 마세요.
- timers, promises, events 또는 async asset loads 이후에 애니메이션을 생성하지 마세요.
- 명시적 등록 대신 anime.running 자동 검색에 의존하지 마세요.
자주 묻는 질문
이 스킬은 무엇을 만드는 데 도움이 되나요?
HyperFrames에서 GSAP을 대체하나요?
왜 autoplay를 비활성화해야 하나요?
window.__hfAnime는 무엇에 사용되나요?
ES module imports를 사용할 수 있나요?
변경 사항은 어떻게 검증해야 하나요?
개발자 세부 정보
작성자
heygen-com라이선스
MIT
Skillstore 리비전
r1
버전 안내
작성자가 버전을 선언하지 않았습니다.
참조
0519034dad657fb1f7706e0550e962beeda73fdf
유지보수 최신성
2026. 7. 18.
사용량
4 다운로드 · 59 조회
파일 구조
📄 SKILL.md