Images are such a huge part of digital media - and tend to be taken for granted, but they can be tricky to manage correctly.
The development of smart phones with cameras changed the world. When did you last hear of someone sending off their roll of film for processing? These days the world turns on images with a constant stream of them uploaded to social media, news feeds and websites.
It’s easy to take photos now, and to crop them, colour balance them, and share them. From a developer’s perspective they can raise some challenges though. An arms race between phone manufacturers has seen a steady increase in file sizes which can make uploading slow and server side processing resource intensive.
Google, with its monopolistic dominance of the search market, has been using performance as a ranking factor for a while, and is now favouring new fangled formats, eg AVIF. Making copies of images from one format to another isn’t that challenging, but if you have to load an image gallery page with a dozen images or more the page will not load quickly if they all update themselves on the server at the same time. We’re not talking timeout inducing delays, but we are talking slow enough to cause a low performance score from Google - ironically.
For me the problem of image formatting is most acute on my wine website. Each year new vintages mean new images for over 1,000 products. Each product can be viewed in multiple ways and need to be available at different sizes. One strategy would be to blitz through all products and have new sets of images produced in one big, slow server-stalling go. Maybe. But I stilth there needs to be a way to load a lower res placeholder if an image needs new versions. Time for some HBI experiments!