Rodney Lab Newsletter — March 2023Rodney Lab Newsletter — March 2023
🚀 Pick of the Month — unpic #
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.
Why is it needed?
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!
🧑🏽💻 Follower Feedback — Shiki Highlighting in SvelteKit #
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 VS Code 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.
📢 Fun Finds #
- System Administration —
Linux Upskill Challenge:
a 21-day course taking you right from
lstotarandlogrotate. Handy if you are new to Linux or often find yourself reaching for Stack Overflow! - Services — Ably: if you need real-time chat in your app, Ably is your friend. It is a serverless WebSockets provider. WebSockets are a popular transport choice for the real-time connections, used by chat, multiplayer games and data streaming applications. I am building a SvelteKit multiplayer game to try it out. Look out for the game, and a post on creating a real-time, multiplayer game with Ably and SvelteKit!
- Resources — Fetch with Timeout: David Walsh never disappoints. I love this short post on using JavaScript Abort Signals to drop a fetch request that is taking too long. Handy if the resource you are requesting is not essential; you can just move on to your next task.
👋🏽 Until next time! #
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: