Astro Weekly #15

Astro 4.2 released, build your first Astro integration with Astro Integration Kit, composable commerce with Hygraph and Astro

Hey, Astronauts!

Apologies for the short delay in this week’s newsletter. You didn’t think I’d forgotten what day it was now, did you?

Ironically I’ve been caught up in an Astro project of my own this week. I’m currently deep into the build of an exciting client project within the fintech space which I’m excited to share with you all in February, all being well. 🤞

Until then, let’s check out what’s been happening in the Astrosphere this week.

This week in Astro ✨

Community takeover

Astro 4.2 released ⚡️

Astro's latest minor release, Astro 4.2, has just hit the shelves, and this time, it's a major achievement driven by the Astro community.

This marks a significant milestone as it is the first Astro release primarily composed of features crafted by the community.

Astro 4.2 ships new experimental features and improvements:

  • Support for prerendering pages using the Speculation Rules API (Experimental)

  • Reworked routing priority for injected routes (Experimental)

  • New redirectToDefaultLocale config option

  • Improved accessibility rules

  • Customizable image optimization in Markdown

Let’s take a deeper look at one of these new features…

Prerendering pages using the Speculation Rules API

As we know, Astro is fast. But what if it was even faster?

Astro’s prefetch feature has taken a huge leap forward with experimental support for prerendering pages through the Speculation Rules API, currently available only on Chromium.

This new API empowers users to prerender pages directly on the client side, enabling the execution of client-side JavaScript on pages anticipated to be visited next.

The result? A significantly accelerated browsing experience, showcasing Astro's commitment to pushing the boundaries of web development in pursuit of the fastest websites in the world.

To enable this feature, add the following to your astro.config.mjs file:

import { defineConfig } from 'astro/config';

// https://astro.build/config
export default defineConfig({
  prefetch: true,
  experimental: {
    clientPrerender: true,
  },
});

This will respect your existing prefetch configuration options, but will now prerender all links with the data-astro-prefetch attribute on the client, instead. A built-in fallback is provided for browsers that do not yet support the Speculation Rules API.

For a complete rundown of all the new features and improvements released in Astro 4.2, head on over to the official Astro blog.

Firm handshakes to everyone who contributed to this release. 🤝

Astro Community 🧑‍🚀

Ship your first Astro integration 🚀

If Astro 4.2 has you feeling inspired to contribute to the Astro ecosystem, Florian Lefebvre is on hand to help get you started.

Florian’s Astro Integration Kit is an awesome package that contains utilities to help you build Astro integrations. The kit also makes great use of Florian’s work elsewhere on the Astro Integration Template.

And Florian’s work doesn’t stop there either, also released this week is astro-env, an integration that allows you to validate and type your environment variables automatically using zod.

If you have any further questions on building your first Astro integration, you can find Florian hanging out in the Astro Discord.

Composable commerce with Hygraph and Astro 🛍️

Elian Van Cutsem joined Tim Benniks on a live stream this past week to discuss all things Astro and Hygraph — a popular GraphQL-native headless CMS.

Elian and Tim converted Hygraph’s recently released skncre Nuxt starter to Astro. Tune in to the replay to learn the core concepts of Astro and Hygraph, all while diving deep into the code.

If you have something awesome you’d like to share with the Astro community, you can reach me at [email protected] or via DM on X

Astro on X 💫

What’s happening on Twitter X this week…

Astro Showcase 🤩

Are we human, or are we Astro?

It may only be January, but we already have a strong contender for the Astro project of the year that you won't want to miss.

Behold, the new agency website from 'hello humans' — a breathtaking showcase of creativity, imagination, and style.

This project stands as a testament to the incredible potential that Astro brings to the table when used alongside other amazing projects such as Matter.js, a 2D physics engine for the web, and of course, that human touch.

Other Astro projects in orbit 🪐

More great Astro projects worth checking out! ↓

\Would you like your work to be featured in our Astro Showcase? Get in touch at [email protected] or DM me on X

Beyond the Astrosphere 🪐

What caught my eye outside of Astro this week…

  • Dub.co — short links with superpowers

  • Wicked Backgrounds — awesome tool for creating stylish SVG backgrounds for your projects

  • Make Lemonade — I’ve been enjoying this podcast from the Lemon Squeezy team

That’s a wrap for Astro Weekly #15! Time to get back to work…

If you’d like to have your work featured in Astro Weekly, you can reach me at [email protected] or via DM on X, just like Jahir last week!

Have fun out there, Astronauts!

Nathan 🧑‍🚀

Subscribe to keep reading

This content is free, but you must be subscribed to Astro Weekly to continue reading.

Already a subscriber?Sign In.Not now