New Photo Functionality

I just rolled out the first version of native photo hosting for this site. If you don’t care about nerdy details on the implementation, just click the links in the text below to look at some posts with photos that are now taking advantage of the new functionality.

I’m using Shrine to upload and create multiple sizes of photos. I did an initial stab at this before Active Storage came out, and at first blush, it’s still the more mature, fully‐featured solution. I’m storing photos locally, since it’s my server and has plenty of space, but Shrine can also handle storing photos on Amazon S3 and other cloud providers. For now, local works well.

I generally write posts in Markdown, and added a rudimentary post pre‐processor that looks for custom image tags in my posts and then creates a srcset attribute on my img tags that are rendered. The srcset contains all the available resolutions, and enables modern browsers to download the appropriate version for the display in question. The bottom line is that Retina displays will get the higher resolution images when they’re available, so pictures should look great on those displays. I’ve gone back and updated some recent posts with images. See if you can tell the difference. (I can!) Update: There was a small bug that was preventing the pics from displaying at the correct width; it’s been fixed.

Next up: making photos in posts link to a photo detail page.

I can’t have a post about this functionality without including a picture in it, so here’s one I shot of Ainsley while goofing around the other morning. (Note to self: I’m overdue to report on the new camera gear….)

Ainsley


Home