Your Magento 2 Store Is Slow — and Your Images Are the Reason
You have optimized your database queries, enabled full-page caching, and maybe even moved to a faster hosting plan. But your Magento 2 store still loads slowly. The culprit is almost certainly staring right back at you: your product images.
Images account for over 50% of a typical e-commerce page's total weight. According to HTTP Archive's 2025 Web Almanac, the median e-commerce page serves roughly 2.4 MB of images — and most of those images are still in JPEG or PNG format, even though a modern alternative has been available for years. That alternative is WebP, an image format developed by Google that delivers 30-50% smaller file sizes at equivalent visual quality.
The consequences of ignoring image optimization are not hypothetical. Google uses Core Web Vitals — specifically Largest Contentful Paint (LCP) — as a ranking factor. When your product images take 2-3 seconds to load because they are bloated JPEG files, your LCP score suffers. Your search rankings drop. Mobile visitors on slower connections bounce. Studies by Google and Deloitte have consistently shown that a 100-millisecond improvement in load time can increase conversion rates by up to 8%.
If you are running a Magento 2 store and still serving uncompressed or JPEG-only product images, you are leaving revenue on the table. The fix does not require a developer, a CDN overhaul, or a redesign. It requires automatic WebP conversion — and that is exactly what MageRa WebP Images delivers.
What Is WebP (and Why Magento 2 Stores Need It Now)
WebP is an image format introduced by Google in 2010 that provides superior lossy and lossless compression compared to JPEG and PNG. A WebP image at the same perceived visual quality as a JPEG is typically 25-35% smaller. For PNG images with transparency, the savings can reach 45-50%. These are not marginal gains — they are transformational for e-commerce pages that display dozens of product images.
Browser support for WebP has been universal since 2020. Chrome, Firefox, Edge, Opera, and Safari (from version 16 onward, released September 2022) all support WebP natively. As of 2026, over 97% of global internet users can render WebP images without any issue. The format is no longer experimental — it is the industry standard for web image delivery.
Magento 2, however, does not natively convert images to WebP. Out of the box, Magento processes uploaded images in their original format (JPEG, PNG, GIF) and serves them exactly as-is. While Magento 2.4.4+ introduced support for WebP as an upload format, it does not automatically convert your existing catalog or generate WebP versions alongside originals. This means every product photo, category banner, and CMS block image on your store is being served in a format that is significantly larger than necessary.
This is where MageRa WebP Images steps in. The extension automatically converts your JPEG, PNG, and static GIF images to WebP format — covering product images (base, thumbnail, small), category images, and CMS WYSIWYG content. It uses the HTML5 <picture> element to serve WebP to modern browsers while seamlessly falling back to the original format for any browser that cannot render it. You get smaller files, faster loads, and zero risk of broken images.
Key Features of MageRa WebP Images for Magento 2
Automatic Conversion — Three Modes to Match Your Workflow — Choose between Automatic (On Upload + On Demand), On Demand Only (convert when a visitor requests the image), or On Upload Only (generate WebP versions the moment you upload a new image). The Automatic mode is recommended for most stores because it both converts new uploads and fills any gaps on demand for existing images.
Quality Control via Preset Levels — Choose your WebP quality from a dropdown of preset levels in the admin panel: 100 (Lossless), 90 (High Quality), 85 (Good Quality), 80 (Balanced, the recommended default), 75 (Good Compression), 70 (High Compression), and 65 (Maximum Compression). The default of 80 delivers an excellent balance between visual fidelity and file size reduction. For stores with high-detail product photography (jewelry, electronics, textiles), selecting 85 or 90 preserves fine detail while still achieving meaningful compression.
Full Catalog Coverage — The extension converts product images across all Magento image roles (base image, small image, thumbnail), category listing images, and CMS page and block images uploaded through the WYSIWYG editor. Each content type can be enabled or disabled independently, giving you granular control over what gets converted.
HTML5 Picture Element with Browser Fallback — WebP versions are delivered using the <picture> tag, which allows the browser to choose the best format it supports. Chrome, Firefox, Edge, and Safari receive the WebP version. Older or unsupported browsers automatically receive the original JPEG or PNG file. No JavaScript hacks, no server-side user-agent sniffing, and no risk of blank images.
CLI Commands for Bulk Operations — Generate WebP versions for your entire existing catalog using a single command (php bin/magento magera:webp:generate), clear the WebP cache, or regenerate specific content types. This is essential for stores with thousands of existing product images that need to be retroactively converted after installing the extension.
Screenshot of the MageRa WebP Images admin configuration panel showing General Settings (Enable WebP, Conversion Mode, Image Quality, Create on Upload) and Content Settings (Product Images, Product Thumbnails, Category Images, CMS Images) in Magento 2.
PNG Transparency Support — PNG images with alpha transparency are converted to WebP while preserving the transparency channel. This means your product overlays, icons, and transparent PNG badges remain visually identical — just dramatically smaller in file size.
How to Set Up MageRa WebP Images in Magento 2
Step 1: Verify Server Prerequisites
Before installing, confirm that your server has either the PHP GD extension or the ImageMagick extension installed. Both support WebP encoding. Run php -m | grep -E '(gd|imagick)' from your terminal. If neither is listed, ask your hosting provider to install one. Also ensure your Magento media directory has write permissions so the extension can store converted WebP files.
You need Magento 2.4.6 or higher, PHP 8.1 or higher, and the MageRa_Base module (which is included with all MageRa extensions).
Step 2: Install via Composer
Connect to your server via SSH and navigate to your Magento root directory. Run the following commands:
composer require magera/module-webp-images
php bin/magento module:enable MageRa_WebpImages
php bin/magento setup:upgrade
php bin/magento setup:di:compile
php bin/magento cache:flushThe installation takes under two minutes on a standard server. No manual file copying or symlink creation is required.
Step 3: Configure General Settings
In your Magento admin panel, navigate to Stores > Configuration > MageRa > WebP Images (config section magera_webpimages). In the General Settings group set Enable WebP Images to Yes. Set Conversion Mode — the dropdown offers Automatic (On Upload + On Demand), On Demand Only, and On Upload Only; choose Automatic for the best balance of performance and server efficiency. Set Image Quality from the preset list (100 - Lossless, 90 - High Quality, 85 - Good Quality, 80 - Balanced (Recommended), 75 - Good Compression, 70 - High Compression, 65 - Maximum Compression) — leave it at 80 and fine-tune later after reviewing your storefront. Set Create WebP on Upload to Yes so new images are converted automatically as they are added.
Step 4: Enable Content Types
The section has a group per content type. In Product Images set Enable for Product Images to Yes and Include Thumbnails to Yes (this converts the thumbnail and small-image sizes too). In Category Images, set Enable for Category Images to Yes (it also has an Include Thumbnails toggle). In CMS Images, set Enable for CMS Images to Yes to convert images used in CMS pages and blocks. For most stores, enabling all three is the right choice.
Step 5: Convert Existing Images and Test
The extension ships with three working CLI commands (registered as magera_webp_generate, magera_webp_clear, and magera_webp_regenerate). Generate WebP versions of every existing catalog and CMS image with:
php bin/magento magera:webp:generateThe command first checks that the server supports WebP (GD or Imagick with WebP) and then reports progress (N / total processed) and a final converted count. Two companion commands round out maintenance: php bin/magento magera:webp:clear deletes all generated WebP files, and php bin/magento magera:webp:regenerate --type=all clears and rebuilds everything (pass --type=product or --type=category to scope it; all is the default). A bulk run is also available in the admin at Content > WebP Images > Convert Images (route webpimages/convert/index), and a cron job (magera_webpimages_convert_images) re-runs conversion nightly at 02:00.
For stores with 10,000+ product images, expect the first generate to take 5-15 minutes depending on CPU and disk speed. Serving is then fully automatic: plugins on the product image and gallery blocks swap in the WebP file once it exists, with no template changes. To confirm, open a product page, inspect the image, and look for the <picture> element with <source srcset="..." type="image/webp"> as the first source; use the DevTools Network tab to verify the served file is significantly smaller than the original.
MageRa WebP Images for Magento 2
Built specifically for performance-conscious Magento 2 stores, MageRa WebP Images integrates directly into Magento's image rendering pipeline — no third-party CDN, no external API calls, and no recurring service fees.
- Automatic and transparent: Set it up once, and every image on your store is converted and served in the optimal format going forward
- Zero quality loss: Visual fidelity is preserved at quality 80+; your customers will not be able to distinguish WebP from the original JPEG
- Broad format support: Converts JPG/JPEG, PNG (with transparency), and static GIF to WebP
- HTML5 picture tag output: Standards-based fallback ensures compatibility with every browser
- CLI tools for bulk operations: Convert existing catalogs with one command
- Compatibility: Magento 2.4.6, 2.4.7, 2.4.8, and 2.4.9; PHP 8.1, 8.2, and 8.3; Open Source and Commerce editions
- Requires: MageRa_Base module, PHP GD or ImageMagick extension, write permissions for media directory
- https://magera.ca/magento-2-webp-images.html →
The Performance Impact: What to Expect After Enabling WebP
Numbers matter more than claims. Here is what MageRa WebP Images delivers based on the extension's built-in performance benchmarks and real-world Magento 2 store results.
File Size Reduction: Product images shrink by 25-35% on average. For a typical store with 50 product images per category page, this translates to a total page weight reduction of 400-800 KB. Stores with large PNG images (transparent product shots, icons) see savings of up to 50%.
Page Load Time: With WebP images served, category and product pages load 10-20% faster. This improvement compounds when combined with lazy loading and JavaScript deferral (more on those below).
Bandwidth Savings: For stores serving 10,000+ pageviews per day, the monthly bandwidth reduction can be significant — often 20-40 GB less data transferred. This is particularly impactful if you pay for bandwidth or use a CDN with usage-based pricing.
Core Web Vitals: LCP improves measurably because the browser downloads the hero image (typically the largest element on the page) faster. Stores that move their LCP from 3.5 seconds to under 2.5 seconds often see a tangible lift in organic search traffic within weeks.
Screenshot of a Magento 2 storefront showing a side-by-side WebP vs JPEG format comparison — the WebP version is 46% smaller (185 KB vs 342 KB) with identical visual quality — followed by the optimized product catalog with all images served in WebP format.
Image Optimization Best Practices for Magento 2 Stores
Installing WebP conversion is one piece of the puzzle. To get the maximum performance benefit, follow these best practices alongside the extension.
Start with properly sized source images — WebP conversion cannot fix an image that is uploaded at 4000x4000 pixels when your theme only displays it at 480x480. Before uploading product images, resize them to the largest display size your theme uses (typically around 1200-1500px for the base image). This single step can reduce file sizes by 60-80% before WebP conversion even begins.
Use quality 80 for most product images — The default quality setting of 80 is ideal for the vast majority of e-commerce product photography. Independent testing by Google's Squoosh tool and Cloudinary has confirmed that quality 75-85 produces WebP files that are visually indistinguishable from the source at normal viewing distances. Only use quality 90+ for images where customers zoom in to inspect fine detail (fabrics, jewelry, technical equipment).
Convert your entire catalog immediately after installation — Do not rely solely on on-demand conversion for existing products. Use the CLI bulk conversion command (php bin/magento magera:webp:generate) to process your full catalog. This ensures that the first customer to visit any product page gets the fast-loading WebP version immediately, rather than triggering a conversion on their request.
Combine WebP with lazy loading and JavaScript deferral — WebP conversion addresses image file size. But you can compound the performance gains by also deferring the loading of below-the-fold images and non-critical JavaScript. MageRa offers two related performance extensions designed to work alongside WebP Images: MageRa Lazy Load defers loading of images until they are about to enter the viewport, reducing initial page weight by 40-60%. MageRa Defer JavaScript shifts non-critical JavaScript execution to after the page renders, improving Time to Interactive by 20-40%. Together, these three extensions form a complete front-end performance optimization stack for Magento 2.
Test on staging before deploying to production — While WebP conversion is safe and reversible (original images are never deleted), it is always best practice to verify the output on a staging environment first. Check that product images, category banners, and CMS content all render correctly. Inspect the HTML output to confirm the <picture> element is being generated. Run Google PageSpeed Insights before and after to quantify the improvement.
Regenerate images after quality changes — If you adjust the quality setting after initial conversion, run the regeneration CLI command (php bin/magento magera:webp:regenerate --type=product) to apply the new quality level to all existing WebP files. The old cached versions are replaced with freshly converted images at your updated setting.
Combine WebP with a Faster Checkout for Maximum Conversions
Image optimization and page load speed are critical for getting visitors to your product pages and keeping them engaged. But speed alone does not close sales — your checkout experience determines whether those engaged visitors actually convert into paying customers.
A store that loads its product images in 0.8 seconds but then forces customers through a slow, multi-step checkout is undermining its own performance gains. Research from the Baymard Institute shows that the average cart abandonment rate is 70%, and a complicated checkout process is the number-one reason cited by customers. Every additional step, page reload, or confusing form field increases the likelihood that a customer leaves without completing their purchase.
This is why pairing image optimization with MageRa One Step Checkout creates such a powerful combination. While MageRa WebP Images ensures your product pages load quickly enough to keep customers engaged, One Step Checkout condenses the entire Magento 2 checkout process into a single page with real-time validation, auto-address detection, and instant shipping calculation. The result is a store that is fast to browse and fast to buy from — from the first product image load to the final order confirmation.
Conclusion
Your Magento 2 store's images are the single largest contributor to page weight, and they are also the easiest performance win you can achieve today. By switching from JPEG and PNG to WebP, you cut image file sizes by 30-50% without any visible quality loss. Faster image loading means better LCP scores, improved Core Web Vitals, higher search rankings, and a smoother experience for every customer — especially on mobile devices and slower connections.
MageRa WebP Images makes this automatic. Install it, configure it once, and every product image, category photo, and CMS graphic on your store is converted and served in the most efficient format available. No recurring fees, no external dependencies, and no developer required.
CTA: Cut your image file sizes by 30-50% with automatic WebP conversion. Install MageRa WebP Images for Magento 2 and deliver faster page loads without losing quality. Get started today.
FAQ
Q1: Will WebP conversion reduce the visual quality of my product images? A1: No — at the default quality setting of 80, WebP images are visually indistinguishable from the original JPEG or PNG files. Independent blind tests by Google and major CDN providers have confirmed this across thousands of image samples. If your store sells products where customers zoom in on extreme detail (fine jewelry, textiles, electronics), you can increase the quality setting to 85-90 for additional fidelity while still achieving meaningful file size savings of 20-30% compared to the original format.
Q2: What happens if a visitor uses a browser that does not support WebP? A2: MageRa WebP Images uses the HTML5 <picture> element, which provides native browser-level format negotiation. When a browser that does not support WebP (such as very old versions of Internet Explorer or outdated mobile browsers) encounters the picture tag, it automatically falls back to the original JPEG or PNG image. Your visitors will never see a broken image, a blank space, or an error. The fallback is seamless and happens entirely on the client side with zero server-side overhead or user-agent detection logic.
Q3: Do I need to re-upload all my product images after installing the extension? A3: No re-uploading is required. The extension generates WebP versions of your existing images using a CLI command (php bin/magento magera:webp:generate). This command scans your media directory, converts every supported image to WebP, and stores the converted files alongside the originals. For a catalog of 5,000 product images, this process typically completes in under 10 minutes on a standard server. Your original JPEG and PNG files remain untouched — the extension never modifies or deletes your source images.
Internal Links
/blog/magento-2-lazy-load-images-performance(MageRa Lazy Load — defers below-the-fold image loading for additional page speed gains as part of the Performance Trio)/blog/magento-2-defer-javascript-performance(MageRa Defer JavaScript — shifts non-critical JS execution to improve Time to Interactive alongside WebP image optimization)/blog/one-step-checkout-magento-2-conversion-rates(MageRa One Step Checkout — combines fast-loading product pages with a streamlined single-page checkout for higher conversions)
Comments (0)
Be the first to comment.