The New Server Islands of Astro and What They Are

Alberto Luna

Last update 5 months ago

5 minutes

Astro

If you already know Astro, you'll know that it's a modern framework for building websites, designed to be fast, simple, and scalable.

One of the most outstanding features of Astro are the "islands", a technology that it has popularized, allowing pages to be surprisingly fast thanks to their limited interactivity to certain areas.

However, these traditional "islands" had a drawback: they loaded on the client. This worked well for static sites without a backend, such as blogs or portfolio pages, but it became complicated for sites that required dynamic backend content, such as e-commerce.

This is where Server Islands become an ingenious solution, maintaining the same concept of traditional "islands" but with the ability to process code from the backend.

How do they work and when can I use them?

Astro Server Islands Excalidraw

Source:

Astro

Server Islands can process backend code on the server side. The great thing is that you can have multiple islands without having to wait for them to load for the content to render. Astro takes care of rendering them on the server and sending them to the client.

It's important to note that Server Islands are very useful for dynamic content that doesn't change frequently. For example, they may not be the best option for content that is constantly updated, such as a social network.

Currently, this feature is in beta, but you can try it experimentally in the Astro 4.12 version, which has not yet been officially released.

How similar are Astro's Server Islands to Next.js's PPR?

Astro = Next.js

Source:

Luna News

Astro's Server Islands are similar to Next.js's PPR (Partial Pre-rendering), as both technologies allow content to be rendered on the server and sent to the client. However, Astro's Server Islands are easier to implement and, in some benchmarks, have been shown to be faster than Next.js's PPR.

Conclusion

Astro's Server Islands are a very interesting feature that promises to revolutionize the way websites are built. They allow you to have a backend on a static site without sacrificing the speed and simplicity of Astro. Although this feature is still in experimental mode, it is something to keep in mind for the future of Astro and the creation of modern and fast websites.