Responsive JXL, AVIF, and WebP Images with Cloudinary
Serve JPEG XL first, with AVIF and WebP fallbacks, using a reusable Astro picture component.
A PERSONAL CORNER OF THE INTERNET
Stay curious.
Look closer.
There’s a whole universe hiding in the details. A place for science, beautiful images, and the quiet pleasure of figuring things out. Explorers need help to, so I thank Eugene Musebe for his template. A quick F.Y.I., if you use Safari you can view every image as a jxl formatted image. Other browsers need to enable it using these simple instructions.
Open the cabinetMade by Paul. Best explored slowly.
01 — A FEW DIFFERENT WAYS OF SEEINGJXL → AVIF → WebP
FROM THE WORKBENCH
Three things to open.
Little experiments in making the web a more beautiful place. Pick a card and take a closer look.
Responsive Images with srcset, sizes, and Cloudinary
Use picture for format selection and srcset with sizes for responsive image widths.
Getting Started with Astro: Zero JS by Default
Astro ships zero JavaScript to the browser by default. Here's why that matters for performance and how to set up your first Astro project in under five minutes.
THE POCKET OBSERVATORYEXPERIMENT 001 / LIGHT & TIME
Nothing you see
is quite now.
Light is fast. Space is enormous. Every time you look up, you’re looking into the past.
8m 19sof travel time
Sunlight is already a memory when it reaches your skin. It left the Sun’s visible surface about eight minutes ago.
ONE-WAY LIGHT TRAVEL
149.6 million km · one astronomical unit
Diagram not to scale.
Playback compressed to 3 seconds.
Playback compressed to 3 seconds.
A SMALL REMINDER OF HOW BIG EVERYTHING IS.Explore the science at NASA ↗
Thanks to Josh W. Comeau for the sound and the inspiration to make the web a little more playful.
AN OPEN-ENDED COLLECTION
The best part of learning?
There’s always another question.
This corner of the web has room for both careful engineering and a little wonder. Thanks for stopping by.