Workaround: prebuild responsive images via ImageMagick via cron

1

Hey grav community,

in my first grav project I am looking for a solution to create responsive images for a (likely) growing image gallery. When first discovering the possibilities of grav, I thought i would use the great built-in twig methods like cropResize or derivatives to build the responsive versions “on demand”. But as I learned, this could cause some problems, if there are a lot of images to process, e.g. after a clear of the whole cache. Since I am (at least for now) just on a webhosting service, the execution time for php scripts is strictly limited.
I am afraid, sooner or later I would run into troubles with this limitation.

So I was looking for a solution which fits to my current limitations.

One soulution would be the plugin grav-plugin-resize-images, but there are probably some issues with future (>1.6) releases of grav and the plugin seems to be not maintained anymore.

I would have also tried to create my own plugin, but since I am still learning in the possibilities of grav, this project would be too complex for me.

So I took a look around and found the adrianboston/srcset.sh script on github. I thought, with some modifications, this would fit perfectly to my reqirements.
So I created this fork here:

floppyFK/srcset.sh

This script is meant to run periodically via a cron-job (e.g. every 60 seconds) to scan for new files, which match the expected pattern. If a new file was found, the responsive versions will be created in a subfolder of the detected file.
The set of created responsive widths (each one with a separate quality configuration) can be defined in a separate *.conf file.

Since I am using also the git-sync plugin, I have added an option to create a .gitignore file for all the responsive images.

So as well in my development environment as also on the public site, the creation of responsive images is ensured without creating additional unneccesary load to the git repo.

I just want to share my approach. Feel free to comment / modify it in any way :wink: (maybe I am completely wrong with my approach?)

2

Might I suggest Adaptive Images?

It is CMS independent and builds a cache on the fly.

3

Nice, thanks for the suggestion!

But this solution relies in the usage of cookies, right?
So far I try to avoid cookies at all due to the German DSGVO / GDPR.

Also, with the support of srcset’s by almost any modern browser, this solution seems to be a little bit outdated.

But it’s still a really cool solution that I hadn’t thought of :slight_smile: