How to optimize WordPress website site speed

Develop, Build & Integrate CMS Development
1

Hello everyone,

I want to optimize the speed of a WordPress website. It is developed in Elementor page builder and I am using Litespeed Cache plugin.
I am still experiencing some performance issues. Does anyone have tips or recommendations on how to further enhance website speed? I have tested the speed it is shwoing 36 on mobile..
Any advice on additional plugins, settings adjustments, or best practices would be greatly appreciated! The website is https://zapitpestmelbourne.com.au/
Thank you.

2

Hi @alicelilly,

before I go into detail: Google Page Speed tester is quite ambitious on mobile testing. I had cases where pages were loaded instantly and Google showed a bad score. So always take the result with a grain of salt :wink:

My personal recommendation is: Open/test the page on a phone without WiFi connection to simulate real-world scenarios. If it’s slow for you, start optimizing - if it’s ok for you, leave it as is.

Something Google Page Speed shows is that there are quite a few JavaScripts that are related to the low score and that the hero image(the family) has lazy-load enabled. Since this is the image that the visitor sees without scrolling (“above-the-fold”) it’s not recommended to enable lazy-loading. Might help with the score.

Also: Your video is hosted on your website and is quite big(~29Mbyte). This has a big impact on performance since the video is getting loaded everytime somebody opens the page.
Just as an example: If your page would have a “weight” of 3 Mbytes without the video it might be somewhere around 80-90(just to call some numbers). With the video it’s almost 10x that much. Therefore I’d recommend to disable the video for mobile or upload it to youtube and embed the youtube video on your page.

Another potential topic might be your hosting-service. It’s quite common that hosting services limit their servers and charge you more for “WordPress optimized” hosting services, which is basically the exact same thing but with a few lines changed in the server settings(you don’t have access to them unless you have a managed server or something similar)

best,

Anton

3

Thank you for your time and detailed answer. I will try lazy oad but what about unused css and javascript? I agree **bleep** your video comments but can we also optimize or reduce video size as well?
I will also contact hosting about their server speed.
Thank you.

4

Hi @alicelilly,

personally I haven’t worked with the big blue “W” for quite a while but in order to minimize the unused JS/CSS files you - most likely - would need to optimize/rewrite the plugins. This is not possible unless you develop them yourself from the ground up. All the optimization plugins I’ve worked with helped the page deliver faster, but weren’t optimizing the actual code. I’ve encountered situations where the optimization plugin actually defered the loading of certain plugin files and the result was, that the plugin stopped working properly.

Therefore my opinion on such plugins is: Use them with caution and if the page is loading “fast”, don’t optimize it further.

As of the video - I’d change it to following setup (at least on mobile):

- change the preview to a static image

- upload the video to YouTube/Vimeo…

- Once the image is clicked, play the YouTube video

If you don’t want to upload it to a streaming platform, my personal recommendation for hosting videos on your hosting service: The video should be optimized for your website. This means that if you don’t offer a “watch the video in full screen mode”, you don’t need a FullHD or higher(2k/4k) resolution. Also the selfhosted video shouldn’t be bigger than 5-6Mbyte if you don’t have a CDN hosting provider.

Just think about following scenario: Your company is located in Australia and your targeted audience is locale (that’s a good thing). You don’t need to optimize for anybody from outside of Australia. While I was looking at your page (I’m located in Germany) my real life experience was following: The page loading was blasing fast on desktop - except the video. I’ve reloaded the page and started a stopwatch… Even after 1 minute I didn’t saw a video, just a black overlay.

This leads me to following thoughts:

- You have disabled the media for outside Australia( would be a good thing)

- The hoster has problems to deliver information to outside of Australia(would make sense in your case)

- There are technical issues with the video on desktop(I can see it on mobile;this wouldn’t be great).

How to reduce the video size is something I could technically do, but I can’t recommend you an easy (and free tool). Maybe Adobe Express or Canva could do this. But please don’t quote me on those, simply because I don’t work with them. I optimize my videos with Adobe Media Encoder which you get with several Adobe video tools like Adobe After Effects and Adobe Premiere.

TL;DR:
Optimizing the big W can be quite a task, since it’s feeling like the wild wild west out there :grin:. There are tons of extensions, plugins and addons that aren’t optimized to work with each other - just because it’s technically nearly impossible and WordPress itself(you have to differentiate between the company and “CMS”) doesn’t care about optimizing the “CMS” to everything. I’d say it’s like comparing iOS and Android. iOS is kinda closed and is easier to use, Android is more open and gives users more flexibility, but at the same time you’re responsible for everything.
Some preffer iOS, some Android. It’s up to you.

I would proceed as following:

- Check your Analytics or ask your audience about the page

- If you get responses like “Hey… the page loading slow” or “X doesn’t work” than optimize.

- Check your hosting service

- Check for Plugins/Addons you don’t use anymore (i.e ContactForm7 is something I wouldn’t recommend for security reasons) and delete them

- Since you’re on Elementor, they offer a hosting service for a few months now(this might need a website rebuild)

- And last but not least - since this is a HubSpot Community - I would always recommend HubSpot over WordPress. The Content Hub(CMS) is way better than WordPress and you don’t have to think about security/Updates/Backups/CDN… It just works :grin: and if you’d like to see it in action, I’ll be happy to give you a demo and go more into details about the differences.

best,

Anton

5

Just to add to Anton’s message regarding simulating real world scenarios, there is a Network Throttling feature in Chrome (Dev Tools) that helps simulate slow connections, very useful!
More info: Network Throttling in Chrome DevTools | DebugBear

6

@Anton “ambitious” is such a diplomatic way of putting it, I’ll have to remember that one!

profile2022a.jpg
profile2022a.jpg2325×2324 692 KB

Barry Grennan

Freelance HubSpot CMS Developer

Website | Contact | LinkedIn

7

Hey there,

I just took a look at your site. A mobile score of 36 with Elementor is honestly not a bad place to start, but you can definitely get that higher. Since you’re already using LiteSpeed, here are a few things I’d focus on right away.

1. Your Images Are the Biggest Problem

This is almost certainly your main bottleneck.

  • Compression: Many of your images are too large in file size. Go into your LiteSpeed Cache settings and max out the image optimization (or use a dedicated plugin like ShortPixel). You need to get those file sizes crushed down.
  • Use WebP: Make sure you’re serving images in next-gen formats like WebP. It makes a huge difference, and LiteSpeed can do this for you.
  • Resize Your Images: I noticed some images are being loaded at a much larger size than they’re displayed. Before you even upload, resize your images to the actual dimensions you need. Don’t rely on Elementor or CSS to shrink a giant 3000px photo.

2. Tame Elementor and its Code

  • Remove Unused CSS: This is a big one. Elementor and your theme load a ton of CSS on every page, even for elements you’re not using. Go into LiteSpeed Cache’s settings and find the “Remove Unused CSS” (RUCCS) option. Turn it on and let it run.
  • Elementor Experiments: In your WordPress dashboard, go to Elementor > Settings > Experiments. Turn on features like “Optimized DOM Output” and “Improved Asset Loading.” These help clean up the code.
  • Theme: What theme are you using? If it’s not a lightweight one like “Hello Elementor,” Astra, or GeneratePress, your theme itself might be adding a lot of bloat.

3. Fine-Tune Your Caching and Scripts

  • Delay Javascript: Your site has a lot of JS. Use LiteSpeed’s settings to “Delay JavaScript.” This will stop non-essential scripts (like analytics, chat widgets, etc.) from loading until a user scrolls or moves their mouse, making the initial load feel much faster.
  • Test Your JS/CSS Settings: Don’t just turn on “Minify” and “Combine.” Sometimes, combining all your CSS or JS into one giant file can actually slow things down. Try turning off “Combine” for both and see if your score improves.
  • Remove Unused CSS: A quick warning on this and the “Remove Unused CSS” option: these settings give you the biggest speed gains, but they can also easily break your site’s contact forms or animations. It’s a lot of trial and error to get the exclusion settings right. If you get frustrated with that part, that’s honestly when it’s easier to just hire a specialist. I know teams like Webkul offer a WordPress Speed Optimization Service, for example, that just focuses on getting all these technical settings dialed in without breaking the site.
  • Get on a CDN: If you’re not using one, get the free Cloudflare plan. It’s easy to set up and will serve your images and files from servers closer to your visitors.

4. Clean House

  • Plugin Audit: Be honest—go through your plugin list. If you’re not 100% sure you need a plugin, deactivate it and test your site. Every single plugin adds overhead.

Start with the images and the “Remove Unused CSS” feature. In my experience, those two things will give you the biggest “win” and should get you well past that 36 score.

8

Hi, @alicelilly
This usually happens because Elementor and plugins add additional CSS/JS, which increases page weight and slows down mobile speed.
Here are the key areas I’d focus on:
1. Optimize Elementor settings
Avoid heavy sliders or animations above the fold and reduce unnecessary widgets , as each adds CSS/JS.
2. Fine-tune LiteSpeed Cache
Use Delay JS for third-party scripts, remove unused CSS or load it asynchronously, and enable lazy loading for images and iframes.
3. Optimize images (LCP focus)
Compress images and use WebP format, ensure hero/banner images are properly sized for mobile, and avoid loading large images above the fold.
4. Limit third-party scripts
Remove any unused scripts
5. Server-level improvements
Enable object cache if available
In most cases, the biggest improvement comes from reducing what loads first and delaying non-critical scripts, rather than adding more plugins.
Hope this helps!