unpic is a great piece of tooling for adding responsive image markup to your web apps. It is an open source project by Matt Kane, a Netlify engineer who worked on Gatsby’s image plugin. unpic targets sites built with images hosted by image content CDN services. That said, in a recent post exploring self-hosting images, I wrote about how you can also use unpic on cost-critical projects where an image CDN service is optional.
To make images responsive and maintain a fantastic user experience, there is a lot of boilerplate code to include in each image. This boilerplate improves page load time by serving smaller images to mobile devices and serving AVIF and WebP images to browsers which support them. As well as that, you will want to make sure you include an aspect ratio, so the layout does not shift as the image loads. A lot to consider, and luckily unpic handles it all. Thanks, Matt, for creating it!
You might have a developer blog or contribute to a docs site. If you do, you will likely want to add code blocks at some point. Traditionally Prism was the plugin of choice for code syntax highlighting. It is well-established and widely supported. Shiki is an alternative worth considering, especially if you want to carry over your favourite VSCode theme to your code blocks! Another advantage is support for highlighting newer languages like Svelte.
I got a few, recent mentions and some kind feedback on using Shiki with SvelteKit post. Take a look if you haven’t yet! Although it focusses on SvelteKit and you can leverage some of the tips to work with Svelte in Astro or even other frameworks.
logrotate. Handy if you are new to Linux or often find yourself reaching for Stack Overflow!
Hope there was something valuable in here for you. As always, reach out with feedback. I wrote blog posts for Upstash and CloudCannon this month, here are some links in case you missed them: