Войти
Креативная библиотека
Креативный timeline · theatre

Theatre.js

Визуальный timeline для сложных креативных сцен

Tier 3ТяжелоОсторожно на мобилеfree (core)JS + Three/R3F часто

Design DNA

«Анимация как в motion-design tool: ключи, кривые, режиссура.»

Use with AI

Скопируй промпт и отдай агенту. Он реализует решение в твоём стеке — не копирует чужой код.

Оцени, нужен ли Theatre.js. Если да — минимальная сцена с timeline.
Иначе предложи GSAP. Документируй почему выбран Theatre.

Что умеет

  • ·Visual studio для анимации
  • ·Связка с Three/R3F

Чего не умеет

  • ·Оверкилл для простого UI

Когда брать

  • ·Сложная мультиобъектная сцена

Когда не брать

  • ·Простой лендинг → GSAP/Motion

С чем сочетается

R3FThree.jsdrei

Альтернативы

GSAP timelinesAfter Effects → Lottie

Типичные ошибки

  • ·Внедрять Theatre «потому что круто»
  • ·Не проверил производительность на iPhone SE. WebGL и AI-модели могут убить батарею или вызвать краш. Всегда делай фоллбэк на статику через matchMedia или детект мощности устройства.

Демо и ссылки

theatrejs.com

Похожие

GSAP
Движок плавной анимации для сайтов — от кнопок до scroll-фильмов
GSAP ScrollTrigger
Плагин GSAP, без которого не бывает scroll-фильма
Lenis
Мягкий «масляный» скролл — фундамент под GSAP и WebGL
Lenis + ScrollSmoother
Связка мягкого скролла и GSAP-параллакса уровня Awwwards