Hi Stephen! Optimizing mobile performance in Wix Studio can definitely be tricky. Here are some tips to help address each of these challenges
Mobile-Only Preloader in Wix Studio
You can implement a mobile-only preloader by using a simple Velo code solution that detects the device type:
import wixWindow from ‘wix-window’;
$w.onReady(() => {
if (wixWindow.formFactor === “Mobile”) {
$w(“#mobilePreloader”).show(); // Show only on mobile
// Optional: Auto-hide after 2.5 seconds
setTimeout(() => {
$w("#mobilePreloader").hide("fade", { duration: 500 });
}, 2500);
} else {
$w(“#mobilePreloader”).collapse(); // Hide on desktop/tablet
}
});
This way, you can ensure the preloader only appears on mobile devices.
Disabling Dataset Connections on Mobile Only
Currently, Wix Studio’s dataset connections are global across all breakpoints. If you remove a dataset for mobile, it will affect all breakpoints (this is by design).
However, you can prevent the dataset from loading content on mobile by applying an empty filter via Velo:
import wixWindow from ‘wix-window’;
import wixData from ‘wix-data’;
$w.onReady(() => {
if (wixWindow.formFactor === “Mobile”) {
$w(“#myDataset”).setFilter(wixData.filter().eq(“id", "__”)); // Prevent dataset from loading
}
});
Improve Mobile Performance
If you’re still facing performance issues after implementing indexing and minimizing the mobile design, I highly recommend using Website Speedy App. It’s specifically designed to optimize Wix and Wix Studio sites, boosting page speed and improving Core Web Vitals, including mobile performance.