SQRD
Night view of stars from Vancouver
Empty space.

Astro, first test

Another framework to build a static website. Astro tickle our interest with three interesting features that it mixes.

Astro coined the island architecture and so components on a page are only consuming resources when they are needed. We can pick the component activation on page load, when it becomes visible or when the browser is idle.

Astro has ist own component syntax but also support React, Vue and Svelte components. We can integrate components from different projects on this site building.

There is no Javascript involved while loading the page. At first the browser loads plain old HTML and then the page gets to life with partial hydration.

This way, core vitals are optimized from the start and navigating the website is a flawless experience.

Alternatives

Before opting to try Astro we used Vercel with Next.JS to build Mac2Sell with around 200k pages. Loading pages on Vercel has been daunting and we faced multiple limitations.

Two years ago we also tried Netlify with Gridsome. At that time Gridsome lacked features that could easily be found on Gatsby. The development has been slow and the Netlify CMS was difficult to use for an end user.

Results: promising

Astro component syntax is very close to React and it was easy to create new pages. The out of the box Tailwind CSS integration also helped.

Pinpointing an error is not yet easy but we manage to find out way around. We used that old method of commenting out some blocks.

The navigation is built out of Tailwind UI Vue components and works decently.

The build time of sqrd.com is around 5 seconds. For 120 pages this is fair result.

We intend to continue trying Astro. We are waiting for a