Image Optimization In Laravel With Spatie

Today, Laravel share with you one of the helpfull tutorials aboute how to image optimization in laravel using spatie laravel package. because image optimization is very needed when we are working on big project and lots of images use in it. it image optimization functionality also help us in project size reduce.

Here we are show how to image optimization in laravel using spatie laravel package. how to use in laravel application step by step.

Step : 1 Install package

First we need to install spatie laravel package in our laravel application run following command.

composer require spatie/laravel-image-optimizer

Step : 2 Configure package

After installtion done then configure package. so, open our config/app.php file and set service provider and aliases in it. just following this way

'providers' => [
	....
	SpatieLaravelImageOptimizerImageOptimizerServiceProvider::class,
],
'aliases' => [
	....
	'ImageOptimizer' => SpatieLaravelImageOptimizerImageOptimizerFacade::class,
],

Then after public confige run following command

php artisan vendor:publish --provider="SpatieLaravelImageOptimizerImageOptimizerServiceProvider"

After run this command and open your config/image-optimizer.php file it look like this. if your want to change any configure value then change according your requirement.

use SpatieImageOptimizerOptimizersSvgo;
use SpatieImageOptimizerOptimizersOptipng;
use SpatieImageOptimizerOptimizersGifsicle;
use SpatieImageOptimizerOptimizersPngquant;
use SpatieImageOptimizerOptimizersJpegoptim;

return [
    /*
     * When calling 'optimize' the package will automatically determine which optimizers
     * should run for the given image.
     */
    'optimizers' => [

        Jpegoptim::class => [
            '--strip-all',  // this strips out all text information such as comments and EXIF data
            '--all-progressive',  // this will make sure the resulting image is a progressive one
        ],

        Pngquant::class => [
            '--force', // required parameter for this package
        ],

        Optipng::class => [
            '-i0', // this will result in a non-interlaced, progressive scanned image
            '-o2',  // this set the optimization level to two (multiple IDAT compression trials)
            '-quiet', // required parameter for this package
        ],

        Svgo::class => [
            '--disable=cleanupIDs', // disabling because it is know to cause troubles
        ],

        Gifsicle::class => [
            '-b', // required parameter for this package
            '-O3', // this produces the slowest but best results
        ],
    ],

    /*
     * The maximum time in seconds each optimizer is allowed to run separately.
     */
    'timeout' => 60,

    /*
     * If set to 'true' all output of the optimizer binaries will be appended to the default log.
     * You can also set this to a class that implements 'PsrLogLoggerInterface'.
     */
    'log_optimizer_activity' => false,
];

Step : 3 Add Middleware

This package provide it’s own middleware for image optimization just open your app/Http/Kernel.php file and add middleware like that.

protected $routeMiddleware = [
   	...
   	'optimizeImages' => SpatieLaravelImageOptimizerMiddlewaresOptimizeImages::class,
];

Step : 4 Create Route

Now create route for image post request

Route::post('/photos', 'PhotosController@store')
    ->middleware('optimizeImages');

Step : 5 Create Controller

Now, create controller create PhotosController.php file in app/Http/Controllers folder and put into it following .

namespace AppHttpControllers;

class PhotosController extends Controller {
    public function store() {
        $this->validate(request(), [
            'photo' => 'required|image:jpeg '
        ]);

        request()->photo->storeAs('images', 'optimized.jpg');

        /Session::put('success', 'Your Image Successfully Optimize')

        return redirect()->back();
    }
}

Step : 6 Create Blade File

Now, create one view file for display image upload form and put itno it following .

@if($message = Session::get('success'))
<div  role="alert">
  	<button type="button"  data-dismiss="alert" aria-label="Close">
    	<span aria-hidden="true">×</span>
  	</button>
  	<strong>Success!</strong> {{ $message }}
</div>
@endif
<form action="/photos" enctype="multipart/form-data" method="POST">
  	{{ csrf_field() }}
  	<div >
    	<label for="">Photo</label>
    	<input  name="photo" type="file" />
    	<button type="submit">Upload</button>
  	</div>
</form>

Note : if your want more information then click on this link for this package Spatie Package

If you face any problem then please write a comment or give some suggestions for improvement. Thanks…