Back to Community
Home / Community / General

How to Fix Asynchronous Loading Issues for WP-Optimize's Minified CSS & JS Files

20 threads Sep 16, 2025

Content

If you're using WP-Optimize to minify and combine your CSS and JavaScript files, you've likely encountered a common hurdle: performance tools like Google PageSpeed Insights or GTmetrix flagging your minified files as render-blocking resources. The challenge is that these files have dynamically generated paths, making them difficult to target with the plugin's asynchronous loading features. This article explains why this happens and outlines the most effective workarounds.

Why This Problem Occurs

WP-Optimize's minification process creates new files in a cache directory with a unique structure. The path includes a timestamp (e.g., /wp-content/cache/wpo-minify/1744226035/assets/) and the filenames themselves contain a hash (e.g., wpo-minify-header-531a0685.min.js). This dynamic naming is crucial for cache management; it ensures browsers fetch the updated file whenever the cache is purged and regenerated.

The issue arises because the fields for "Load the following CSS/JS files asynchronously" require an exact, full path to a file. Wildcard characters (*) are not supported. Therefore, you cannot use a pattern like */wpo-minify-header-*.min.css to match all possible minified files. As confirmed in multiple support threads, this is a current limitation of the plugin.

Common Solutions and Workarounds

Based on community discussions and solutions, here are the most reliable methods to handle this.

1. Load Individual Source Files Asynchronously (Recommended)

The intended method is to asynchronously load the original, unminified CSS or JavaScript files before they are processed by WP-Optimize. This prevents them from being combined and minified in the first place, allowing you to target them with a static path.

  1. Navigate to WP-Optimize > Minify.
  2. Click on the CSS or JavaScript tab.
  3. Find the "List of processed files" section and click Show information.
  4. This will reveal the original paths of all files being combined. Identify the specific file(s) you want to load async.
  5. Add the full, static path to that original file (e.g., /wp-content/themes/my-theme/style.css) to the "Load the following CSS/JS files asynchronously" box.
  6. You may also need to add the same file path to the "Exclude from processing" box to ensure it is not minified.

This approach gives you direct control over the loading behavior of specific resources.

2. Adjust Global JavaScript Loading

For JavaScript, a broader approach can be effective but requires caution.

  • Enabling "Defer all JavaScript files" can defer the minified bundles. However, this can break functionality that depends on scripts loading in a specific order (e.g., jQuery-based features from ads or forms), as seen in several threads. Test thoroughly after enabling this.
  • If deferring all JS causes issues, try the alternative: "Asynchronously load selected JavaScript files" for individual source files, as described in Solution 1.

3. Consider Disabling Minification for HTTP/2 Servers

If your hosting provider has HTTP/2 enabled (which you can check using a tool like KeyCDN's HTTP/2 Test), the performance benefit of file merging is significantly reduced. HTTP/2 can load multiple resources simultaneously. In this case, you might achieve better results by disabling CSS/JS minification and merging entirely in WP-Optimize, relying on HTTP/2 to handle the multiple file requests efficiently.

What Doesn't Work

  • Adding the dynamic minified file path (e.g., /cache/wpo-minify/1744226035/assets/wpo-minify-header-xxxxx.min.css) to the async field. The path will change as soon as the cache updates, rendering the rule useless.
  • Using wildcards (*) in the async or exclude fields to try and match the changing paths. The plugin does not support pattern matching in these settings.

Conclusion

The inability to asynchronously load the dynamically named minified files is a known constraint of WP-Optimize's architecture. The most supported and stable solution is to work with the original source files, using the "Show information" tool to identify them and then adding their static paths to the appropriate async and exclude fields. Always remember to clear your WP-Optimize and browser cache after making any changes to see the correct results in performance testing tools.

Related Support Threads Support