Optimole Docs

Appearance

Compatibility with LiteSpeed Cache ​

This guide explains how to configure Optimole and LiteSpeed Cache to work together without conflicts. Both plugins optimize website performance, but overlapping features — especially around image formats and CSS/JS handling — can cause slow loading speeds or redundant processing.

Overview of Overlaps ​

Optimole and LiteSpeed Cache both include features that optimize images and serve next-gen formats like WebP and AVIF. When both plugins try to handle the same tasks, they can conflict and slow your site down instead of speeding it up.

The most common overlaps include:

  • Next-gen image formats — Both Optimole and LiteSpeed Cache can convert images to WebP or AVIF. Running both at the same time causes duplicate processing and can result in broken images or slower load times.
  • CSS and JS optimization — Optimole can serve CSS and JS files through its CDN, while LiteSpeed Cache can minify and combine these files. Enabling both features simultaneously may lead to conflicts.
  • Image optimization — Optimole handles image compression and resizing automatically. LiteSpeed Cache also includes image optimization options that may overlap with Optimole.

📝 Note: The recommended approach is to let Optimole handle all image optimization and next-gen format delivery, while LiteSpeed Cache focuses on page caching and CSS/JS minification.

Follow these steps to configure both plugins for optimal performance.

Step 1: Disable LiteSpeed's Next-Gen Image Format ​

Since Optimole automatically serves images in the best format (including WebP and AVIF), you should disable this feature in LiteSpeed Cache to avoid conflicts.

  1. In your WordPress dashboard, navigate to LiteSpeed Cache > Image Optimization.
  2. Locate the Image WebP Replacement setting.
  3. Set it to OFF.

⚠️ Important: Leaving next-gen image conversion enabled in both plugins causes double processing, which slows down your site instead of improving performance.

Step 2: Let Optimole Handle Image Optimization ​

Ensure that Optimole's image optimization features are active.

  1. Navigate to Optimole > Settings.
  2. Open the Advanced accordion and select the Compression panel.
  3. Verify that a compression mode is selected (Speed Optimized, Quality Optimized, or Custom). This ensures Optimole is actively optimizing your images.

If you are using the Custom compression mode, confirm that Automatic Best Image Format Selection is enabled so Optimole serves WebP or AVIF when supported by the visitor's browser.

Step 3: Configure CSS & JS Handling ​

LiteSpeed Cache includes CSS and JS minification features that work well for most sites. In most cases, you should let LiteSpeed handle CSS and JS minification and keep Optimole's Serve CSS & JS Through Optimole feature disabled to avoid conflicts.

However, if you find that your CSS or JS files contain image references that need optimization, you can test enabling Optimole's CSS & JS feature:

  1. Navigate to Optimole > Settings.
  2. Open the Advanced accordion and select the Compression panel.
  3. Set the compression mode to Custom.
  4. Toggle Serve CSS & JS Through Optimole on.
  5. Clear all caches (see Step 4) and test your site's performance.

💡 Tip: Only enable Serve CSS & JS Through Optimole if you notice that images referenced within CSS or JS files are not being optimized. If LiteSpeed's minification is already working well for your site, there is no need to enable this setting.

Step 4: Clear All Caches ​

After making configuration changes, clear the caches in both plugins and at the server level to ensure the new settings take effect.

  1. In LiteSpeed Cache, navigate to LiteSpeed Cache > Toolbox > Purge and click Purge All.
  2. In Optimole, navigate to Optimole > Settings > General and click Clear Cached Images. If you have Serve CSS & JS Through Optimole enabled, also click Clear cached CSS & JS.
  3. If your hosting provider has server-level caching, clear that cache as well.

Testing and Verification ​

After applying the configuration changes, verify that everything is working correctly.

Check Image Optimization ​

  1. Open your website in a browser and right-click on any image.
  2. Select Open image in new tab (or similar option depending on your browser).
  3. Look at the image URL — if Optimole is handling images, the URL will contain your Optimole CDN domain (e.g., i.optimole.com).

Test Site Speed ​

  1. Run a performance test using a tool like Google PageSpeed Insights or GTmetrix.
  2. Check that the results no longer flag issues related to next-gen image formats (since Optimole is handling this).
  3. Compare the results with any previous test scores you may have saved.

Troubleshooting ​

If you experience issues after making these changes:

  • Images not loading — Verify that Optimole is connected and active by checking the Optimole dashboard in your WordPress admin. Make sure Enable Optimole Image Handling is turned on under Optimole > Settings > General.
  • CSS or JS conflicts — If enabling Serve CSS & JS Through Optimole causes layout issues, disable it and let LiteSpeed Cache handle CSS and JS minification instead.
  • Old content still showing — Clear all caches again, including your browser cache, and wait a few minutes for changes to propagate through the CDN.
  • Automatic Best Image Format Selection — doc
  • Serve CSS & JS Through Optimole — doc
  • Clear Cached Resources — doc
  • List of Verified Compatible Products — doc

Still looking for an answer? Contact us!

Copyright (c) 2026 Optimole