I’m transitioning from 15 years of having a developer create my client sites in WordPress to working solo with Wix Studio. I’m confused about my home page speed. I’ve been super careful with the compression of images and the hero video. I’m confused by the page speed results. Screenshot of results attached.
Site: https://www.relaunchdigital.com
Desktop home page speed is 3 seconds, but mobile is 4 seconds.
The real concern is under “Google PageSpeed simulation.” Mobile is showing 6.2s under “Speed Index” and 6.8s under “Largest Contentful Paint.” Desktop shows those indicators as 1.3s and 1.6s.
There’s a hero video I have compressed down to 1MB, so I don’t think that’s the issue. Though I could do a static image instead of the video on the mobile if needed. I have a rolling image gallery at the bottom that could be a problem. I could just use one image there. I could also remove the blog teasers on mobile if that’s the issue.
If anyone can provide some insight or suggestions on what I can try to get that mobile page speed down, let me know. Thanks!
Hi @Gregg_Murray
Thanks for sharing your site and results — I know how confusing PageSpeed numbers can be, especially when desktop looks fine but mobile shows much slower times. What’s happening is that Google’s mobile test simulates a slower phone and connection, so things like videos, galleries, and extra scripts hit much harder than they do on desktop.
Here are a few practical ideas you can try:
1. Swap Hero Video for a Static Image on Mobile
Even at 1MB, videos add decoding/rendering delays on mobile. A common trick is:
-
Keep the video for desktop visitors.
-
Replace it with a lightweight static image (JPEG/AVIF/WebP) for mobile.
Here’s a Velo snippet to handle this automatically:
import wixWindow from “wix-window”;
$w.onReady(function () {
if (wixWindow.formFactor === “Mobile”) {
$w(“#heroVideo”).collapse(); // Hide the video
$w(“#heroImage”).expand(); // Show a static image instead
} else {
$w(“#heroVideo”).expand(); // Show video on desktop
$w(“#heroImage”).collapse(); // Hide image on desktop
}
});
Make sure you add both a video element (#heroVideo) and an image element (#heroImage) to your section and set them collapsed/hidden by default as needed.
2. Optimize Fonts
Multiple font families and weights are surprisingly heavy on mobile. Best practices:
-
Recommended one or two font families.
-
Use font-display: swap;
-
Avoid loading unused styles (e.g., 300, 500, italic).
In Wix Studio, you can adjust this in the Theme → Typography panel. This cuts down on render-blocking requests, speeding up Largest Contentful Paint (LCP).
3. Trigger Animations on Scroll (Not Page Load)
Animations that run immediately can block rendering. Instead, use IntersectionObserver so animations only trigger when elements enter the viewport.
Here’s a simple code example:
.fade-in { opacity: 0; transform: translateY(20px); transition: all 0.6s ease; }
.fade-in.animate { opacity: 1; transform: translateY(0); }
In Wix Studio, assign the class fade-in to elements you want animated. This way, animations won’t block initial loading.
4. Lazy-Load Below-the-Fold Images
Even though Wix does this to some extent, you can reinforce it with a code approach for any custom images:
![]()
This makes sure images at the bottom don’t load until the user scrolls down.
If you’d prefer not to tinker with all these settings yourself, there are tools that can help automate a lot of the heavy lifting. I actually run a Wix app called Website Speedyhttps://www.wix.com/app-market/web-solution/websitespeedy that focuses on mobile optimizations — things like image compression, script deferring, and Core Web Vitals fixes happen in the background. There’s a free trial, so you can test it on your site without commitment.
Thanks, Speedy. I will review this in detail ASAP.
