Avada is one of the most popular and best-selling WordPress themes of all time. It is a multipurpose WordPress theme that is packed with a lot of features and options. However, due to several reasons like lack of caching, data-heavy images, CDN, and many more your site may experience page loading slowdown. That is why I have come up with this guide to show you how you can boost your site’s loading performance by optimizing the Avada theme.
So, if you are looking for the processes of Avada speed optimization, then keep on reading this guide. I am going to share all the essential suggestions which will help to improve Avada’s overall speed on your site.
Testing Avada’s Performance
To get the best scenario and understand how well this theme performs, WP rocket conducted a test.
- First, using WebPageTest they have tested an Avada demo site’s different pages for both desktop and mobile.
- After that, they activate the WP Rocket caching plugin and re-test the same pages to see the changes.
In order to get a more accurate result, they have also installed additional plugins like Avada Core, Avada Builder, Contact Form 7, Imagify, and more. From the tests, you can see the following data.
- Largest Contentful Paint – LCP
- Time to first byte – TTFB
- Page size
So, here’s the test result of Avada without any added performance optimizations. This test only uses Avada’s built-in optimization features, including lazy loading, file combinations, and any functionality features that Avada enables by default while importing a full demo site.
Speed Result For Desktop
|Homepage||0.773 s||0.398 s||348 KB|
|About Us||0.869 s||0.478 s||430 KB|
|Services||0.889 s||0.498 s||333 KB|
|Blog Page||0.927 s||0.520 s||413 KB|
|Contact||1.219 s||0.821 s||335 KB|
Speed Result For Mobile
|Homepage||2.561 s||1.130 s||384 KB|
|About Us||3.215 s||1.083 s||394 KB|
|Services||2.513 s||0.960 s||333 KB|
|Blog Page||2.351 s||0.825 s||413 KB|
|Contact||2.432 s||0.887 s||335 KB|
Now, as you can see, the desktop result is quite good, but the mobile result is not up to the mark. The LCP time is a bit lower than Google’s recommended 2.5 seconds for the maximum pages. With that in mind, let’s move forward to the next section.
The Avada Speed Optimization Process
Now that I get the speed result of the Avada theme, it’s time to find out how you can optimize the Avada theme to improve the speed performance. Here I will share two different processes.
First, I will show you how you can boost the speed using the WP Rocket plugin, and then I will show you how you can optimize the Avada plugin by customizing its in-built features and functions. So, let’s see how the processes work.
Method 1: Using Plugin (WP Rocket)
You just need to install and activate the WP Rocket plugin on your WordPress site. And then, re-run all the tests like before. As per the tests of WP Rocket, here’s the speed result after installing the WP Rocket plugin.
Speed Result For Desktop
|Homepage||0.419 s||0.040 s||309 KB|
|About Us||0.434 s||0.072 s||339 KB|
|Services||0.353 s||0.066 s||255 KB|
|Blog Page||0.311 s||0.039 s||337 KB|
|Contact||0.337 s||0.044 s||259 KB|
Speed Result For Mobile
|Homepage||1.846 s||0.573 s||309 KB|
|About Us||1.808 s||0.544 s||302 KB|
|Services||1.739 s||0.538 s||255 KB|
|Blog Page||1.855 s||0.541 s||285 KB|
|Contact||1.765 s||0.564 s||259 KB|
And with this plugin, the LCP and TTFB of pages have been reduced by almost half (or more on the desktop). In addition, it is able to save 80-90 KB from the file size.
Method 2: Optimizing Avada’s Settings or Features
If you don’t want to use any other plugin, there is an easy option for you. One of the simple ways to improve Avada’s performance and speed is tweaking the theme’s settings. So, let’s see the overview of where you can tweak your setting.
Configure the Performance Tab
- Activate Lazy Loading: It is highly recommended to stick with only Avada lazy loading. And if you have any lazy loading plugins, make sure to disable them. Go to Avada from your WordPress dashboard. Navigate to Theme Options > Performance > Performance > lastly, Enable Lazy Loading.
- Disable The WordPress Emoji Script: Remember, the fewer scripts run on your site, the better. Therefore, if you are not using emojis, it will be better to disable them. You will find this option in the same place as lazy loading.
- Disable Load Media-Queries Files Asynchronously: It is another feature that can help the Avada theme to perform better with faster speed. Just like before, go to the performance section > Dynamic CSS & JS > turn on Load Media-Queries Files Asynchronously.
- Preload Key Fonts: Make it None.
- jQuery Migrate Script: Unless you require the jQuery migrate script for a plugin, it is better to keep it disabled.
- Turn On The Load jQuery In Footer: Depending on your website’s content and plugins, this setting will vary. Though the best approach will be to keep it on, you can disable this function if you see any issues on your site after turning it on.
- Turn Off The Load Stylesheets In Footer: if you keep this function on, it will lead to a high CLS score. The perfect way to defer the styles is to use the critical CSS option, and the best part about it is that it will automatically bring the rest of the styles to the footer.
Dynamic CSS & JS
- CSS Compiling Method: To compile the dynamic CSS to files you need to select the “File” mode. If you want to cache the CSS in your database, select the “Database” mode. And lastly, if you want, you can disable this option also.
- Enable Critical CSS: To enable the generation of critical CSS, make this function “on,” and you will be able to manage from the critical CSS page.
- Disable The CSS Animation On Mobiles: If you use CSS animation, it will be better if you disable this item for mobile devices. This is because some animation doesn’t even work on mobile devices properly. Or, if you don’t use this feature at all, make sure to disable them altogether.
Progressive Web App
- Enable Progressive Web App: It is a caching app under development at Google. If you want to enable this feature or option on your website, simply enable this.
- Cache-First Strategy File Types: You can use this feature for static assets like images and fonts, which don’t change. The files you add to this list will be cached in the browser.
- Network-First Strategy File Types: It is recommended to use if you update your website’s content frequently.
- Stale-While-Revalidating Strategy File Types: You can use this when assets get updated, but the latest version is unnecessary. This serves the added file with a cache-first strategy.
There are different post types, for example, Avada Portfolio, Avada Forms, Avada Slider, and Avada FAQ. You should make these post types disabled to reduce the overall footprint of the Avada theme and boost the performance.
Navigate to Advanced and select Post Types on your WordPress dashboard. Here you will find the option to disable different types of posts in Avada completely.
Avada Builder Elements
While using the Avada theme, it will be a great idea to disable any items from the Avada builder elements which you are not using. Simply head to your Avada dashboard, then go to Options > Builder Options > Avada Builder Elements. After that, disable all the unused items, but do it carefully as this will remove all the disabled functions from all your old or new pages/posts.
The best part is that using the Element Scan button from the same; you can deselect all the unused elements of your site automatically. All you need to do is, run this button to scan your site and then save the options.
Additional Site Optimization
Actually, the Avada theme is already super optimized, and it loads super fast on its own. And to get the most out of it, simply tweak the features and settings like above. Apart from this, you can also do the following optimization to get a much better result.
- Make sure to have good quality hosting suited to WordPress to improve the website’s server response time.
- Always use the updated PHP version.
- To improve minification, you can use plugins.
- Use a quality CDN.
The number of users speaks for the Avada theme. You can use this multipurpose theme to build almost any type of WordPress website. Optimizing the Avada theme to boost the speed you can make the most out of it for your site.
So, that’s a wrap for Avada speed optimization. I hope you found this guide helpful and managed to boost your site speed as well. If you have any questions regarding this topic or any thoughts, don’t forget to drop a comment below.