Glide Symfony Laravel Package

Getting Started

Minimal Setup

1. Install the package:

   composer require dahromy/glide-symfony
   

2. Enable the bundle in config/bundles.php:

   DahRomy\GlideBundle\DahRomyGlideBundle::class => ['all' => true],
   

3. Configure basic settings in config/packages/glide.yaml:

   glide:
       source: '%kernel.project_dir%/public/uploads/images'
       cache: '%kernel.project_dir%/var/cache/glide'
       driver: gd
   

4. First use case: Serve a resized image in Twig:

   <img src="{{ 'profile.jpg'|glide({w: 200, h: 200, fit: 'crop'}) }}" alt="Profile">
   

Where to Look First

• Twig functions: glide_asset() and |glide filter for quick template integration.
• Controller service: GlideService for programmatic URL generation or direct responses.
• Presets: Predefined configurations in glide.yaml for reusable image transformations.

Implementation Patterns

Common Workflows

1. Dynamic Image Delivery Use Twig filters for frontend:

   {{ asset('images/' ~ product.image) | glide({w: 800, h: 600, fit: 'contain'}) }}
   

   Or in controllers:

   $url = $glideService->getImageUrl("images/{$product->image}", ['w' => 800]);
   return $this->redirect($url);
   

2. Preset-Based Transformations Define presets in glide.yaml:

   presets:
       thumbnail: {w: 150, h: 150, fit: 'crop'}
       featured:  {w: 1200, h: 800, fit: 'contain'}
   

   Apply in Twig:

   {{ 'product.jpg'|glide({}, 'thumbnail') }}
   

3. Direct Image Responses Stream images without URL generation (e.g., for APIs):

   return $glideService->getImageResponse('image.jpg', ['w' => 500]);
   

4. Signed URLs for Security Enable signing in config:

   glide:
       signing: true
       secret: '%env(APP_SECRET)%'
   

   Use signed URLs in Twig:

   {{ 'private.jpg'|glide({w: 300}, null, true) }}  {# 3rd arg: signed #}
   

Integration Tips

• Asset Pipeline: Place source images in public/uploads/images (configurable).
• Cache Management: Clear Glide cache manually:

  php bin/console cache:clear --env=prod
  

  Or programmatically:

  $glideService->clearCache();
  

• Symfony UX: Combine with Stimulus for dynamic resizing:

  // stimulus_controller.js
  connect() {
    this.element.addEventListener('resize', () => {
      this.element.src = this.element.src.replace(/w=\d+/, `w=${this.element.width}`);
    });
  }
  

Gotchas and Tips

Pitfalls

1. Driver Dependencies

   • Ensure gd or imagick is installed (php -m | grep gd or php -m | grep imagick).
   • Fallback to gd if imagick fails (configured in glide.yaml).

2. Path Resolution

   • Absolute paths only: Glide resolves paths relative to source. Use public/ or var/ paths.
   • Trailing slashes: Avoid /images/ vs images/ inconsistencies in config.

3. Cache Invalidation

   • Clear cache after uploading new images:

     $glideService->clearCache(); // Clears entire cache directory
     

   • For granular control, manually delete cached files (e.g., via filesystem events).

4. Preset Overrides

   • Explicit params override presets:

     {{ 'image.jpg'|glide({w: 100}, 'thumbnail') }} {# w=100 overrides preset #}
     

Debugging

• Check generated URLs: Append ?debug=1 to see raw Glide params:

  /cache/glide/abc123.jpg?w=200&h=200&fit=crop&debug=1
  

• Log errors: Enable Symfony debug mode to catch path/resolution issues.
• Test locally: Use driver: gd for consistency across environments.

Extension Points

1. Custom Drivers Extend GlideService to support additional drivers (e.g., vips):

   // src/Service/CustomGlideService.php
   class CustomGlideService extends GlideService {
       protected function getDriver(): string { return 'vips'; }
   }
   

   Register as a service alias.

2. Event Listeners Hook into Glide events (e.g., cache miss):

   // config/services.yaml
   DahRomy\GlideBundle\EventListener\GlideListener:
       tags:
           - { name: kernel.event_listener, event: glide.cache_miss, method: onCacheMiss }
   

3. Dynamic Configs Override presets via runtime logic:

   $glideService->setPreset('dynamic', ['w' => $request->query->getInt('width')]);
   

Performance Tips

• Cache Directory: Place cache outside public/ (e.g., var/cache/glide) to avoid web access.
• CDN Integration: Serve cached images via CDN (e.g., Cloudflare) for faster delivery.
• Batch Processing: Use Symfony Messenger to queue large image transformations.