Umbraco AutoImage Optimize

Our innovative tool tackles image optimization specifically for Umbraco websites. Say goodbye to sluggish loading times and hello to a lightning-fast browsing experience. Here's what Dyfort.Umbraco.AutoImageOptimize offers:

  • Effortless Optimization: Our tool seamlessly integrates with your Umbraco workflow, automatically optimizing images during upload or on-demand.
  • Unmatched Speed: Experience dramatic website performance improvements with significantly reduced image file sizes.
  • Crystal-Clear Quality: We prioritize maintaining exceptional image quality while achieving optimal compression.
  • Format Savvy: Deliver the right format for the job. We intelligently convert images to web-friendly formats like JPEG, PNG, or even cutting-edge WebP for maximum efficiency.
  • Perfect Fit: Images are automatically resized to match their display dimensions, eliminating unnecessary downloads and wasted bandwidth.
  • Umbraco Harmony: Our tool works alongside Umbraco's built-in image features, providing a comprehensive optimization solution.

 

Versions:

  • Version 2.0.0 - for Umbraco 12+
  • Version 1.0.0 - for Umbraco 10+

Get Started:

  1. Installation: Open your Umbraco project in Visual Studio. Navigate to the Tools menu and select NuGet Package Manager > Install Packages. In the search bar, type "Dyfort.Umbraco.AutoImageOptimize" and install the package.
  2. Rebuild: After installation, right-click on your project in Solution Explorer and select Rebuild. This ensures all the necessary changes take effect.
  3. See the Magic: Open any Umbraco page that contains images. Now, right-click anywhere on the page and select Inspect (or press Ctrl+Shift+I). Within the developer tools, navigate to the Network tab. Reload the page and observe the network traffic. You'll see that all your images are being downloaded in the WebP format!

 

  • Full Optimization: By default, all images are optimized.
  • Disable Optimization for One Image: Need to keep an image in its original format? Simply append ?optimize=false to the image URL in your Umbraco template. For example, if your image URL is /media/myimage.jpg, adding ?optimize=false would become /media/myimage.jpg?optimize=false. This image will be delivered without any optimization from Dyfort.Umbraco.AutoImageOptimize.

Result of image optimization

Default Settings:

"AutoImageOptimizer": {
   "Quality": "92",
   "AllowedExtentions": [
     ".png",
     ".jpg",
     ".jpeg"
   ],
   "ExcludedFolderPaths":[
     "/umbraco/assets/"
   ],
   "Enabled": "true"
 }
}