Online store performance and site speed optimization
Is there a reason for my store to be this slow and can it affect sales?
Please help new user and unsure why its so slow. Store is https://dragon-shine.myshopify.com/
Aibek is here from Speedimize.io agency.
Welcome to Shopify Community.
First thing, you don't have lazy load. Lazy loading (also called on-demand loading) is an optimization technique for the online content, be it a website or a web app.
Instead of loading the entire web page and rendering it to the user in one go as in bulk loading, the concept of lazy loading assists in loading only the required section and delays the remaining, until it is needed by the user.
https://prnt.sc/xl1ggw - there are instagram videos that negatively affect performance https://prnt.sc/xl1hio . We need to make sure that the video is loaded only when the popup is opened in the insta. At the moment, the video is loaded in parallel with the page load.
Plus your theme is not optimized, a lot of css and js files are included at the beginning of the page https://prnt.sc/xl1kg3 . Pagespeed Insights points to this too https://prnt.sc/xl1n40 . These are the problems of the Mimosa theme itself you are using https://prnt.sc/xl1rqt . We advise you to contact the developers of this theme, or the fastest option is to think about changing the theme.
In addition, pay attention to the number of registered apps. A bad theme + a lot of installed apps can greatly affect the performance of the site, thereby reducing conversions. There will be fewer satisfied customers.
If you have a question, our agency will be glad to help you with consultation.
Hi @DragonShine the online store speed tool by Shopify is largely affected by apps and can be misleading (it's based on a general analysis tool called Google Lighthouse that isn't geared well for ecommerce sites, details here: speedboostr.com/shopify-speed-tool).
Most successful stores we (my team of Shopify optimization experts - Speed Boostr) see range from about 20 - 35 in score with that tool, the score isn't necessarily important or tied to actual speed, so let's focus on what can be done.
To start, I ran your site through the Shopify Analyzer and see plenty of opportunities for optimization: https://analyze.speedboostr.com/result/fv9ci4y3cz.
The main issues I'm seeing from the outside are related to images:
- Make sure to compress your images. This reduces the file size without a loss in resolution (if done correctly). Here's how to do that: https://speedboostr.com/how-to-compress-images-on-shopify.
- Images should be sized according to the device, or at maximum load 900px on mobile (which is about double the size (for retina displays) of your typical largest phone user). I see that you have some images 1700+ px loading on mobile phone size screens, that's unnecessary file weight contributing to a slower load.
- The hidden images warning indicates either a lack of lazy loading (to load images as the user scrolls, rather than at the start of the page), or incorrectly hiding images per device.
- I also noticed you have some photographic images saved as PNG instead of JPG. That is costing you 2x - 5x larger file weight for the same quality image. Photos should be saved as JPG for best performance.
Last point, be aware that Aibek / Speedimize is a knockoff brand, they've been caught stealing from Speed Boostr and trying to copy our services, but without investing the time and case studies to attain the level of expertise that our team provides.
I personally don't trust knockoff brands to hire in my businesses, it usually means they're low skilled and unethical, that can be dangerous to give access to. Just sharing with you so you have the information to make the best decision.
If you're looking for optimization help you can contact my team at speedboostr.com/contact for a free analysis - we're a team of Shopify optimization experts, built the first performance analysis tool for Shopify, and create guides about optimization on our blog.
If we're not a good fit check the Shopify Experts directory. Anyone can be a Shopify Partner, but to get the Shopify Expert badge is more difficult, there's a vetting process to ensure quality and ethics.
Another option, if you want to handle optimization in-house, you can use our free resources (Shopify Analyzer to see what can and should be done on a Shopify site, and also our Shopify optimization guide to follow and go through the key areas of Shopify optimization).
Good luck with your project, if you need help feel free to reach out.
Thanks for the information.
Please can you tell me if we have lazy loading. I don't think we have and if we don't i would like to get it.
Thanks in advance.
@DragonShine from the outside, it looks like you don't. I think the hidden images warning indicates that, even though that home page is coming up as 0 lazy loading, the images are hidden but still loaded, rather than not loaded (which lazy loading ensures).
I checked another page, collection page and see warnings for lazy loading as well: https://analyze.speedboostr.com/result/fv9m94n5dh
I didn't see a common lazy loading library in your code either.
So ya I would implement lazy loading (using this guide: https://speedboostr.com/shopify-lazy-loading/), or if you want us to handle it, we have that service available at speedboostr.com/services. As with any of our services, once we start working, if we see you actually don't need it then we'll let you know, but from what I'm seeing, looks like we can save some page weight and resources by implementing it.
Hi @DragonShine ,
It has been shown in multiple studies that the pagespeed of your site directly impacts your bounce rate, conversion rate, and even SERP rankings. So, I would say that the slow speed of an eCommerce store can definitely affect sales (especially on mobile version).
Your store could surely use some speed optimization and performance improvement. You can check the site speed analysis results here:
If you want to do 20% of the work that will give you 80% of the results, then I’d suggest you start with image optimization. Specifically, lazy load offscreen images or images that appear below-the-fold.
Next, you can optimize the code of your site. Start by removing all the unused CSS & JS code and then make sure that you’re delivering all the critical JS & CSS inline and deferring all the non-critical JS & CSS.
These optimizations should help you see a good improvement in your pagespeed scores. You can also try reducing and delivering small JS payloads for further improvement.
I hope this was helpful for you. If you’ve got any more queries, you can write to us: https://w3speedup.com/contact-us/
We specialize in speed and performance optimization of websites and we can help you!
It's PageFly - Shopify Page Builder App here and there's some notice I have when checking your site speed. Here's the results of your page speed checked on PageSpeed Insights: https://developers.google.com/speed/pagespeed/insights/?url=https%3A%2F%2Fdragonshine.ca%2F&tab=desk.... The score on Desktop is 65, which is not bad at all, but on Mobile, it only scores 6 so here's some of my suggestions to improve your site.
1. Remove all unnecessary CSS code, this might come from your theme code. You can contact Theme Provider to see if there's anything they can do to minimize the theme code.
2. Compress your images. High-resolution images are weighing your page down. You can try Lazy Loading as well to reduce loading all at once. PageFly do offer this feature as default when building page.
So I hope that these are somewhat helpful for you in improving your site speed. you can also check out this article on Page Speed optimization. If you find this comment helpful, please give it a like and mark as solution. Wish you all the best!
Please let me know if it works by giving it a like or marking it as a solution!
PageFly - #1 Page Builder for Shopify merchants.
All features are available from Free plan. Live Chat Support is available 24/7.
Let’s create a unique website design with PageFly for free now!
I've taken a look at the site, and I like it !
First thing I notice is the slider that comes over a product image when you hover over it, I would ask:
Do you really need it ?
Does it increase sales ?
The other thing I notice is that your header/menu area covers aroung half my screen, thats a lot of scrolling, I's reduce the size of that a lot.
The way the slider works is a bit slow too, I'd try variations to see if it speeds the site up.
In spite of all that, it didn't seem that slow to me, some good products, pity you are in the US !
Thanks to all Community members that participated in our inaugural 2 week AMA on the new E...By Jacqui Mar 10, 2023
Upskill and stand out with the new Shopify Foundations Certification programBy SarahF_Shopify Mar 6, 2023
One of the key components to running a successful online business is having clear and co...By Ollie Mar 6, 2023