Astro или Next.js: выбор стека для маркетингового сайта

2 мин чтения

Мы создаём маркетинговые сайты на Astro или Next.js, и выбор одного из них — одно из первых технических решений, которые мы принимаем. Оба инструмента превосходны. Просто они созданы для разных задач.

Главный вопрос: насколько это приложение?

Маркетинговый сайт — это в основном контент: страницы, которые выглядят одинаково для каждого посетителя и меняются только тогда, когда их кто-то редактирует. Приложение — это в основном взаимодействие: панели управления, аккаунты, вещи, которые меняются для каждого пользователя и при каждом клике.

Astro создан для первого. Next.js создан, чтобы масштабироваться во второе. Сделать правильный выбор — значит честно ответить, что именно вы создаёте.

Astro: контент в первую очередь, ноль JavaScript по умолчанию

Astro рендерит ваши страницы в статический HTML и не отправляет ни строчки JavaScript, пока вы сами этого не попросите. Интерактивные элементы — меню, форма, карусель — становятся небольшими «островками», которые гидратируются самостоятельно, а всё вокруг остаётся обычным HTML.

Для маркетингового сайта это и есть правильное значение по умолчанию. Именно поэтому этот сайт построен на Astro. Страницы загружаются быстро, Core Web Vitals остаются зелёными без борьбы, а клиентского кода, замедляющего телефон, намного меньше. Когда бо́льшая часть страницы — это слова и изображения, отправлять мегабайт фреймворка ради их отображения — это налог без всякой выгоды.

Next.js: когда сайт на самом деле приложение

Next.js — это React-фреймворк, и React оправдывает свой вес, когда интерфейс действительно похож на приложение — тяжёлое клиентское состояние, данные в реальном времени, сложные формы, которые общаются друг с другом, авторизованная зона, которая по сути является продуктом.

Если ваш «маркетинговый сайт» включает конфигуратор, личный кабинет или раздел, который вырастет в SaaS-продукт, Next.js перестаёт быть накладными расходами и становится рычагом. Вы платите не за интерактивность, которой не пользуетесь, — вы её используете.

Как мы принимаем решение на практике

Несколько вопросов в большинстве случаев всё решают:

  • Это в основном контент, редактируемый в CMS? Astro.
  • Нужна ли авторизованная зона с состоянием, похожая на приложение? Next.js.
  • Является ли производительность на среднем телефоне жёстким требованием? С Astro это легко; с Next.js — возможно, но требует больше внимания.
  • Вырастет ли это в продукт в течение года? Стройте на том стеке, который понадобится продукту.

Оба варианта работают с headless CMS, так что ваша команда редактирует контент одинаково в любом случае. Решение зависит от того, что сайт должен делать, а не от того, что сейчас в моде.

Неправильная причина для выбора

Неправильная причина — это разработка ради резюме: выбор более тяжёлого инструмента только потому, что его все упоминают. Лендинг, отрендеренный через полноценное React-приложение, не становится более совершенным; он просто медленнее — и без всякой пользы. Хорошая инженерия — это во многом умение понять, когда более простой инструмент является правильным.

Если вы взвешиваете возможность пересборки и не уверены, по какую сторону этой линии находитесь, расскажите нам, что должен делать сайт — и посмотрите работы, которые мы выпустили на обоих стеках.