Optimizing WPBakery’s Impreza Theme With Smush And Hummingbird Plugins

Impreza is a well-liked WPBakery-based theme with a taste all of its personal. On this put up, a WPMU DEV member shares learn how to optimize this multipurpose WordPress theme for prime velocity and finest efficiency.

As Phil Martin, WPMU DEV member, net developer, and proprietor of Canadian-based net design firm CapitalWebDesign.ca lately shared with us, “there’s loads of curiosity in optimizing WPBakery-based themes lately, so I believed I’d present my 2¢ on the WPBakery-powered theme I’ve been utilizing these days, Impreza.”

Impreza is a multi-purpose WordPress theme that makes use of WPBakery.

On this put up, we’ll cowl the next:

Overview of Impreza Theme for WordPress
Testing Methodology for Optimizing Impreza Theme
Benchmark Outcomes
Making Impreza’s Efficiency Even Higher

Overview of Impreza Theme for WordPress

Impreza is a premium WordPress theme that makes use of WPBakery. It was developed and maintained by UpSolution and is presently out there from ThemeForest, the place it ranks as one in every of their best-selling themes with over 80,000 gross sales to this point and a 4.89/5 star ranking from over 2,200 consumer opinions.

Impreza is likely one of the top-selling WordPress themes on ThemeForest.

The theme’s license usually prices $59 however typically goes on sale for $39 and comes with 12 months of help.

As Phil states: “They push massive updates each month on common. Severely, try this changelog and attempt to persuade me that isn’t one of the best changelog structure/styling you’ve seen in a very long time.”

The Impreza theme makes use of WPBakery however with their very own taste thrown in. It’s an extremely modular theme that decouples most of the structural elements, together with:

Grid layouts: Impreza helps you to customise the way you show teams of information equivalent to posts, {custom} put up varieties like testimonials or merchandise, picture galleries, and many others. You possibly can successfully customise any ingredient in a grid. Take a look at their grid structure doc web page for a glimpse.
Web page blocks: The theme gives reusable blocks. This allows you to edit every thing in a single place and the modifications are then mirrored in all places you could have added the block. Use these for footers, name to actions, and many others.
Web page templates: You possibly can construct a template utilizing WPBakery that may be utilized to any put up kind or web page. Use these to have completely different footers for posts versus pages or to help a special template primarily based on the put up kind (e.g. a cooking recipe vs a product assessment in a weblog).
Header builder: Impreza gives a singular, energy, and really intuitive header builder. Take a look at the header builder doc web page.

Impreza helps you to successfully customise any ingredient in a grid.

Some extra factors to notice about Impreza:

It natively helps many of the ACF {custom} fields (doubly nice in case you use our SmartCrawl plugin for web optimization, which additionally helps ACF).
100% suitable with WPML language translation plugin.
Constructed-in efficiency optimization choices (together with a one-click asset optimization for WPBakery components: solely embody CSS + JS for components that exist in your pages)
Constructed-in upkeep mode, button builder, {custom} picture sizes amongst others
Means to import particular person demo pages or copy in particular rows from particular demo pages. It is a nice high quality of life possibility: if you see a particular row in a demo that you just’d like to duplicate, simply copy + paste.
Every license is legitimate for 1 manufacturing web site and 1 growth web site (forces upkeep mode). A licensed web site gives you with theme white label, demo import, one-click theme updates (with out Envato Plugin), addons/really helpful plugins (e.g. Smush)
Observe: Operating a license per web site will not be needed and you may rotate a license the place you want to set up addons or import demos. Theme updates are nonetheless out there via Envato Plugin for unlicensed websites, too. Additionally, whereas your help is lively, the theme builders will show you how to with just about any theme customization and, based on Phil who makes use of the theme extensively, their help employees are extremely educated.

So, Impreza is a superb WordPress theme to make use of, particularly in case you love utilizing WPBakery.

What we actually wish to know, nevertheless, is that this:

Do websites created with Impreza load quick and carry out effectively?
Can we make websites created with Impreza load even quicker and carry out even higher utilizing our optimization plugins Smush and Hummingbird and managed WordPress internet hosting?

For these solutions, let’s flip to Phil’s…

Testing Methodology for Optimizing the Impreza WordPress Theme

Impreza could be very performance-oriented, as evidenced by among the superior theme choices they supply.

Impreza gives superior theme choices to assist enhance efficiency.

To see how effectively Impreza could be made to rank on Google PageSpeed Insights and GTmetrix, right here is Phil’s testing methodology in his personal phrases:

(Editor’s Observe: WPMU DEV members like Phil get entry to the Professional variations of our plugins mechanically as a part of their WPMU DEV membership however you possibly can comply with the identical methodology proven beneath utilizing the free variations of Smush and Hummingbird.)

Use an actual web site: The web site I used on this benchmark is an actual, fully-built web site. Though it’s not but dwell to public site visitors, it’s operating WPML and is stuffed with actual content material together with pictures.
Hosted on WPMU DEV: A easy bronze-level server situated in Toronto, Canada. We’ll be testing FastCGI serverside caching
Smush Professional: Picture optimization is vital to this web site as each weblog put up has a featured picture. This web site is more likely to develop to 10,000+ weblog posts over the following 5 years, so we want to verify we optimize from the beginning.
Hummingbird Professional: Take a look at to see if asset optimization works with Impreza.
Caching: We don’t want redundancy in caching options, so both Hummingbird Professional caching or serverside FastCGI caching was used.
Impreza efficiency settings: preserve “http/https” within the paths to information, disable jQuery migrate script, transfer jQuery scripts to the footer, dynamically load theme JS elements, disable further options of WPBakery Web page Builder, disable Gutenberg (block editor) CSS information, optimize JS and CSS measurement, and merge Google Fonts types into single CSS file.

Benchmark Outcomes

Checks had been carried out by beginning with each plugins disabled, Impreza efficiency settings off, and serverside cache disabled.

Phil then incrementally enabled one part at a time. Google PageSpeed Insights was run 3 times (common of three runs saved) and a GTmetrix efficiency report was generated.

Listed below are Phil’s check outcomes:

As you possibly can see from the above, Phil’s check outcomes went from…

Earlier than (Impreza solely):

Google PSI cell rating: 27
Google PSI desktop rating: 83
GTmetrix rating: A – 92%-94%
GTmetrix *FCP: 1.1s
GTmetrix **TTFB: 0.8s

After (Impreza + Smush + Hummingbird + CDN/Caching):

Google PSI cell rating: 87 (222% enchancment)
Google PSI desktop rating: 96 (15.6% enchancment)
GTmetrix rating: A – 100%-95%
GTmetrix *FCP: 0.461s
GTmetrix **TTFB: 0.206s

* FCP = First Contentful Paint
** TTFB = Time To First Byte

After operating the above exams, right here is the setup that Phil discovered to carry out one of the best:

Impreza efficiency settings: ALL enabled.
Smush: ALL really helpful + CDN + WebP (Professional-only options). Moreover, make sure that the WPBakery Web page Builder integration is enabled within the Smush > Integrations menu. It will smush custom-sized pictures resized utilizing WPBakery’s Web page Builder editor.
Hummingbird: ALL really helpful + CDN + Asset Optimization Automated/Speedy.
Caching: EITHER Hummingbird Professional or serverside FastCGI.
Impreza + WPMU DEV internet hosting on their very own nonetheless do a superb job out of the field. 83/100 on PageSpeed Desktop and an A grade (92%; 94%) on GTmetrix is spectacular, however clearly the 27 rating on Cellular will not be fascinating.
Impreza’s built-in efficiency optimizations could be very efficient. It improves each Google PageSpeed scores into the 90s, which is very vital for Cellular.
Smush doesn’t seem to make a lot of a distinction to efficiency scores, however it’ll scale back your total web page load measurement the place pictures are current.
Hummingbird cache seems to be on-par to FastCGI serverside cache.
Hummingbird Professional CDN seems to be on-par with letting the server present CSS + JS by way of FastCGI caching.

Listed below are some extra precious insights that Phil offered after operating the exams:

“The #1 factor that fully ruins these scores is Google’s reCAPTCHA javascript.”
“I’m actually stunned at how effectively the theme + WPMU DEV Internet hosting w/ FastCGI serverside caching carried out. TTFB of 0.224s and 92/98 on PageSpeed Insights with out extra plugins is extremely spectacular. Smush Professional is then an additional layer of optimization on prime by serving super-optimized picture information. Hummingbird Professional can calm down a bit and never have to fret about serving cache. Moderately, it might probably give attention to setting all our expiry headers, monitoring uptime and serving CSS/JS from CDN.”

Optimize Impreza with Smush and Hummingbird and you may have your cake and eat it too!

Making Impreza’s Efficiency Even Extra Imprezive

In Phil’s personal phrases:

“Having used most of the prime rating multipurpose themes prior to now (Avada, Enfold, Etalon, Further, Jupiter, Salient, and many others.) I’ve by no means had as a lot success constructing fashionable, minimalist, environment friendly and hyper-performing web sites as I’ve with Impreza. Buying and selling pre-built template and demo libraries for considerate design, in depth customizability and ridiculous efficiency is price it to me.

And look, the outcomes don’t lie: not a single check dropped out of the A grade on GTmetrix.”

You don’t should be a Canadian like Phil to get all “A”s – simply set up Smush and Hummingbird… WPMU DEV’s “moose’t-have” optimization plugins.

So, there you could have it!

Impreza will not be solely a fast-loading WordPress multi function theme powered by the WPBakery web page builder however its efficiency could be improved utilizing Smush and Hummingbird optimization plugins with serverside internet hosting options like CDN and FastCGI enabled.

To entry our total suite of Professional plugins, blazing-fast managed WordPress internet hosting, and professional 24×7 assist and help for all issues WordPress, turn out to be a WPMU DEV member as we speak with our 7-day free membership trial.

Contributors

This text was written in collaboration with:

Phil Martin –  Capital Internet Design.  Phil makes use of his twenty years of net design expertise to realize one purpose: give again to his hometown by constructing fashionable web sites for companies and nonprofits within the Canadian capital!

***

Observe: We don’t settle for articles from exterior sources. WPMU DEV members, nevertheless, might contribute concepts and recommendations for tutorials and articles on our weblog by way of the Weblog XChange.