The daikazu/laravel-glider package is a powerful and elegant solution for developers needing on-the-fly image manipulation within their Laravel applications. It acts as a wrapper for the popular League/Glide library, bringing its dynamic image processing capabilities directly into your Blade templates with secure, performance-focused features.

Simply put, Laravel Glider allows you to serve optimized, resized, and transformed images on-demand by modifying the image URL, without needing to pre-generate multiple image sizes.

Key Features

Laravel Glider simplifies image management by offering several robust features:

• Dynamic Image Processing: It leverages League/Glide to manipulate images on demand. You can apply transformations like resizing, cropping, changing format (e.g., to WebP or AVIF), adjusting quality, and applying filters simply by passing parameters in the URL.
• Blade Components: The package includes a dedicated <x-glide-img> Blade component. This component is particularly useful as it automatically handles the generation of responsive images by populating the srcset attribute. This is crucial for modern web performance and user experience.
• URL Signing for Security: To prevent unauthorized users from abusing the image manipulation endpoint (e.g., by generating millions of large images), Glider implements URL signing. This ensures that only URLs generated by your application are valid for image manipulation.
• Flexible Source and Caching: It supports images from various sources, including your local Laravel filesystem and remote HTTP sources. Once an image is processed, it is cached locally, ensuring that subsequent requests for the same manipulation are served quickly for better performance.
• Focal Point Cropping: You can specify a focal point for cropping, ensuring that the most important part of your image remains visible regardless of the aspect ratio you crop it to. This is done via CSS object-position in the generated component.

How to Use Laravel Glider

Using the package is straightforward after installation (composer require daikazu/laravel-glider).

1. Generating URLs

You can use the provided Facade to generate a securely signed URL with manipulation parameters:

use Daikazu\LaravelGlider\Facades\Glide;

// Resize to 400px width
$url = Glide::url('path/to/image.jpg', ['w' => 400]);

// Resize and convert to WebP format with 85 quality
$url = Glide::url('image.jpg', ['w' => 600, 'q' => 85, 'fm' => 'webp']);

2. Using the Blade Component

The <x-glide-img> component is the recommended way for integrating manipulated images, as it automatically generates responsive srcset and sizes attributes for you:

<x-glide-img src="path/to/image.jpg" glide-w="800" alt="A beautiful landscape" />

<x-glide-img 
    src="path/to/profile.jpg" 
    glide-w="200" 
    glide-h="200" 
    glide-fit="crop" 
    glide-q="75" 
    alt="User profile picture" 
/>

<x-glide-img 
    src="path/to/group-photo.jpg" 
    glide-w="400" 
    focal-point="top-right" 
    alt="Group photo focused on top right" 
/>

The component automatically takes the glide-* attributes and applies them as manipulation parameters, rendering an optimized and responsive <picture> or <img> element.

Conclusion

For any Laravel project that deals heavily with images, daikazu/laravel-glider is an invaluable tool. It combines the power of League/Glide's dynamic image manipulation with Laravel's ecosystem, providing a secure, performant, and developer-friendly way to serve optimized, responsive images directly from your Blade templates. It essentially removes the headache of managing multiple pre-generated image sizes and offloads the complexity of responsive image markup.