How to shrink images on the fly in Laravel?

Question

Laravel

Good evening
Made a small online store on Laravel. I used Voyager as an admin panel. I uploaded products via Voyager and now I have the following problem: the photos of the products were initially large (about 3-4mb each) and now on the catalog page of 30 positions I have a page weighing >
100mb rewrite significant code?
Picked in the direction of Image Intervention, but it's not very clear how to make friends with Voyager I display the
pictures like this:
products.blade.php

<a class="card__piclink" href="{{ route('shop.show', $product->slug) }}">
       <img data-ripple class="card__img" data-src="{{ productImage($product->image) }}" alt="">
</a>

helpers.php

function productImage($path)
{
    return $path && Storage::disk('local')->exists('public', $path) ? Storage::disk('local')->url($path) : asset('img/not-found.jpg');
}

Answer 1

I did not use Voyager, maybe there are some features. But judging by your helper. You still need to fully understand the intervention. Create filter ProductThumbFilter image.intervention.io/use/filters.
Add it to config/imagecache.php:

'templates' => array(
        'productthumb' => 'App\ImageFilters\ProductThumbFilter',

And already in the template or in the helper get the image url:
route('imagecache', ['template' => 'productthumb', 'filename' => $product->image ])
All thumbnails missing for the image will be generated on the fly and save to cache.

Answer 2

Queue and tasks to help you
When you upload a large image, the compression (and resize) will go in the background and "drop" in the course of being ready for the product that you have. You don't need to press on the fly. Store finished images. Save server resources

Answer 3

Add thumbnails for all images and only show them in the list?

Answer 4

make a preview output, when accessing it, if the file is missing, Laravel calls which generates it from the source file and puts it on disk.