Easy methods to Pace Up and Optimize Avada for Free Utilizing Our Smush and Hummingbird Plugins

Avada is already probably the most in style premium WordPress themes obtainable. We’re going to make it even higher by enhancing it with our free optimization instruments ― Smush and Hummingbird.

It’s not unusual for WordPress websites constructed with Avada to expertise web page loading slowdowns. This could occur for a wide range of causes, together with data-heavy pictures, lack of caching, CDN high quality, and a “host” of different tangibles. (Pun meant.)

That is the place two of our optimization plugins shine. Smush and Hummingbird could make a severe affect on the subject of getting (and protecting) your website working at optimum velocity.

With a contemporary Avada set up, we’re going to tweak some settings and run a couple of assessments to see simply how a lot of a (loading time) distinction Smush and Hummingbird could make on an Avada themed website.

We’ll additionally current some further recommendations that may enhance Avada’s total velocity in your website.

Once we’re executed, you’ll have some nice data and assets in your arsenal to get your Avada website to function lightning quick.

Be happy to leap forward to any of the article sections:

Avada Theme Testing Setup

Process
Parameters
Particulars

Hitting Peak Speeds Utilizing Smush & Hummingbird with Avada

Theme 1 – Avada Spa
Theme 2 – Avada Traditional

Ideas for General Pace Features in Avada
Quick & Furiously Optimized

Maintain studying to take a look at our course of, and the measurable outcomes.

Avada Theme Testing Setup

”Avada is the Swiss military knife of WordPress themes.” – Collis Ta’eed, CEO of Envato

Avada. Is. In every single place. With over six million customers, it’s the primary promoting WordPress theme on ThemeForest.

Have you ever needed to make use of this in style theme builder to your website, however had been involved concerning the loading latency that always happens? We’ve been there, and may let you know there may be a straightforward ― and free! ― method to make nice strides in enchancment.

Let’s take a look at what we’ll be doing to perform this.

Process

Be aware: We’ve indicated under which steps contain no value vs. some value.

Set up Avada Theme Builder & theme on a clear WP website (requires Avada theme license.)
Tweak Avada optimization settings (no value)
Set up Smush; optimize settings (no value)
Set up Hummingbird; optimize settings (no value)
Activate CDN in Hummingbird (requires Hummingbird Professional)
Activate FastCGI within the Hub (by way of WPMU DEV Internet hosting)
Run velocity assessments, after every step above (no value)
Repeat total process once more, utilizing a unique Avada theme (no value if you happen to’ve already bought Avada theme license.)

Parameters

We’ll be utilizing a clear basis, which means, our website will likely be constructed on a model new WordPress set up.
Theme configurations and choices will likely be stored static after preliminary set up.
My internet hosting is the Bronze plan, by way of WPMU DEV Managed WordPress internet hosting.
My area is USA/East.
Plugins are Smush and Hummingbird solely.
(When you’re utilizing our internet hosting, you will notice the WPMU DEV Dashboard plugin, because it’s mechanically put in on websites hosted by us.)
GTmetrix velocity testing executed utilizing their default server location (Vancouver, Canada), and default browser (Chrome Desktop).

Particulars

Websites hosted by WPMU DEV will set up the Professional variations of Smush & Hummingbird. To reflect non-pro variations of the plugins, I carried out all of my preliminary assessments with the Professional options disabled.

Hummingbird optimization makes use of various kinds of caching and compression options on websites. Web page, Gravatar, and RSS caching had been disabled. Most hosts, together with WPMU DEV, sometimes activate browser caching and GZip compression by default. Since we will’t flip these off with out impacting different settings, they’ll stay on throughout our assessments.

Lastly, as we’ve talked about in different optimization articles, please notice that nobody could have the very same outcomes, due to the variables inherent to every ingredient. Your geographical area, the dimensions of your media library, your internet hosting supplier, all paint a part of the image utilizing very completely different brushstrokes. However regardless of your specific website surroundings, you’re sure to see marked enchancment with this course of.

Alright, let’s hit the monitor.

Hitting Peak Speeds Utilizing Smush & Hummingbird with Avada

In preparation for this course of, let’s make our device kits match, like sisters on image day. (Was it solely my mother who did that with us?) When you haven’t already, obtain the Avada Web site Builder. You’ll additionally want the Smush & Hummingbird plugins (each of that are free), however we’ll add these somewhat later.

For our velocity measurement instruments, we’ll be utilizing Google PageSpeed Insights and GTmetrix, so that you would possibly wish to open these two websites now.

Ensure you are beginning on a brand new WP website, with no new pages or posts created, and no non-obligatory plugins or add-ons activated.

Subsequent, set up the Avada web site builder. There are two further Avada plugins required ― Core, and Builder ― so we’ll go forward and set up them as effectively.

Avada’s Core and Builder plugins should be put in to make use of the theme builder.

Theme 1 ― Avada Spa

Time to make our precise theme choice. For this primary check, we’ll use Avada Spa. It doesn’t require any further plugins, however has a good variety of pictures, so it looks like a very good one to attempt. It’s tucked into the pre-built library within the Avada dashboard, and set up is a couple of easy clicks.

Choose solely the content material you wish to import throughout theme set up.

With our theme put in and utilized, and earlier than we begin tweaking or including something, we should always get an preliminary snapshot of our velocity.

GPSI offers us a good to middlin rating.
GTM is on a par with Google for our preliminary velocity check.

Each scores fall within the “7Os” or “C” vary. We will undoubtedly do significantly better.

I wish to look into Avada’s built-in optimization settings, make some changes there, and see if we get web page velocity enhancements.

A snippet of Avada’s built-in optimization menu.

From the Choices/Efficiency menu tab, listed here are the adjustments I made:

Efficiency

Picture Lazy Loading >> from None to Avada
Font Face Rendering >> from Block to Swap All
Preload Key Fonts >> from Icon Fonts to All
Load Stylesheet in Footer >> from Off to On

Dynamic CSS & JS

Load Media-Queries Recordsdata Asynchronously >> from Off to On

With all adjustments saved, we’ll test our velocity.

Double sevens, so we tapped up a smidge.

Let’s attempt the primary of our optimization plugins, and activate Smush.

Smush is our consumer’s alternative, award successful, and benchmark examined picture optimizer.

Upon navigating to the Smush dashboard, you ought to be greeted with the fast setup wizard. These settings embrace: Auto Compression, EXIF Metadata, Full Dimension Photos, Lazy Load, and Utilization Information.

Right here’s what every function does:

Auto Compression ― will mechanically optimize new picture uploads, so that you don’t must do every one manually.
EXIF Metadata ― will strip digicam settings out of your pictures, serving to cut back file dimension. (Don’t fear; it received’t strip web optimization metadata).
Full Dimension Photos ― will compress your authentic full dimension pictures. (Be aware: by default, it shops copies of your originals, in case you ever wish to revert again.)
Lazy Load ― will cease offscreen pictures from loading till a customer scrolls to them.
Utilization Information ― will let our designers achieve perception into what options want enchancment. (Your private information will by no means be tracked.)

Go forward and run by way of every display screen, leaving default settings on. (Permitting Utilization Information will assist in direction of the performance of future variations of the plugin, but when it makes you uncomfortable within the least, go away it off.)

Smush makes recommendations to maximise picture compression.

As soon as the wizard completes, the dashboard will mirror what number of pictures may use compressing. Hulk smash that Bulk Smush Now button!

What do our picture optimization stats appear like now, Mdm. Smush?

54 pictures smushed, saving 3.2 mb. Smushing like a champ!

Let’s see how a lot that lightened the (web page) load, and do our velocity assessments once more.

That’s a reasonably good soar! Virtually ten factors.
“B”it by bit, we’re on an upward trajectory.

Time to kick issues into excessive gear, and have Hummingbird alight on the scene.

Hummingbird is every thing you might want to get your website working quick.

After putting in and activating Hummingbird, going to the dashboard will activate one other fast setup wizard. This time, she’ll simply recommend working a efficiency check, which is strictly what we wish to do.

As soon as the check is full, you’ll get a notification letting you understand.

The dashboard reveals us the rating from the efficiency check.

83 just isn’t too shabby! We’re already flying, however we’ve but to hit our highest altitude.

Hummingbird gives lists and a chart of various metrics and audits that had been rated throughout the efficiency check.

Hummingbird tracks six metrics within the Efficiency part of the Lighthouse report.

She additionally gives further rating metrics known as Audits. These separate points into the classes of: Alternatives, Diagnostics, and Handed Audits ― all suggestions for enhancing your efficiency rating.

Alternatives are principally color-coded alerts. Yellow signifies a gentle to average subject, and Crimson means the difficulty is considerably impacting efficiency.

On this efficiency analysis, Hummingbird has indicated that I’ve 3 Alternatives, which as least certainly one of is excessive precedence (pink squoval).

To resolve these Alternatives, click on on any alert row, and it’ll show:

an in depth description of the difficulty
a listing of particular property concerned
step-by-step directions on resolve the difficulty

You don’t must go digging by way of pages of directions or do mad googling; Hummingbird spells every thing out for you on any flagged points.

It’s a good suggestion to deal with these, and that’s what I’ll do now. When you’ve made the fixes, you’ll be able to transfer on to the subsequent step… asset optimization.

From the left menu bar, select Asset Optimization. Click on Computerized, and ensure the Speedy slider is ON.

Set your Asset Optimization to Speedy & Computerized for a efficiency increase.

Of notice: if you’re in Computerized mode, Hummingbird auto-detects newly added plugin and theme recordsdata and optimizes them for you, however received’t take away any previous recordsdata from a plugin or theme that was eliminated. That is to keep away from conflicts and points, and why it’s beneficial to re-check recordsdata from time to time ― so every thing stays in sync.

Okay, time for some velocity testing.

Woohoo! That pushed us up into the 90’s.
“B”maintain our regularly rising numbers.

Nice scores! Yet one more factor we will nonetheless do… let’s activate the CDN in Hummingbird. From the identical Asset Optimization web page, transfer the WPMU DEV CDN slider to ON (it should flip blue).

Let’s run our velocity assessments once more.

The warmth is on! We’re cranked as much as 94.
Highschool me needs this had been my grade in AP Historical past.

We may cease right here and be completely comfortable campers. Nonetheless, I’ll throw yet one more go surfing the hearth, by tweaking a setting by way of my WPMU DEV internet hosting.

Turning on FastCGI by way of WPMU DEV’s internet hosting Hub.

Time to place the pedal to the steel and get some new check scores.

Nearing perfection with a rating of 97 in GPSI.
Sure! We lastly received our “A”.

Alright, I’m tremendous stoked about that. Let’s transfer on to our second spherical of testing by putting in a unique theme.

Theme 2 ― Avada Traditional

For our second check surroundings, we’re going to make use of Avada Traditional. It requires the extra WooCommerce plugin to be put in, so will add an attention-grabbing ingredient which may presumably have an effect on web page load speeds.

Earlier than we truly change themes, let’s roll again to our authentic check surroundings. When you’ve got WPMU DEV’s internet hosting, flip off FastCGI from the Hub. In Hummingbird, flip off CDN Asset Optimization. Then deactivate each the Hummingbird & Smush plugins.

We additionally must revert the Avada Efficiency optimizations again to their defaults, by way of the Choices/Efficiency tab, Reset All.

As soon as once more from the Avada Dashboard, let’s navigate to the pre-built themes. Ensure you choose all of the elements you put in for Avada Spa; then click on Take away. As soon as that course of completes, head to the Traditional theme (it’s the primary one), and set up/activate it.

The extraordinarily in style WooCommerce plugin is required for Avada’s Traditional theme.

Prior to creating any adjustments or changes, let’s get our preliminary velocity check scores.

Not unhealthy for our baseline.
I “C” you, and I’ll elevate you 20. (A minimum of!)

Okay, that’s respectable, however we wish very good. Let’s modify a few of Avada’s built-in settings once more.

I’m making the identical optimizations as I did final time, however with one addition: Avada’s PWA plugin (primarily a caching app, below growth at Google). As soon as PWA is put in and activated, I’ve received some selections now below Choices for Progressive Internet App. I’m switching it ON, leaving the pre chosen settings as is, and saving adjustments.

To allow PWA settings in Avada, you will need to first set up its plugin.

Let’s see how a lot of an affect these tweaks made in velocity scores…

Okay, not a thoughts blowing uptick, however a rise nonetheless.
That is additionally a better rating ― we’ll take it!

With the Avada optimizations below our belt, let’s reactivate Smush.

Your Smush settings will stay as we final had them. As a result of our new theme added new pictures to the media library, we have to let Smush do her factor.

You’ll already see the financial savings from bulk compression in her dashboard. We didn’t must actively smush the photographs added to the media library with this theme, as a result of we had beforehand advised Smush to mechanically compress our pictures on add. And that’s precisely what she did.

With Smush on responsibility, finishing up her pre-specified duties requires no prompting.

Alright, time for an additional spherical of velocity assessments.

The needle remains to be climbing.
Can nonetheless “B” higher, however we’re moving into the precise path.

Even higher scores than with our preliminary theme at this level. In fact, we will get them larger. Time to let our rapidly-fluttering-winged pal grace us along with her presence. Reactivate Hummingbird, and run a efficiency check.

Hummingbird’s 87 is a superb rating.

Whereas I’m happy along with her rating, it’s inferior to it could possibly get. I see she has listed three Alternatives, and no less than one is substantial (code pink). I’m going to go in and repair what she’s recommending, and I recommend you do the identical when you have points indicated in Alternatives.

Hummingbird’s at-the-ready fixing directions are so simple as click on, learn, do.

Time for our velocity assessments.

We’re within the higher echelon…
Slowed to a crawl, however we’re nonetheless transferring up.

With our subsequent tweak, we should always see these markers go up much more.

In Hummingbird, go to Asset Optimization/Belongings, and click on the Re-Examine Recordsdata button. Whereas she’s checking, flip CDN to ON once more (from the working pop up). She’ll let you know what number of property are discovered; click on the “Obtained it” button. After her scoring, click on Activate.

Earlier than we do velocity assessments, I’d wish to run one other Hummingbird Efficiency check, and see the way it’s improved since we made all these optimizations.

87 to 98! I’d name {that a} stellar enchancment.

Let’s see if that bumped up our velocity scores.

96 deserves a cheerful dance!
”B” nonetheless my coronary heart. Efficiency is on the rise.

We may name it a day and have nice responsiveness with these scores. However I’m gonna do this one final leap, and activate the static server cache from my internet hosting Hub.

One closing check… and survey says??

Fairly close to excellent. BTW, can anybody see 99 and never hear Toto of their head?
Fan-humming-smush-tastic!!

Okay, that is the perfect rating I’ve seen but. I’m gonna do a victory lap!! Earlier than I get carried away with the checkered flag, I simply wish to share a severe thought on continued testing.

There will likely be slight variances if we had been to check randomly going ahead, as not one of the components are really static. However you shouldn’t see any vital dips in web page loading time, with the entire tweaks we’ve put into play.

Ideas for General Pace Features in Avada

This has been an eye-opening expertise. Avada can most undoubtedly ramp up the tempo when utilized in tandem with Smush and Hummingbird. Despite the fact that we tremendous tuned quite a few settings, there are some issues it’s best to all the time contemplate on the subject of getting and sustaining optimum velocity in your website.

They’re:

Select a theme that’s extra minimalistic (i.e., “gentle”)
Delete plugins which are previous or not getting used
Allow caching
Minify and Defer CSS & JavaScript
Use a CDN
Repair damaged hyperlinks
Optimize your pictures
Replace your Internet hosting Plan

That final one can actually make an evening and day distinction. Be certain your internet hosting supplier has a very good repute, and is proven to be quick and dependable. (WPMU DEV internet hosting plans present stable, totally devoted WordPress website internet hosting, backed by Digital Ocean.)

Fast notice relating to CDN because it applies to our plugins: the settings for the picture CDN are positioned in Smush Professional, whereas the net object settings are in Hummingbird Professional.

Quick & Furiously Optimized

You’ve received all of the instruments at your disposal now. As your website grows, and also you proceed so as to add content material and enhance your visitors, it’s best to repeatedly check and reassess your optimization settings.

As you’ve seen, Smush and Hummingbird are each free, feature-packed optimization instruments that may enhance your velocity. However no matter what you employ, proceed to make changes so your web page masses are by no means a deterrent to guests or shoppers.

Make Avada your individual, and website velocity your silver bullet.