Best Autoptimize Configuration Settings 2022

Many Bloggers Search Google, Yahoo and Bing daily for the Best Autoptimize Configuration Settings to Boost Page Speed and Search Engine Optimization (SEO). However, only a few get satisfactory answers.

Study Smarter

I was a constant searcher of the right Autoptimize settings for my Blog. I always find bunch of articles on the Internet regarding Autoptimize Configuration Settings. Some of these articles were helpful to me, yet many questions were begging for answers.

Besides my questions they couldn’t answer on hot cake Autoptimize settings, most of the articles didn’t consider the Latest Autoptimize Version. At least Autoptimize has been updated and there is a new settings layout in 2022.

In addition, there is a big difference between the Best Autoptimize Settings and the Best Autoptimize settings for your WordPress Blog.

The best Autoptimize configuration settings for others may not be the best for you. Blogs layout and functionality differ. It is therefore imperative for you to get a flexible guide on Autoptimize Configuration Settings.

How Sophie Made Learning Fun

Now, after years of research and playing around the Autoptimize Configuration settings, I have found the right Settings you can apply without breaking your blog. Are you ready for this?

Recommended: Best WordPress plugins

Note: I have created so many blogs and as well handled a lot of WordPress Optimization services for many bloggers and Website Owners. This guide is based on my personal experience here at Flashlearners and Other blogs I manage.

Autoptimize Plugin Settings 2022

Autoptimize Plugin is one of the must-have plugins for any blogger using the WordPress platform. Autoptimize is a WordPress Plugin that makes your blog faster by Optimizing your HyperText Markup Language (HTML), Cascading Style Sheet (CSS) and Javascript (JS) Codes.

I have discussed HTML, CSS and Javascript in another article. You may want to go through it here if you see any need to learn Coding and HTML Basics for bloggers.

If you are already familiar with the Autoptimize plugin and what caching is all about then scroll down to 2022 Autoptimize configuration Settings. Else, go through the next few paragraphs to Understand caching, Minification, Caching plugins and what Autoptimize Plugin does in a WordPress Blog.

Is Autoptimize A Caching Plugin?

Autoptimize is not a complete caching plugin since it doesn’t handle page caching. What Autoptimize does is HTML, CSS and JS minification, Caching of Minified Codes and Optimization of HTML, CSS and Javascript.

Since Autoptimize doesn’t handle page caching, it is recommended (even by autoptimize team) that you install another plugin for page and browser caching. That is if you Consider website speed Performance very important.

What is Caching And Why Minification?

Caching is the process of generating and saving copies of optimized posts and other files on your server so that visitors can access them easily instead of waiting for your server to process heavy/unoptimized files. This will make your blog load faster and as well reduce the load on your server.

Minification, on the other hand, means to reduce the size of html codes, the size of CSS codes and the size of Javascript codes to make your blog lighter. The size of your blog is generally called page size. Minification and image compression goes a long way to boost your page speed.

What are Caching Plugins?

A caching plugin is a Plugin used for caching. A typical caching plugin generates static HTML pages of your website and saves it on your server. Each time a user tries to access your website, your caching plugin serves up the lighter HTML page instead of processing the heavier WordPress PHP codes.

The main types of Caching are Page Caching, Browser Caching, Database Catching and Object Caching.

If Speed is of importance to you, then you must be using one of the following WordPress Caching plugins alone or alongside Autoptimize:

W3 Total Cache
WP Super Cache
Cache Enabler
Wp Speed of light
Wp Fastest Cache
HyperCache
Comet Cache
Wp Rocket

I mentioned W3 Total Cache as the best WordPress Caching plugin I have used. On the other hand, it may not be the best for your blog.

Your theme and Plugins go a long way to determine the best Caching plugin for you. Some caching plugin settings break some theme and Plugins functionality.

Therefore, you may want to test the Caching plugins above and then use Website Speed testing tools to see which works best for your blog.

After activating any plugin, clear your browser cache and check if everything is working perfectly for you. If anything breaks, then go back to the plugin settings or switch to another Caching Plugin.

Important Things To Note:

Do not use Autoptimize and more than one of the caching Plugins above
You can use Cloudflare with other caching plugins
You can use Cloudflare alone without Autoptimize or Other Caching Plugins
You can use Autoptimize, Cloudfare and a Caching Plugin Together.
Disable minify in Cloudflare and the Caching plugin (if you are using any) to use Autopmize without any issue.

Remember, the aim is a better user experience and higher Google ranking.

Autoptimize Configuration Settings 2022

The first step is to install and Activate the Autoptimize Plugin. Then go to settings; You will find the following Autoptimize Configuration Settings:

JavaScript Options
CSS Options
HTML Options
Images and
Extra Settings.

I will now go into the Autoptimize settings above one after the Other. Before then, at the top of the Settings, click on Show advanced settings to access all the settings.

Configuring Autoptimize Javascript Options

Enable Optimize Javascript Code: This is a compulsory setting if you wish to Optimize your Javascript codes using Autoptimize.
Enable Aggregate JS Files: This makes your blog visible while it is still loading instead of showing white, black or Empty areas while the page has not fully loaded. If your comment reply button or other features stop working, disable this option and enable Do not aggregate but defer option.
Enable Also Aggregate Inline Js: After enabling this, check if your Sharing buttons or author box still works well. My author box layout changed the first time I ticked this box (but later stabilized).
Disable for Javascript in head: JavaScript in head (in a webpage, we have the header, body, and footer) can make the JS file load fast. But nothing will show on your page until the Javascript has fully loaded. So, disable it.
Leave Exclude Script from Autoptimize: You may deliberately not want some Javascript files to be optimized due to compatibility issue or reasons best known to you. You can leave this Autoptimize setting the way it is or tweak It you know what you are doing.

Configuring Autoptimize CSS Options

Enable Optimize CSS Code: This is a compulsory setting if you wish to Optimize your CSS codes with Autoptimize Plugin.
Enable Aggregate CSS Files: This makes your blog visible while it is still loading instead of showing white, black or Empty areas while the page has not fully loaded. This is called Eliminating Render blocking CSS.
Enable Also Aggregate Inline CSS: After enabling this, check if your Site layout is still okay. If it breaks CSS code in your blog then disable it.
Enable Generate Data, URLs for Images: Disable this only if you are using CDN to load images. Enable this even if you are using Cloudflare.
Inline and Defer CSS: Enable this if you can generate Above the fold critical CSS for each of your pages. Else it won’t be helpful. I was using this option because I could generate Above the Fold CSS for my blog using Jonas Ohlsson’s critical path css generator. However, it reduced the Code to Text Ratio of https://flashlearners.com to 4% and some pages were giving bad layout shift.
Inline All CSS: Do not inline all CSS. It is either you Inline and Defer CSS, Inline or CSS or disable both. I’m not using any of them. Inline all css is good only for sites with very low visitors. If you have low pageviews then try it. If you get above 500 thousand page views monthly (I think that’s quite high), You may disable it.
Leave Exclude CSS from Autoptimize: You may deliberately not want some CSS files to be optimized due to compatibility issues. You can leave this Autoptimize setting the way it is or tweak It if you know what you are doing.

Autoptimize HTML Options

Enable Optimize HTML Code
Don’t tick keep HTML Comment.

Other Things to Do

Leave CDN Option if you are not using KeyCDN or other Content Delivery Network (CDN). Also, leave it blank if you are using Cloudflare.
Cache info shows your Cache folder and the number (and size) of styles and scripts that are cached. You don’t need to do anything.
Misc Options: Tick all the Misc Options.
Save Changes and Empty Cache.

Autoptimize Extra Settings

Google Fonts: I left Google fonts because I already removed it in my theme settings. It increases external requests and slows down your blog a little. If you want Google fonts, simply choose Combine and load asynchronously or leave as it is.
Remove Emojis: Remove them because they are not necessary.
Enable Remove Query strings from static resources. I disabled it in Autoptimize because I have already enabled in under Page Cache and Browser Cache in W3 Total Cache.
Leave other settings unless you really understand what you are getting yourself into
Save Changes.

Autoptimize Image Optimization Settings

Optimize Images: Enable this if you already don’t use an Image Optimization Plugin or CDN to Load Images. I tried the feature but I didn’t like it. It increased the number of requests to my blog.
Disable Lazy-Load Image: This feature is very good. Your images load as you scroll instead of loading once. However, it is not Good for Opera mini browser on many Phones. Some times, the images don’t load at all. If yo enable it and everything works in your case, then enable.

Best Settings When Using Autopimize And Cloudflare

Disable Minify on Cloudflare: Untick JavaScript minify, CSS Minify and HTML Minify.
Follow the Autoptimize Configuration Options Above
Your site would break if you are using Autoptimize and Cloudfare Minify.
You Enable Cloudflare Rocket Loader With Autoptimize if it doesn’t break your Site or affect the layout.

Best Setting When Using Autoptimize + Cloudflare + W3 Total Cache

Disable Minify on Cloudflare: Untick JavaScript minify, CSS Minify and HTML Minify.
Disable minify in W3 total Cache general settings.
Follow the Autoptimize Configuration Options Above
Your site would break if you are using Autoptimize, Total cache and Cloudfare Minify.
You Can Enable Cloudflare Rocket Loader With Autoptimize if it doesn’t break your Site or affect the layout.

Best Configuration Settings When Using Autoptimize And W3 Total Cache

Disable minify in W3 total Cache general settings.
Follow the Autoptimize Configuration Options Above
Your site would break if you are using Autoptimize and Total cache Minify together.
You Can Enable Cloudflare Rocket Loader With Autoptimize if it doesn’t break your Site or affect the layout.

Best Configuration When Using Autoptimize + Cloudflare + Wp Super Cache

Disable Minify on Cloudflare: Untick JavaScript minify, CSS Minify and HTML Minify.
Disable minify in WP Super Cache
Follow the Autoptimize Configuration Options Above
Your site would break if you are using Autoptimize, super cache and Cloudfare Minify.
You can Enable Cloudflare Rocket Loader With Autoptimize if it doesn’t break your Site or affect the layout.

Best Settings When Using Autoptimize And Wp Super Cache

Disable minify in WP Super Cache.
Follow the Autoptimize Configuration Options Above
Your site would break if you are using Autoptimize, super cache and Cloudfare Minify together.
You can Enable Cloudflare Rocket Loader With Autoptimize if it doesn’t break your Site or affect the layout.

Best Configuration When Using Autoptimize + Cloudflare + Cache Enabler

Disable Minify on Cloudflare: Untick JavaScript minify, CSS Minify and HTML Minify.
Disable minify in Cache Enabler
Follow the Autoptimize Configuration Options Above
Your site would break if you are using Autoptimize, cache Enabler and Cloudfare Minify together.
You can Enable Cloudflare Rocket Loader With Autoptimize if it doesn’t break your Site or affect the layout.

Configuration Settings If You Are Using Autoptimize and Cache Enabler

Disable minify in Cache Enabler
Follow the Autoptimize Configuration Options Above
Your site would break if you are using Autoptimize, cache Enabler and Cloudfare Minify together.
You can Enable Cloudflare Rocket Loader With Autoptimize if it doesn’t break your Site or affect the layout.

Best Configuration When Using Autoptimize + Cloudflare + Wp Speed of Light

Disable Minify on Cloudflare: Untick JavaScript minify, CSS Minify and HTML Minify.
Disable minify in WP Speed of Light Plugin
Follow the Autoptimize Configuration Options Above
Your site would break if you are using Autoptimize, Speed of Light Plugin and Cloudfare Minify together.
You can Enable Cloudflare Rocket Loader With Autoptimize if it doesn’t break your Site or affect the layout.

Autoptimize Configuration Settings When Using Autoptimize And Wp Speed of Light

Disable minify in Wp Speed of Light Plugin
Follow the Autoptimize Configuration Options Above
Your site would break if you are using Autoptimize, WP Speed of Light and Cloudfare Minify together.
You can Enable Cloudflare Rocket Loader With Autoptimize if it doesn’t break your Site or affect the layout.

Best Configuration When Using Autoptimize + Cloudflare + Comet Cache

Disable Minify on Cloudflare: Untick JavaScript minify, CSS Minify and HTML Minify.
Disable minify in Comet Cache
Follow the Autoptimize Configuration Options Above
Your site would break if you are using Autoptimize, Comet Cache and Cloudfare Minify together.
You can Enable Cloudflare Rocket Loader With Autoptimize if it doesn’t break your Site or affect the layout.

Best Configuration When Using Autoptimize + Cloudflare + Zen Cache

Disable Minify on Cloudflare: Untick JavaScript minify, CSS Minify and HTML Minify.
Disable minify in Zen Cache
Follow the Autoptimize Configuration Options Above
Your site would break if you are using Autoptimize, Zen Cache and Cloudfare Minify together.
You can Enable Cloudflare Rocket Loader With Autoptimize if it doesn’t break your Site or affect the layout.

Best Configuration When Using Autoptimize + Cloudflare + Wp Rocket

Disable Minify on Cloudflare: Untick JavaScript minify, CSS Minify and HTML Minify.
Disable minify in WP Rocket Plugin
Follow the Autoptimize Configuration Options Above
Your site would break if you are using Autoptimize, WP Rocket Plugin and Cloudfare Minify together.
You can Enable Cloudflare Rocket Loader With Autoptimize if it doesn’t break your Site or affect the layout.

Best Configuration When Using Autoptimize + Cloudflare + HyperCache

Disable Minify on Cloudflare: Untick JavaScript minify, CSS Minify and HTML Minify.
Disable minify in HyperCache
Follow the Autoptimize Configuration Options Above
Your site would break if you are using Autoptimize, HyperCache Plugin and Cloudfare Minify together.
You can Enable Cloudflare Rocket Loader With Autoptimize if it doesn’t break your Site or affect the layout.

Autoptimize Settings Questions And Answers

1. Why Do We Use Autoptimize and Caching Plugins Together? Autoptimize doesn’t support page caching. It only caches HTML, CSS and Javascript files. Use Autoptimize and a Caching plugin to improve performance.

2. Why am I getting Render Blocking issue after enabling this Plugin? It is because you forced JavaScript in the head. Disable this option in Autoptimize Javascript option.

3. What is the use of “inline and defer CSS”? Autoptimize defer unnecessary CSS to make the make render faster.

4. Can I use Autoptimize with Cloudflare Rocket Loader? Yes, you can use Autoptimize with rocket loader. I used Autoptimize with Cloudflare Rocket loader for a very long time.

5. Does Autoptimize Image Optimization work with other Image Optimization plugins? No need enabling both Autoptimize Image Option and a Plugin like Wp smush since they perform similar functions.

6. Does Autoptimize Improve ranking? yes, it does. Speed and Optimization of your blog is a ranking signal.

7. Must I use Autoptimize on my blog? No, there are other bunch of great plugins to use.

8. Is Autoptimize an SEO Plugin? Not really. Checkout dedicated SEO Plugins here.

9. Autoptimize And Cloudflare Rocket Loader Issue: Disable rocket loader if experience issues.

10. Can I Use Cloudflare Alone? You can use Cloudflare along. Cloudflare will work fine without Autoptimize or any other Caching Plugin. You may want to go through my Cloudflare setup tutorials.

I am more than convinced that you found this article helpful. Feel free to drop your comment and don’t fail to share with friends.