cordiverse/cordis: когда метафреймворк начинает управлять пространством и временем

Первый контакт: что вообще происходит?

Когда в моём feed’е всплыл cordis с пометкой “spatiotemporal composability”, я ожидал увидеть очередной state-менеджер с прикрученным хукастиком. Но после 15 минут ковыряния в примерах стало ясно — это попытка переосмыслить не столько управление состоянием, сколько саму природу компонентности. Вместо привычного “компонент = функция + состояние” здесь предлагают мыслить в терминах пространственных и временных контекстов.

Spatiotemporal composability на практике

Гвоздь концепции — composable contexts. В отличие от React Context, который живёт в иерархии компонентов, cordis предлагает контексты, которые:

1. Пространственно композитны — могут наслаиваться друг на друга как SVG-фильтры
2. Временно композитны — управляют своим жизненным циклом через временные границы (temporal boundaries)

Простой пример с анимацией:

const { useTemporal } = require('cordis');

function AnimatedBox() {
  const { within } = useTemporal();
  
  return within(
    { duration: 1000 },
    () => <div className="box fade-in" />
  );
}

Здесь within создаёт временной контекст, который автоматически размонтируется через 1000 мс. Но главное — такие контексты можно вкладывать и комбинировать, создавая сложные временные последовательности без ручного управления таймерами.

Где это ломает мозг по-хорошему

1. Форма за фасадом: под капотом cordis использует граф зависимостей, который пересчитывает только те контексты, чьи пространственные или временные зависимости изменились. Нет лишних ререндеров — только необходимые обновления.

2. Эффекты становятся декларативными: вместо useEffect с ручной чисткой вы описываете временные интервалы как условия:

within({ until: event }, () => {
  // этот блок автоматически уберётся после event
});

3. Тестирование через time travel: поскольку все временные зависимости явные, в тестах можно двигаться по временной шкале, как в Redux DevTools, но для всего приложения.

Где можно обжечься

1. React-подобный ≠ React: хотя API выглядит знакомым, ментальная модель другая. Особенно больно переучивать привычку “заворачивать всё в useEffect”.

2. Bundle size: на текущий момент +18kb gzipped за все эти магические зависимости. Для лёгких SPA может быть overkill.

3. Debugging: стек вызовов в DevTools иногда выглядит как сюрреалистичный коллаж из-за преобразований графа.

Для кого этот хайп

Если вы:

• Уже чувствуете ограничения Context API для сложных асинхронных сценариев
• Работаете с интерактивными анимациями или real-time данными
• Хотите попробовать post-React архитектуру без ухода в Solid.js/Svelte

…то cordis стоит потраченных на разбор 2-3 часов. Лично я вынес из этой пробы главное: будущее фронтенда — не в “ещё более реактивных” фреймворках, а в более явном управлении пространственно-временными зависимостями.

P.S. Если после прочтения документации у вас зачесались руки переписать свой pet-проект — не сопротивляйтесь. Это нормально.

Источник: https://github.com/cordiverse/cordis