Astro 2.0

Por
Fred Schott

¡Presentamos Astro 2.0! Astro es un framework web popular para construir sitios web orientados al contenido y de alto rendimiento. Nuestra arquitectura frontend de nueva generación (conocida como Astro Islands) puede optimizar tu sitio para que cargue un 33% más rápido con 90% menos JavaScript usando los frameworks de UI que ya amas como React, Svelte, y Vue.

Astro 2.0 es el primer framework web importante en ofrecer type-safety completa para Markdown y MDX. Astro ahora te ayuda a organizar tu Markdown con parsing integrado, validación, y generación automática de tipos TypeScript. Este nuevo lanzamiento es un cambio radical para cualquiera que trabaje con Markdown en la web.

La lista completa de destacados del lanzamiento incluye:

Astro 2.0 está disponible en npm hoy. Ejecuta npm i astro@latest para actualizar un proyecto existente, o visita astro.new para empezar uno nuevo desde cero (directamente en tu navegador).

Type-Safety Automática para Markdown y MDX

Astro 2.0 tiene como objetivo abordar un problema pasado por alto en el desarrollo web moderno: trabajar con Markdown/MDX es difícil.

Cuando tienes cientos de archivos diferentes — blog posts, newsletters, productos — puede ser imposible mantener la consistencia bajo control. Una propiedad de frontmatter faltante o mal escrita y ¡BOOM! Todo tu sitio web puede fallar con un error poco útil cannot read undefined que debes corregir.

Astro 2.0 reimagina la experiencia de desarrollador alrededor del contenido con nuestra nueva API de Content Collections. Organiza tus archivos Markdown y MDX en diferentes colecciones (como “blog”, “newsletter”, "products") y Astro se encarga del resto:

  • Schema validation
  • SEO best practices
  • Informative error messages
  • Automatic generated types
  • Errores de tipo en línea, autocompletado y más!

Para aprender más sobre content collections, revisa nuestro post destacado: Introducing Content Collections: Type-Safe Markdown in Astro 2.0.

Hybrid Rendering: Lo Estático Se Encuentra Con Lo Dinámico

Durante casi un año, Astro te ha permitido elegir entre salida de build estática (SSG) y de servidor (SSR). Los sitios web estáticos ofrecen un rendimiento increíble, pero carecen de la capacidad de generar HTML bajo demanda para cada petición.

Astro 2.0 reúne lo mejor de ambos mundos con Hybrid Rendering. El renderizado híbrido te da la opción de pre-renderizar ciertas páginas sin renunciar a tu servidor desplegado. El pre-renderizado construye las páginas con antelación para que todas esas peticiones carguen instantáneamente.

Mezclar contenido estático y dinámico juntos desbloquea posibilidades completamente nuevas para Astro, incluyendo:

  • Mejorar el rendimiento de renderizado de páginas populares
  • Mejorar el rendimiento de build de sitios grandes
  • Añadir una API a tu sitio estático existente

Aprende más sobre el renderizado híbrido en nuestra guía de renderizado del lado del servidor. Vuelve más tarde esta semana para un análisis aún más profundo del mundo del renderizado híbrido con Nate Moore.

Errores, Rediseñados

El overlay de errores es una de las piezas de UI más importantes que Astro incluye. Cuando algo sale mal, es lo primero que ves como desarrollador. Cuando vas a depurar un problema, a menudo es el primer lugar donde empiezas.

Astro 2.0 rediseña completamente la experiencia de errores con un nuevo y completo look-and-feel de Astro. Adicionalmente, el nuevo overlay de errores destaca más información que antes, como pistas útiles para resolver el error y un botón que salta a tu código en tu editor favorito.

Optimizaciones del Servidor de Desarrollo

Astro 2.0 destaca varios meses de inversión para mejorar el rendimiento y la fiabilidad del servidor de desarrollo de Astro, especialmente en torno al Hot Module Reloading (HMR).

Los usuarios de Astro se han beneficiado del lanzamiento incremental de estas mejoras durante los últimos meses, culminando en el lanzamiento de hoy. Astro 2.0 marca la primera vez que todas estas mejoras están disponibles juntas, en un solo lanzamiento.

Vite 4.0

Astro 2.0 incluye una actualización interna importante a una de nuestras dependencias internas más importantes: Vite.

Vite es una herramienta importante que impulsa el motor de build interno de Astro. Vite 4.0 – el último lanzamiento del equipo de Vite – incluye varias mejoras y correcciones de bugs importantes que benefician a todos los usuarios de Astro.

Algunas de estas mejoras en Vite 4.0 provienen de nuestro propio compañero de equipo Bjorn Lu, quien también es maintainer del proyecto Vite. Sus investigaciones para mejorar el rendimiento de Vite para Astro llevaron a varios pull requests a Vite 4.0, que ahora están disponibles para que todos los usuarios de Vite se beneficien. ¡Gracias, Bjorn!

La Hoja de Ruta Abierta de Astro

Por último pero no menos importante, estamos emocionados de lanzar oficialmente la nueva Hoja de Ruta Pública para Astro.

Astro siempre ha tenido un proceso RFC abierto. Cualquiera puede proponer una nueva idea para una característica, y nuestra comunidad se reunía para discutir esas ideas durante llamadas semanales en Discord.

En la práctica, sin embargo, nuestro proceso RFC no proporcionaba suficiente guía a los colaboradores. Los RFC son documentos largos y detallados que requieren considerable esfuerzo para crear. Algunos encontraban el proceso intimidante. Otros creaban RFCs solo para darse cuenta más tarde de que su idea no era factible. Ambos escenarios nos dejaban frustrados.

Nuestra nueva hoja de ruta aborda estas deficiencias bajando la barrera de entrada para nuevas ideas y propuestas. Las nuevas ideas pueden discutirse e incluso aceptarse (léase: priorizarse) antes de que se escriba un RFC formal. Los maintainers de Astro también darán guía incluso más temprano en el proceso, para ayudar a identificar problemas y discutir la prioridad de características.

Puedes leer más sobre nuestra nueva hoja de ruta en el repo withastro/roadmap. Si tienes una solicitud de característica para Astro, dirígete al repo para involucrarte.

Prueba Astro 2.0 Hoy

Astro 2.0 está disponible en npm hoy. Actualiza un proyecto existente ejecutando npm i astro@latest o comienza un nuevo proyecto de Astro directamente en tu navegador visitando astro.new.

¿Buscas más? Sintoniza un Twitter space especial esta tarde a las 12pm PST con CassidyWilliams! También puedes revisar estos increíbles videos y tutoriales del día de lanzamiento para aprender más: