Зміст
Коротко
На Dev.to автор описав міграцію особистого сайту з Next.js 15 (React 19, Framer Motion, GSAP) на Astro 6: для контентного блогу React-рантайм і гідратація виявилися зайвими — сторінка поста перестала відвантажувати JS у браузер.
Що сталося
v1 був «портфоліо-флексом»: анімації, dual design modes, markdown через content-collections, next-mdx-remote, react-markdown, starry-night. Коли фокус змістився на щотижневий блог, стало видно: ~180 KB framework + ~45 KB React + ~60 KB Framer Motion + ~30 KB GSAP — заради статичного тексту.
Next.js вміє SSG, але гідратує сторінки: браузер качає, парсить і виконує JS для абзаців і code blocks.
Astro за замовчуванням віддає HTML + CSS; JS лише там, де потрібна інтерактивність (islands). У автора на всьому сайті — маленький inline-скрипт для dark mode.
Міграція зайняла ~день: MDX-пости скопіювали, Tailwind v4 і теми зберегли, Shiki з коробки замість starry-night, View Transitions API замість Framer Motion.
Чому це важливо
Вибір фреймворку — не «Astro vs Next.js назавжди», а fit під задачу:
| Сценарій | Розумний вибір |
|---|---|
| SaaS, дашборди, e-commerce | Next.js / повноцінний React |
| Контентний блог, документація | Astro / аналоги zero-JS за замовчуванням |
Цифри зі статті: Lighthouse Performance 85–90 → 99–100, build ~15s → ~5s, залежності 30+ → ~10.
На практиці
- Оцініть, скільки JS реально потрібно на типовій сторінці блогу — якщо лише typography і підсвітка коду, React може бути надмірним.
- В Astro content collections і Shiki закривають 80% потреб без content-collections + rehype-ланцюжків.
- React-компоненти залишаються доступними через
client:loadдля рідких віджетів. - Не викидайте «шоу»-анімації портфоліо заради блогу — автор свідомо пожертвував morphing layout заради швидкості публікацій.
- Старий Next-сайт можна залишити архівом — міграція не зобов’язана бути «все або нічого».
Підсумок
Матеріал — здоровий framework fit: Next.js чудовий для застосунків, Astro — для контенту. Якщо ваша головна робота — віддавати markdown швидко, zero-JS за замовчуванням часто перемагає «бензопилу для масла».