Resize/crop image on the fly according to screen resolution (bootstrap grid pattern).
Imagick (ImageMagick) PHP extension
PHP version >= 5.5
Laravel framework 4 and up
First you need to add this line to composer.json file:
"izupet/laravel-flyimages" : "^1.0.0"
Update composer from the terminal:
$ composer update
Add service provider in app.php file:
After composer finishes its work, run this artisan command to generate config file
$ php artisan vendor:publish
You are done.
Customize route in flyimages.php config file. This route will be used as a path to the images in your templates.
Now for every image you want to optimize you should append query string to the path. Possible parameters are:
lg-w lg-h md-w md-h sm-w sm-h xs-w xs-m
Valid values for this parameters are:
If screen resolution is equal or higher than 1200px the lg prefixed parameters are used.
If screen resolution is equal or higher than 992px and smaller than 1200px the md prefixed parameters are used. If there are none, closest parent's one (lg) are used.
The same pattern of hierarchy is used also for sm and xs prefixed parameters.
A prerequisite for everything to work is that both width and height must be present for certain prefixed parameter. If there are not both present, original image will be delivered.
<img src="/optimize/test.jpg?sm-w=400&lg-h=400&md-w=300&xs-h=300"/> Wont work
Browser caching is available through ETAg header. Server side caching is not used. It is recommended to use reverse proxy cache server or CDN for very visited websites.