Идеальный стек на ASTRO в 2026: Архитектура от блога до SaaS

Уникальность Astro в 2026 году — его невероятная эластичность. Вы используете его как простейший генератор статики (SSG) для личного портфолио, а можете развернуть на нем сложнейший SaaS с тысячами пользователей, PostgreSQL и продвинутым кэшированием.

Главная ошибка большинства разработчиков — выбирать архитектуру интуитивно, «на вырост» или, напротив, сильно недооценивать масштаб будущего проекта. В этой статье мы разберем идеальный стек для трех сценариев — чтобы вы не стреляли из пушки по воробьям и не строили небоскреб на фундаменте из спичек.

Как Astro выбирает режим рендеринга?

Прежде чем говорить о стеках, важно понять основной переключатель в файле astro.config.mjs:

// astro.config.mjs
export default defineConfig({
  output: 'static', // Уровень 1: Чистый SSG (по умолчанию)
  // output: 'hybrid', // Уровень 2: SSG + отдельные SSR-страницы
  // output: 'server', // Уровень 3: Весь сайт рендерится на сервере
});

Это единственный параметр, который определяет архитектурный «уровень» вашего Astro-проекта. Красота в том, что переключение между режимами — это одна строчка кода, а не переписывание проекта с нуля.

Уровень 1: Небольшой сайт (SSG)

Что строим: Личный блог, сайт-визитка, документация продукта, лендинг для стартапа или портфолио дизайнера.

На этом уровне главное — скорость разработки, нулевая стоимость поддержки и 100/100 баллов в Google PageSpeed. Никаких серверов и баз данных.

Технологический стек

Front-End:

• Astro (режим output: 'static'). Сборка чистых HTML-файлов в папку dist.
• Tailwind CSS для стилизации.
• Alpine.js или Vanilla JS для легкой интерактивности (мобильное меню, аккордеоны).

Данные:

• Локальные MDX-файлы в папке src/content/.
• Astro Content Collections + Zod для типобезопасной работы с контентом.
• При необходимости — Keystatic как визуальная CMS поверх Git-репозитория.

Хостинг:

• Cloudflare Pages, Vercel или Netlify — все на полностью бесплатных тарифах.

Аналитика:

• Umami (self-hosted на отдельном дешевом VPS) или облачная версия.

Почему эта комбинация идеальна

Сайт, собранный по этой схеме, физически невозможно взломать — там нет ни PHP, ни базы данных, ни серверных процессов, которые можно атаковать. Файлы просто лежат на CDN и раздаются пользователям.

Cloudflare Pages предоставляет 500 сборок в месяц бесплатно — этого хватит на любой контентный блог. При пиковом трафике («эффект Хабра») сайт не упадет: CDN просто будет отдавать закешированные HTML-файлы с тысяч серверов по всему миру одновременно.

Ориентировочная стоимость в месяц: 0 ₽ (или $0).

Уровень 2: Сайт покрупнее (Hybrid)

Что строим: Корпоративный портал, каталог товаров, небольшой интернет-магазин, внутренний дашборд для команды, SaaS с базовой авторизацией.

Здесь появляются данные, которые генерируют сами пользователи: заказы, комментарии, формы. Нам уже недостаточно просто статических файлов.

Технологический стек

Кэширование:

• Node.js in-memory кэш (например, библиотека node-cache) — для часто запрашиваемых данных.
• Astro Server Islands — отдельные части страницы рендерятся динамически, остальное отдается из статического кэша CDN.

Хостинг:

• Фронтенд (Astro): Vercel или Cloudflare Pages.
• Backend (PocketBase / Node.js API): VPS на Beget или Timeweb Cloud (от 500 ₽/мес) под управлением Coolify.

Пример: Гибридная страница с каталогом

---
// src/pages/catalog/[slug].astro
// Эта страница — статическая (SSG)
export const prerender = true;

import { getCollection } from 'astro:content';
export async function getStaticPaths() {
  const products = await getCollection('products');
  return products.map((p) => ({ params: { slug: p.slug }, props: { product: p } }));
}

const { product } = Astro.props;
---

<ProductCard product={product} />

<!-- Корзина — динамический React-остров, авторизованный SSR -->
<AddToCart productId={product.id} client:visible />

Ориентировочная стоимость в месяц: 500–2000 ₽ (за VPS для бекенда).

Уровень 3: Крупный сайт, SaaS-платформа (SSR)

Что строим: Полноценный онлайн-сервис (аналог Notion, Trello, Figma), крупный маркетплейс с тысячами товаров, социальная сеть, B2B SaaS.

На этом уровне каждый пользователь видит уникальный контент, данные меняются в реальном времени, а безопасность транзакций критически важна.

Технологический стек

Front-End:

• Astro (режим output: 'server') — весь сайт рендерится по запросу.
• React + Shadcn/ui для богатого, интерактивного интерфейса.
• TanStack Query для клиентской синхронизации данных и оптимистичных обновлений.

Кэширование (многоуровневое):

1. CDN-уровень (Cloudflare): Публичные страницы (главная, лендинги) кэшируются на Edge-узлах на 1-24 часа.
2. Серверный кэш: Результаты дорогих SQL-запросов кэшируются в Redis на 5-60 минут.
3. Клиентский кэш: TanStack Query кэширует данные в памяти браузера и обновляет их в фоне (stale-while-revalidate).

Backend:

• Выделенный Node.js API (Fastify или Hono) или Go для критичных микросервисов.
• Астро Endpoints (src/pages/api/*.ts) — для простых API-маршрутов без необходимости разворачивать отдельный сервис.

База данных:

• Строго PostgreSQL. В 2026 году предпочтение отдается Serverless PostgreSQL:
  • Supabase — PostgreSQL + авторизация + Storage + Realtime за одну подписку.
  • Neon — PostgreSQL с ветвлением БД (branching) прямо из CI/CD пайплайна.
  • Self-hosted PostgreSQL на отдельном VPS — для проектов с жесткими требованиями к локализации данных (152-ФЗ).

Безопасность:

• Lucia Auth или Auth.js для управления сессиями.
• Строгая CORS-политика на уровне API.
• SSL/TLS — само собой (Coolify выписывает сертификаты автоматически).

Хостинг:

• Astro-приложение: Cloudflare Workers (Edge SSR) или Docker-контейнер на мощном VPS через Coolify.
• PostgreSQL + Redis: Managed-сервис (Supabase/Neon) или self-hosted через Coolify.

Ориентировочная стоимость: от 3 000 до 30 000+ ₽/мес в зависимости от нагрузки.

Общие элементы идеального стека (все уровни)

Независимо от масштаба, в 2026 году следующие технологии стали стандартом де-факто для любого Astro-проекта:

Матрица выбора: Какой уровень нужен вам?

Итог

Выбирая Astro, вы не загоняете себя в рамки одной архитектуры. Вы можете начать проект как «Уровень 1» — с простыми MDX-файлами без единого сервера — а через год, когда придут инвестиции или аудитория, бесшовно перевести его на «Уровень 3», подключив PostgreSQL, Redis и серверный рендеринг. Всё это не потребует смены фреймворка: один параметр output в конфигурации — и архитектура меняется. Именно эта гибкость делает Astro лучшим выбором для старта любого проекта в 2026 году.