Собираешь сайт через ИИ-агента - и он спрашивает: «Делаем на Astro или на Next.js?» От ответа зависит, сколько кода агент напишет, где ты будешь этот сайт хостить и сколько будет стоить его размещение. При этом оба фреймворка бесплатные, оба активно развиваются, и агент умеет работать с каждым. Вопрос в том, с чем потом жить.
Сайт на Astro я собирал сам и описал весь путь в отдельном гайде. Ниже - разница по-честному: для каких задач сделан каждый фреймворк, какой проще для ИИ-агента, во что выльется хостинг и как проверить выбор на своей задаче до того, как агент напишет первый файл. Версии и факты проверял 12 сентября 2026: актуальные на тот день - Astro 7.3.2 и Next.js 16.3.5. Фреймворки обновляются часто, так что цифры версий перед сборкой глянь ещё раз.
В Telegram-канале - что нового в вайб-кодинге: инструменты, находки, ошибки. Подпишись.
Так что выбрать: короткий ответ
Собрал рекомендации в таблицу. Найди свою задачу - ответ во втором столбце.
| Твоя задача | Что взять | Почему |
|---|---|---|
| Сайт-визитка, посадочная страница, страница услуги | Astro | Страницы отдаются готовым HTML, хостинг бесплатный |
| Блог, раздел статей, документация | Astro | Заточен под статьи, они пишутся в обычных файлах |
| Интернет-магазин с каталогом | Astro | Карточки - те же материалы; корзину подключаешь готовым сервисом. Своя серверная корзина - уже к Next.js |
| Личный кабинет, регистрация, профили | Next.js | Нужны вход по логину и серверная логика, у каждого пользователя своя страница |
| Сервис с динамическими данными (доска, CRM, панель) | Next.js | Это приложение, а оно и есть родная территория Next.js |
| Пока не знаю, вырастет ли сайт в сервис | Astro | Начать проще; переезд на Next.js возможен, но это переписывание |
Ниже разберу, откуда берётся эта разница.
Чем Astro и Next.js отличаются по назначению?
Разработчики Astro прямо в документации называют его фреймворком для сайтов, построенных вокруг материалов: блоги, маркетинг, интернет-магазины. А веб-приложения - админки, почта, соцсети, редакторы - называют территорией других фреймворков. Вот их формулировка:
Astro - веб-фреймворк для создания сайтов, чья главная ценность - материалы: блогов, маркетинговых страниц и интернет-магазинов. Больше всего Astro известен новой фронтенд-архитектурой, которая снижает объём и сложность JavaScript по сравнению с другими фреймворками. Если нужен сайт, который быстро грузится и хорошо виден поисковикам, - Astro для тебя. (перевод с английского)
Next.js описывает себя иначе:
Next.js - это React-фреймворк для создания полноценных веб-приложений. Пользовательский интерфейс ты собираешь из компонентов React, а Next.js добавляет возможности и оптимизации. (перевод с английского)
Из этих двух фраз следует почти всё дальнейшее. Сайт, который «показывает» - визитка, блог, каталог - это про Astro. Сайт, который «делает» - кабинет, сервис, панель управления - это про Next.js.
Как устроен сайт на Astro?
Разработчики называют это островной архитектурой. Страница - статичный HTML, а интерактивные детали «всплывают» на ней отдельными островами: здесь оживает форма заявки, там галерея фото. Всё остальное - обычная страница без JavaScript вообще. Так прямо и написано в документации: «Zero JS, by default», ноль JavaScript по умолчанию.
Для владельца сайта это значит три вещи:
- Скорость. JavaScript посетителю по умолчанию не грузится вовсе. Итоговая скорость всё равно зависит от картинок, шрифтов и сторонних виджетов, но тяжёлого кода ты сюда не добавляешь.
- Простота. Файл страницы в Astro похож на обычный HTML с вставками. Меньше слоёв - меньше настроек, которые нужно держать в голове.
- Свобода с интерактивом. Островок можно писать на React, Preact, Vue, Svelte или Solid - Astro поддерживает основные библиотеки. Но для визитки и блога чаще хватает вообще без них.
Про сам инструмент у меня есть отдельный разбор что такое Astro и зачем он нужен для сайта с ИИ, а полный путь сборки - в гайде как сделать сайт на Astro через Claude Code.
Как устроен сайт на Next.js?
Документация Next.js прямо говорит, что до старта от тебя ждут знакомства с HTML, CSS, JavaScript и React. То есть порог входа выше. Сложность сказывается и на работе агента: чем запутаннее устройство проекта, тем больше у него шансов ошибиться в настройках рендеринга и кэширования. У Next.js внутри живут сразу два маршрутизатора: App Router - новый, с Server Components, и Pages Router - старый, но поддерживается. Материалы в сети перемешивают оба, так что для нового проекта сразу скажи агенту, какой маршрутизатор использовать.
Зато на Next.js делают серверную логику, которая сайту с материалами даром не нужна: собирать страницу под каждого посетителя, держать вход по логину и сессии, отдавать данные через свои адреса API. Если сайт - это сервис, где у каждого пользователя свой экран, вся эта машинерия работает на тебя.
Что проще для ИИ-агента?
У Astro есть официальный MCP-сервер документации: бесплатный, работает удалённо. Сам сервер ставить не нужно - ты подключаешь его адрес в настройках агента, и тот начинает читать актуальную документацию Astro вживую. Без него агент советует по памяти, а его память устаревает. Разработчики Astro прямо пишут, что ИИ-инструменты часто советуют старые способы, и MCP-сервер сделан именно против этого.
Next.js отвечает тем же по-своему: вся документация лежит в машиночитаемом формате по адресу /docs/llms.txt. Передай этот адрес агенту перед работой.
Так что «агент не знает фреймворк» - не аргумент ни в одну сторону. Аргумент - в объёме. Сайт-визитка на Astro - это несколько файлов с почти чистым HTML. Тот же сайт на Next.js - React-компоненты, выбор маршрутизатора, решения про режим рендеринга. В статическом проекте на Astro меньше движущихся частей, его проще проверить сейчас и проще понять через полгода.
Выбор фреймворка - одно решение из десятков на пути «сайт собирает ИИ». Правильно выбранный фреймворк - только часть дела: есть ещё связка того, как ты ставишь задачи, хранишь знания о проекте и управляешь контекстом. На практикуме за три вечера разбираем её целиком: ИИ-клон + Второй мозг + Контекст-инжиниринг.
Где хостить и сколько это стоит?
Статика - это когда сайт собран один раз и дальше лежит готовыми файлами. Такому сайту не нужен «работающий сервер», нужно место, откуда файлы раздают. Это самый дешёвый вид хостинга в принципе: на дату написания GitHub Pages и Cloudflare Pages раздают статику бесплатно. Любой простейший VPS с такой раздачей тоже справится, правда веб-сервер на нём придётся настроить. Свой сайт на Astro я именно так и выкладывал - путь от пустой папки до бесплатной публикации описан в гайде про сборку сайта на Astro через Claude Code.
В полном серверном режиме Next.js устроен иначе: ему нужен процесс Node.js, который живёт на сервере постоянно и собирает страницы на лету. Варианта два. Первый - свой сервер: VPS, где агент поднимет Node.js и будет держать сайт. Второй - платформа Vercel от создателей Next.js: публикация там проще всего, но тарифы, лимиты и условия для коммерческих сайтов проверяй на день запуска - они меняются. И отдельно реши, как будешь платить зарубежному сервису из России, - этот момент мы в материале специально не проверяли.
У Astro тоже есть серверный режим и адаптеры под Node, Vercel и Cloudflare - на случай, если страницы надо собирать в момент запроса. То есть выбор Astro сегодня не закрывает динамику навсегда. Но как только серверного становится много, честнее смотреть на Next.js.
Когда Next.js действительно нужен?
Проверка простая. Представь двух посетителей, которые открыли твой сайт в одну секунду. Если оба видят одно и то же - у тебя сайт с материалами, и Next.js будет лишним усложнением. Если каждый видит своё - баланс, заказы, переписку - у тебя приложение, и тут Next.js на месте. Это первый признак из нескольких: дополнительно прикинь, нужны ли свои логины, серверные операции и обновление данных в момент запроса.
Вторая причина - команда. Если проект будет развивать программист, заранее спроси, с чем он работает: знакомство с React - аргумент в пользу Next.js. Для сайта, который ты ведёшь силами одного агента, этот аргумент не работает. Для проекта, который вырастет в продукт со штатом, - работает.
Как проверить выбор на своей задаче?
Порядок такой:
- Выпиши страницы будущего сайта: главная, услуга, блог, статья, контакты - или кабинет, заказы, оплата.
- Отметь те, где каждый посетитель видит своё. Ноль таких страниц - бери Astro. Если такие страницы - ядро продукта, смотри на Next.js. Одну-две личные функции сайту с материалами можно прикрутить и на Astro: через серверный режим или внешний сервис. Только посчитай заранее, во что это выльется: серверный режим - это адаптер и серверный хостинг, а внешний сервис - счёт и чужие данные в чужих руках.
- Попроси агента собрать одну типичную страницу и посмотри на результат: сколько файлов получилось, понимаешь ли ты, что в них написано.
- Спроси агента, как он предлагает хостить проект, и посчитай цену в месяц до старта.
Последний пункт чаще всего всё и расставляет по местам. Когда смета хостинга озвучена, выбор между «бесплатная статика» и «сервер с Node.js» перестаёт быть вопросом вкуса.
Частые вопросы
Можно ли потом переехать с Astro на Next.js?
Можно, но по сути это переписывание проекта: разметку и тексты перенесёшь, а устройство страниц придётся собирать заново. Поэтому шаг с пробной страницей из раздела выше - не формальность.
Что выбрать для интернет-магазина?
Каталог и карточки товара - те же материалы, их Astro делает отлично. Корзину и оплату подключаешь готовым сервисом или виджетом. Если магазин вырастает в маркетплейс с личными кабинетами продавцов - это уже приложение, и смотри на Next.js.
А что вообще такое «фреймворк» и почему агент сам не решит?
Фреймворк - готовый каркас сайта: набор правил и деталей, из которых агент собирает страницы. Агент соберёт на любом, куда пошлёшь. Но жить с последствиями - хостингом, ценой, поддержкой - тебе, поэтому последнее слово за тобой.
Источники
Выбор инструмента - одно решение из десятков. Полная схема работы над проектами с ИИ - на практикуме: ИИ-клон + Второй мозг + Контекст-инжиниринг. Три вечера, записи эфиров в личном кабинете, доступ 30 дней.
Новые материалы - дайджестом, без спама
Гайды выходят регулярно. Подпишись, чтобы не пропускать: пришлю подборку в Telegram или на email. Раз в неделю или каждый день - выбираешь сам.
