Autoptimize is a great cache plugin for WordPress. It helps your site to improve your site speed by minifying HTML, CSS & Javascript with some additional settings.
There are some web hosting providers like WP Engine, Godaddy, etc. that have blocked cache plugins as they have built-in the caching system.
You can still use the Autoptimize plugin to optimize your WordPress website speed. The best part of this plugin is that you can use the Autoptimize plugin with other cache plugins like WP Fastest Cache, W3 Total Cache, WP Super Cache, or even Swift.
I am using the Autoptimize plugin with WP Fastest Cache (free version) to improve my WordPress site speed.
In this post, I have shared the best Autoptimize plugin settings 2022 to Speed up your WordPress website. You can also check out my complete post on How to Speed Up WordPress Website With 100% Gtmetrix Score.
Table of Contents
Why Should You Choose Autoptimize?
- Autoptimize is compatible with all the web hosts.
- Autoptimize offers most of the optimization options for free.
How To Properly Configure Autoptimize Plugin 2022
Under JS, CSS & HTML Tab
JavaScript Options:
Aggregate JS-Files – Enable this option as this will combine all the javascript files. If this option is off, all the javascript files will load individually.
Also, Aggregate Inline JS – Enable this as it will combine all the javascript files from the HTML. If any part of your site breaks then disable this option.
Force Javascript in < Head> – Disable this option. Forcing javascript files to load in the header may slow down your site speed.
Exclude scripts from Autoptimize – You can exclude specific javascript files that will not be optimized. By default Wp-includes/js.dist/, wp-includes/js/tinymce/ & js/jquery/jquery.js are excluded. Just enter the path of the javascript file that you want to exclude.
Add try-catch wrapping – disable this. Enable this option if you have any JS errors.
CSS Options:
Optimize CSS Code – Enable this.
Aggregate CSS – files – Enable this as it will combine all the CSS files into a single file.
Also Aggregate Inline CSS – Enable, just like inline Javascript files, checking this option will inline all CSS files from HTML which will reduce the page size.
Generate data: URLs for images – Enable this if you are not using any CDN. It includes small background images in the CSS file instead of as separate downloads. This will make fewer HTTP requests. But if you are using any CDN then disabling it is an option.
Inline and Defer CSS – Enable this. Run a speed test in Gtmetrix. If any CSS file is still showing, then you can line and defer the CSS file. The best tool to inline and defer CSS is criticalpathcssgenerator.
First, enter your website URL.
Next copy the entire codes from the CSS file and paste that code into the full CSS box.
Now, click on the create critical path CSS button to generate the file.
Next, copy the newly CSS file codes and paste that into the inline and defer the CSS box.
If you have more than one CSS file then you can generate separate codes, just give some space in the inline and defer CSS box and paste those codes.
Inline All CSS – Disable this. You can either choose a line and defer CSS or line all CSS. Autoptimize does not recommend enabling inline CSS files.
Exclude CSS From Autoptimize: same as the exclude JS files, you can exclude certain CSS files. If you are getting any errors from any CSS setting then you can paste the path to exclude them.
HTML Options:
Optimize HTML Code – Enable this. This will reduce the page size by removing whitespace.
Keep HTML Comments – Enable, if you want to optimize your blog comments otherwise Disable this.
CDN Options
If you are using any CDN, then you have to enter your CDN URL here. Some of the CDNs recommended By WordPress.org are Amazon Cloudfront, MAX CDN (Stack Path) & Cloudflare.
Cloudflare does not provide CDN URLs, instead, you have to change your Nameservers. So, if you want to set up Cloudflare CDN then you can check out our blog on how to set up Cloudflare CDN.
Misc Options:
Save aggregated script/CSS as static files – I will recommend Enable this as it will serve cache CSS and Javascript files through your server. You may need to disable this option if your web server doesn’t properly handle the compression.
Minify excluded CSS and Javascript Files – Enabling this will also minify the excluded CSS & JS files. But if your site breaks or you see any minification-related issues then uncheck this option.
Experimental: Enable 404 Fallbacks: Disable this.
Also, Optimize For Logged In Editors/ Administrators: This option is up to you. You can either enable or disable this for your editors/administrators.
Image Optimization:
Autoptimize plugins also come with built-in ShortPixel for image optimization. You can even optimize your image to load on WebP format in supported browsers.
But if you are using any other image optimization like Smush, Imagify then you can skip this image optimization part.
Optimize Images: This will load your images from Shortpixel’s CDN & your images will load faster.
Image Optimization Quality: You can choose any of the three image optimization quality options. But you might be thinking about which one is the best choice for your website. So here is the difference between all three types of image compression.
Among all these three options, I use Glossy for my site.
Load WebP in supported browsers: Enable this option, as it will load the WebP version of your images on the supported browsers.
Lazy load images: It means that the images will load as the visitor scroll down the page which makes your website load faster. So, I will recommend enabling this option.
Critical CSS
Critical CSS is a paid feature and you have to install the Autoptimize criticalcss.com power-up plugin. The plans start at $7/month.
Extra Auto-Optimizations
Google Fonts: If you are using Google Fonts on your site then you can either choose Combine and link in the head (fonts load fast but are render-blocking) or Combine and load fonts asynchronously with webfont.js. Test both of these settings one by one and see which one works best for your website.
Remove Emojis – Enable this option. removing emojis will reduce your page size.
Remove Query Strings From Static Resources: Enable this. This will remove your score in Google page speed, gtmetrix, Pingdom, and other website speed test sites.
Preconnect To 3rd Party Domains: Here you have to enter the URL of the content/script page like Google analytics, Google fonts, etc. This will begin the process of connecting 3rd party domains before the request is made on the browser and thus improves your Website speed.
Preload Specific Requests: This will tell the browser to download an asset as soon as possible. This will speed up the loading time of those assets like fonts, scripts, etc.
Async Javascript Files: This will load certain external javascript files asynchronously which improves your WordPress website speed. You can use the Async Javascript plugin for this.
Optimize Youtube Videos: If you have youtube videos on your site, then you can use the WP Youtube Lyte plugin which is also developed by Autoptimize developers. This will lazy load Youtube videos just like the images and will load when a visitor scroll down & clicks the play button.
Optimize More:
You can also watch my video, where I have covered almost everything on how to speed up WordPress website 2022 for free with timestamps in the video description.
Autoptimize Plugin FAQs:
How Do I Use Autoptimize Plugins?
Just install & activate autoptimize plugin on your WordPress website. Then optimize javascript, CSS, HTML files. You can also check out this blog post.
How to Properly Configure Autoptimize?
Aggregate JS-Files – enable Also, Aggregate Inline JS- enable Force Javascript in < Head> – disable Exclude scripts from Autoptimize – You can exclude any scripts here. Add try-catch wrapping – disable Optimize CSS Code – enable Aggregate CSS – files – enable Also Aggregate Inline CSS – enable Generate data: URLs for images – Enable Inline and Defer CSS – Enable inline All CSS – Disable Exclude CSS From Autoptimize: Here you can exclude any CSS file from optimization. Optimize HTML Code – Enable Keep HTML Comments – Enable
How To Optimize Google Fonts Using Autoptimize Plugin?
You can choose to combine and link in the head option and enter the font URL in the Preconnect box.
Conclusion:
Autoptimize is one of my favorite plugins for WordPress speed optimization & It is easy to set up.
Apply all the recommended autoptimize plugin settings 2022 to improve your WordPress website speed & you can also use this plugin with other cache plugins.
If you have any queries regarding WordPress speed optimization, then fill free to comment below.
A2 Hosting
Starting At $2.99/month
