About five months after the first main version, the web framework Astro is available in version 2.0. The framework, designed for speed, aims to accelerate again in this version by introducing hybrid rendering as a mixture of static and dynamic content. The biggest innovation, however, is said to be a new API that is intended to ensure type safety in Markdown and MDX files. According to the Astro team, it is the first major web framework to open up this possibility.
Type safety for Markdown and MDX
The new major version 2.0 introduces the Content Collections API, with which files in the Markdown markdown language and the Markdown format MDX can be divided into different collections such as "blog" or "newsletter" sort. These content collections provide built-in type safety. A content collection is any directory within the designated src/content project directory. A content entry can be saved as a Markdown file (.md) or as an MDX file (.mdx).
Content Collections in Astro 2.0.
Astro is supposed to take care of schema validation, informative error messages, inline type errors, automatically generated types and auto-completion in the content collections. A blog entry goes into detail on the innovation, which should be a “game changer” for those who use Markdown on the web. Astro is used for the content schemes to the TypeScript library Zod return.
Hybrid rendering for faster websites
After Astro has so far offered the choice between Server-side Rendering (SSR) and Static Site Generation (SSG), version 2.0 should both worlds merge through hybrid rendering. According to the Astro team, static websites offer high performance at the expense of the ability to generate HTML on-demand for each request. This is where hybrid rendering comes into play, as it allows certain pages to be pre-rendered without giving up the deployed server. Pages rendered this way are ahead-of-time, so requests load immediately.
Astro 2.0 introduces Hybrid Rendering.
To enable hybrid rendering, pre-rendering can be enabled for each page and server endpoint. The files are rendered statically at build time, which is equivalent to the default static outputmode should resemble.
The organizers heise developer, iX and dpunkt.verlag judge on February 15, 2023 enterJS Web Performance Day the end. Participants get to know state-of-the-art tools for more speed. Performance experts show in seven online lectureshow to speed up web applications. There are deep dives into Angular and JavaScript in 2-day workshopswhich also take place online.
Attention-grabbing islands
Astro uses the concept of Astro Islands: breaking up a website’s user interface (UI) into smaller, isolated components. Rendering these interactive islands on an otherwise static HTML page can be done with React, Vue, or Svelte, for example. Astro garnered attention, among other things, as one of the most notable projects in last year’s “JavaScript Rising Stars” study. This year, it made the leap from 31st place to the top 10.
Under the hood, the new release updates the dependency Vite.js, which is behind Astro’s internal build engine, to the current version 4.0. In addition, the development team presented a new public roadmap.
The innovations in the second major version presents the Astro team in a blog entry.
(May)
