Introduction to Astro

Fast website loading time

Astro builds static sites by default. Static sites load quickly because of their reduced size and because they can be displayed without executing frontend code, as is the case for, e.g., React applications.

Faster loading websites are a significant benefit because they are more easily accessible with weaker mobile networks, and secondly, they achieve a much better SEO score, which leads to improved search engine ranking.

Easy to use

The learning curve of Astro is very low, compared to other frameworks for building static sites.

You can simply add your pages in the pages directory as an Astro file, Markdown file, HTML file, or many other alternatives, and render the page with a simple command.

There are many more possibilities to adapt the page as you want, such as:

• Loading pages dynamically from a content source

• Modifying images before deploying

• Adding client-side code using a framework you like, such as Vue or React

And all of it is very well documented on the Astro page.

Framework agnostic

Some people prefer to write code in Vue, and some people prefer to write code in React. Or maybe you want to write a simple blog post using Markdown.

Astro is framework-agnostic, which means it runs with many different frameworks you can select from. And you can select it per file.

For example, you can write your pages as MDX files, but when things get more complex, you can create a Vue component and just use it.

Frontend logic by choice

By default, all the logic will be executed while building the static site. But when adding components, you can choose to execute this component on the client instead. You have options, e.g., to execute it as soon as it becomes visible, or when the page is loading.

You tell Astro what you want, and Astro adds the code accordingly.

Good SEO score

As previously mentioned, because of how the result is built, your SEO values become quite good.

• The page is loading quickly

• You have no cumulative layout shifts because everything is already in place

• Your JS loading time is low, because you only run what you really need

It is also very easy to add SEO-specific files like a sitemap.xml or a robots.txt to your build, so they become automatically generated depending on your content.