Бета-релиз Astro 1.0

Автор
Nate Moore
Fred Schott

Бета Astro 1.0 доступна! Релиз означает стабилизацию всех основных API — крупных breaking changes до официального v1.0 не планируется.

Также мы рады объявить: официальный Astro v1.0.0 выйдет 8 июня 2022. Следующие два месяца — документация, исправления, обратная связь и финальные улучшения Astro.

Мы благодарны за поддержку Astro. Тысячи разработчиков — включая команды Firebase, Trivago и The Guardian — уже используют Astro в production. Если ждали — сейчас лучшее время начать.

Посетите astro.new для beta Astro v1.0 в браузере. Или npm init astro локально. См. Getting Started и Migration.

В честь релиза — фон Astro и 3 ключевых принципа:

Background

Десятилетие инструменты оптимизировали один тип проектов — JavaScript приложения, обычно SPA. SPA-фреймворки изменили разработку и доминировали в вебе.

Но даже лучшие SPA имеют компромиссы, бессмысленные для менее stateful контентных сайтов. Thoughtworks Technology Radar сказал лучше всех:

«Слишком часто [мы видим команды], слепо принимающие сложность SPA по умолчанию, даже когда бизнес-задачи этого не оправдывают.» — Thoughtworks Technology Radar

Это заставило задуматься: как выглядел бы фреймворк для контентных сайтов? Как инструмент с приоритетом производительности изменил бы подход? Отказавшись от идеи, что SPA всегда лучше, можем ли мы двинуть веб вперёд, как JSX почти 10 лет назад?

Ответы мы нашли в Astro.

1. Great web performance should be the norm, not the exception.

В Astro должно быть невозможно (или очень сложно) построить медленный сайт.

По умолчанию Astro помогает строить сайты с нулём JavaScript в браузере. Встроенный синтаксис компонентов генерирует статический HTML, отправляя JS только для интерактивных частей. Вы удивитесь, как мало JavaScript нужно на первом Astro-сайте.

Astro также позволяет принести свой фреймворк. React, Svelte, Vue, Solid и популярные UI-фреймворки поддерживаются. Можно смешивать компоненты, сохраняя автоматическое сокращение JS. Статический компонент — Astro убирает JS и отправляет HTML.

Этот подход (partial / selective hydration) открывает тонкую оптимизацию. Компоненты загружаются и гидратируются индивидуально:

<!-- client:load -- high priority, load this component on the page ASAP -->
<MyCriticalBuyButton client:load />
<!-- client:visible -- low priority, only load when visible on the page -->
<MyHeavyReactImageCarousel client:visible />

Такой контроль крайне сложен в SPA вроде Next.js или SvelteKit — уникален для Astro.

2. Simple, straightforward APIs are our superpower.

Синтаксис Astro прост — любой может освоить независимо от опыта. Знакомо, если вы из JS-фреймворка, backend или HTML/JS.

Главное: синтаксис компонентов Astro — надмножество HTML. Валидный HTML — валидный Astro-компонент. Нет render functions, JSX return, hooks. Вообще нет JavaScript!

<!-- This is a valid Astro component! HTML is the best :) -->
<p>Hello, World!</p>

Удивитесь, как далеко можно зайти только на HTML!

С опытом — динамический шаблонинг с JSX-подобными выражениями и props. Frontmatter для server-side кода рядом с шаблоном:

---
// Run JavaScript code in your component frontmatter.
// This all runs at build time, so no JS on the client!
const message = "Hello, " + Astro.props.name
---
<p>{message}</p>

Остальной Astro так же прост: Web Standard APIs, fetch() с top-level await, явный ESM import вместо неявного data waterfall.

3. The web deserves a framework-agnostic foundation.

Astro поддерживает React, Vue, Svelte, Solid, Preact, Lit. Framework-agnostic дизайн — мы учитываем это при каждой новой функции.

Пример: SolidJS в 2021 без full-stack фреймворка вроде Solid Start. Solid в проекте — но многие инструменты требуют полной переписи на Solid-совместимый фреймворк.

Framework lock-in — проблема, особенно в крупных организациях. В open source lock-in мешает новым фреймворкам вроде SolidJS.

Astro полностью framework-agnostic. Фокус — лучший фундамент для долгосрочных проектов с гибкостью смены технологий. Google может стандартизировать инфраструктуру на Astro, давая командам выбор UI-фреймворка.

Строите новый UI-фреймворк — рассмотрите поддержку Astro при запуске.

What’s Next for Astro?

На этой неделе Launch Week в Astro HQ — ещё анонсы.

  • Вторник, 5 апреля: Going Beyond Static Sites
  • Среда, 6 апреля: Themes, Components, Integrations
  • Четверг, 7 апреля: Contributor Day
  • Пятница, 8 апреля: Recap (and one more thing…)

Далее — public roadmap к v1.0.0 8 июня 2022! 🎉

Обратная связь — GitHub и Discord.