This Week In React #270: Next.js, React Router, TanStack, Hermes-node и будущее JavaScript-экосистемы
Команда Software Mansion - Кшиштоф и Кацпер - подготовили свежую подборку ключевых событий в мире React и сопутствующих технологий. На этой неделе фокус смещается сразу в несколько направлений: стремительное развитие Next.js и альтернативных реализаций, расширение возможностей Hermes в сторону Node.js, эволюция инструментов маршрутизации, а также активное внедрение ИИ в разработку и тестирование.
---
Next.js под прицелом ИИ: как перезаписали фреймворк за неделю
Одно из самых обсуждаемых событий - эксперимент инженера из Cloudflare, который за одну неделю при помощи ИИ воспроизвел API-поверхность Next.js на базе Vite. В эту поверхность вошли:
- App Router
- React Server Components (RSC)
- Server Actions
- middleware
Проект получил название vinext. По сути, это "реинкарнация" Next.js, но на другом технологическом стеке - Vite плюс связка Oxc/Rolldown. Несмотря на экспериментальный характер, результат впечатляет:
- сборка выполняется примерно в 4,4 раза быстрее;
- итоговые бандлы получаются примерно на 57% меньше;
- пройдено более 2000 тестов;
- достигнуто около 94% покрытия API Next.js 16.
Особенно показательно, что vinext уже используется в бою: сайт государственного учреждения (cio.gov) работает на этом решении в продакшене. Помимо воссоздания текущего функционала, vinext привносит новые идеи, например концепцию "Traffic-aware Pre-Rendering" - предварительный рендер, учитывающий реальный трафик и паттерны поведения пользователей.
---
Почему этот эксперимент вообще стал возможен
Ключевой вывод из истории с vinext - значение хорошо описанного API и полноценного набора тестов. ИИ-системам удалось воспроизвести сложный фреймворк не по "магии", а потому что:
- API Next.js детально задокументирован;
- существует тщательный, богатый тестовый набор;
- поведение фреймворка описано не только словами, но и в виде проверяемых спецификаций.
Это отличный аргумент в пользу подходов, о которых много лет говорят сторонники TDD: основная ценность проекта - не только код, но и спецификация, тесты и архитектура API. В условиях, когда все больше программ пишется при помощи кодогенерации и агентов, именно тесты становятся "контуром реальности" для ИИ.
Неудивительно, что все чаще звучит мысль: многие проекты будущего будут начинаться с markdown-спецификаций, а реализовывать их станут кодовые агенты. Задача разработчика - продумать поведение, границы ответственности, контракты API и систему тестов, а не писать каждую строку вручную.
---
Закрытые тестовые наборы как новый "моат"
Параллельно обсуждается и потенциальный тренд: открытый исходный код, но закрытые тесты. Уже сейчас есть примеры, когда проект доступен для изучения и форков, но ключевой тестовый набор остается частным. Так делает, например, SQLite: код открыт, а подробный тестовый контур - нет.
С одной стороны, это защищает проект от легкого копирования и поверхностных форков. С другой - подчеркивает, что именно тесты являются главным активом, определяющим надежность и качество. В эпоху, когда ИИ может "переписать" большую часть публичного API за считанные дни, приватные тесты превращаются в реальное конкурентное преимущество.
---
Официальное оформление React Foundation
Еще одно важное событие - формальный запуск React Foundation. Это шаг в сторону более структурированного управления экосистемой React, координации усилий крупных компаний и сообщества вокруг развития ключевых библиотек и стандартов.
Зачем это нужно на практике:
- защита долгосрочного вектора развития React, независимо от интересов отдельных компаний;
- более прозрачное принятие решений и определение дорожной карты;
- возможность лучше синхронизировать развитие экосистемы (Next.js, React Native, инструменты маршрутизации, серверные решения).
Для разработчиков это означает, что ключевые решения вокруг будущего React и связанных технологий будут приниматься более системно и предсказуемо.
---
Документация Next.js с привязкой к версиям - важна не только для людей
Команда Next.js параллельно работает над версионированной документацией, которая "подстраивается" под конкретные версии фреймворка и API. Это критично не только для людей, но и для ИИ-агентов, которым приходится оперировать актуальной информацией:
- меняющиеся API;
- новые фичи;
- устаревшие паттерны и рекомендации.
Когда документация жестко привязана к версиям, уменьшается риск того, что и разработчики, и агенты будут использовать устаревшие подходы или неправильные сигнатуры. В перспективе это ускорит адаптацию к новым возможностям Next.js и снизит количество регрессий.
---
Hermes выходит за рамки мобильной среды: Hermes-node
На стороне React Native происходят не менее интересные изменения. Один из ключевых шагов - появление Hermes-node. Это CLI-вариант Hermes, ориентированный на запуск в среде, совместимой с Node.js API.
Главные особенности Hermes-node:
- выступает в роли совместимого слоя (compatibility layer) для Node.js;
- может использовать оригинальные реализации модулей Node.js без необходимости их переписывать;
- позволяет в буквальном смысле "поменять двигатель": вместо V8 под капотом - Hermes.
Если этот подход совместить с компиляцией Hermes в бинарный код, потенциальные выгоды для всей Node.js-экосистемы значительны: ускорение холодного старта, более предсказуемое потребление памяти, улучшения в сценариях, связанных с мобильной и встроенной средой.
---
Чем может быть полезен Hermes-node разработчикам
Для практикующих разработчиков Hermes-node открывает несколько направлений:
1. Эксперименты с производительностью
Можно сравнивать, как ведет себя один и тот же код на V8 и на Hermes, особенно в сценариях с ограниченными ресурсами или большим количеством короткоживущих процессов.
2. Унификация стека для мобильных и серверных решений
Когда веб и мобильный фронтенд уже используют Hermes (через React Native), перенос части бэкенд-логики на Hermes-node может упростить профилирование и оптимизацию.
3. Исследование будущего "многодвигательного" Node.js
Если идея взаимозаменяемых JS-движков для Node.js будет развиваться, Hermes-node может стать важным прецедентом и альтернативой V8 в ряде сценариев.
---
CSS Grid и TanStack Router на пути в нативный мир
В мобильной экосистеме на базе React Native продолжается движение в сторону более гибких и современных инструментов верстки и маршрутизации.
- CSS Grid для React Native
Появление поддержки CSS Grid обещает сделать нативную верстку гораздо ближе к привычному веб-опыту. Это особенно важно для команд, которые переносят дизайн-системы и UI-kit'ы из веба в мобильные приложения.
- TanStack Router с PoC на нативе
TanStack Router, уже успевший зарекомендовать себя в веб-проектах, получил ранний прототип, работающий нативно. Это усиливает тренд на единый подход к маршрутизации в разных средах: веб, мобильные приложения, десктоп.
Для больших команд, поддерживающих мультиплатформенные продукты, это означает уменьшение когнитивной нагрузки: можно придерживаться единой архитектуры маршрутизации и единых паттернов переходов.
---
Автоматизация форм на MUI: FormEngine Core
Разработчикам, которым приходится постоянно собирать сложные формы на базе MUI, стоит обратить внимание на FormEngine Core. Этот инструмент позволяет:
- описывать форму в JSON;
- генерировать интерфейс без глубокого погружения в React;
- использовать одну декларацию формы в разных проектах.
FormEngine Core особенно полезен для:
- бэкенд-ориентированных форм, когда логика приходит с сервера;
- многошаговых мастеров и сложных административных панелей;
- форм с богатой условной логикой, зависящей от введенных данных.
Будучи open-source и без привязки к конкретному вендору, инструмент хорошо подходит как для экспериментальных проектов, так и для корпоративных решений, где важно избежать жесткого vendor lock-in.
---
Тестирование без ручной рутины: автоматизированные E2E UI-тесты
Еще одна заметная линия тренда - отказ от ручного написания большого числа E2E-тестов. Крупные компании уже переходят к новому подходу, в котором:
- тестовый набор формируется и обновляется автоматически;
- покрытие приближается к "почти исчерпывающему", без пропуска критичных сценариев;
- участие разработчиков минимально, основная роль - корректно описать бизнес-логики и ожидания.
Инструменты наподобие решений от команды бывших инженеров Palantir работают как "фоновые агенты": наблюдают за поведением интерфейса, автоматически строят сценарии, воспроизводят пользовательские действия и фиксируют регрессии. В результате тесты становятся динамическими и эволюционируют вместе с продуктом.
Для команд это означает:
- меньше времени на рутину по поддержке тестов;
- выше стабильность релизов;
- возможность сместить внимание разработчиков от "как тестировать" к "что именно важно протестировать".
---
Где здесь место ИИ и как к этому готовиться
Практически все упомянутые тенденции - от vinext и Hermes-node до автоматизированного тестирования - завязаны на ИИ и автогенерации кода. Чтобы эффективно использовать эти возможности, командам стоит:
- инвестировать в качественные спецификации и тесты;
- строить архитектуру так, чтобы компоненты были хорошо изолированы и проверяемы;
- проектировать API с точки зрения понятности не только для людей, но и для агентов.
Разработка постепенно смещается от "писать код" к "описывать поведение и ограничения", а также к контролю качества результата. Те, кто освоит эти практики раньше остальных, смогут значительно ускорять поставку фич, не жертвуя стабильностью.
---
Итог: React-экосистема ускоряется, а роль разработчика меняется
Выпуск This Week In React #270 показывает, насколько быстро меняется пейзаж вокруг React, Next.js и Node.js:
- фреймворки могут быть "переписаны" ИИ за считанные недели при наличии хороших тестов;
- движки JavaScript больше не привязаны к единственной реализации - Hermes претендует на место рядом с V8;
- документы и тесты становятся ключевым артефактом проекта, а не побочным продуктом;
- инструменты маршрутизации, верстки и тестирования стремятся к единому, кроссплатформенному подходу.
Разработчикам стоит воспринимать эти изменения не как угрозу, а как возможность переопределить свою роль: меньше рутины, больше архитектуры, спецификаций и работы над качеством. Именно эти навыки будут задавать ценность специалиста в мире, где значительную часть кода пишут машины.
