Online Store Speed Rated 12 - Please Help

[Selvence]

Hello,

I am developing my online business with a bunch of cool features and products on my website. I have Crush Pics running in the background that compresses image file sizes to help with load speed and performance and I have Page Speed Optimizer running to increase the second-page load speed of whatever you click through background loading. I am struggling on improving my home page speed. Please help - thank you!!

Website: selvence.com 

[Jason]

What does the report say about your home page?

On first glance I don't see that something like those image optimisations apps are going to do much - if anything - for you. It seems that you're loading all the pictures at once so you're dumping over 8MB of data on the user at once. What lazy loading or other optimisation has been done in your theme to date? It's ok if none as I'm just prodding to get some extra context.

Lazy loading, and even choosing to remove some things would be the logical first step. That report will start to run your through some high level basics of things to look at. We can run over it here as needed.

[Selvence]

My lighthouse analytics page will not load (I've tried about 7 times now) and I tried running it on GTMetrix because it also has lighthouse integration but it gave me an error saying that I have a debugger but I don't know how to remedy that. Help

[Jason]

Gotcha. That debugger bit of code probably won't be helping so let's get rid of that as a first step. At least you'll be able to run some reports! I don't see many places where you have JavaScript that could enable the debugger, but the chatra app might be doing it. It's a guess however so don't take that as being the final word.

It certainly does have some performance issues so there's work to be done in your theme overall. Great start, but plenty to do!

[Selvence]

Ok, I found the issue - it was one of my apps (now deleted). Now I can run some speed tests on the website. 

[PageFly-Victor]

Hi @Selvence ,

This is PageFly - Landing Page Builder. 

I just tested your website on both my Samsung and iPhone and PageSpeed Insights app. Your page works well on desktop but a bit slow on mobile. You can use Google Pagespeed insight to see the reason via its report here: https://developers.google.com/speed/pagespeed/insights/?url=https%3A%2F%2Fselvence.com%2F

We can find here the problem affecting the Speed index and some suggestions to improve your page speed:

1. The biggest opportunity to improve your speed is deleting all the disable rules from the stylesheet and defer loading the Stacked stylesheet (CSS) not used for the first screen content. It helps to reduce the unnecessary bytes that the network operation uses. They also so you detail which is the unused code.

2. Besides, other dramatical reasons are JavaScript, CSS code and your server's initial response time… Please check your theme.liquid file and remove unused JavaScript. Resources are blocking the first impression of the page. Consider delivering important JS / Inline Styles (CSS) and deferring any non-critical JS / styles. You can click to this field on report for more detail.

3. Besides, you should check both Mobile and Desktop devices in the report. On the desktop, we can see the problem might come from another reason (Image elements need to resize accordingly). Deliver properly sized images to save mobile data and improve load times.

4. Optimize your images and delayed loading of off-screen images: One of suggestions for you about reducing interaction time. If you want to optimize your images to help your page loading speed faster, you can use some of the image optimization tools like: ImageOptim, Shopify Online Image Resizer, tinypng.com or imagecompressor.com. And If you have images that go with .PNG file, you can convert them to .JPG or .JPEG files

Finally, you can consider some tips to improve the speed page about How to Speed Up Website and Optimize Page Load Time To Win Sales. 

By the way, we are PageFly - a Shopify page builder to customize your page, our app provides the Lazyload function and it's easy to use with a drag-and-drop system and less code needed. Here is a reference (LINK)

If you find my comment useful, you can like it. And let me know if you want further assistance.

Have a great day!

[JohnCodes]

Hi @Selvence 

I ran your homepage through our free Shopify Analyzer tool. You can view the detailed report at https://analyze.speedboostr.com/result/fx824wuasb.

It looks like you could really benefit from lazy loading and reducing oversized images. Lazy loading will really help performance by only loading images when they come into a user's view instead of trying to load all images at once. Beyond that, you could minify your files so that they execute faster.

We have a full optimization guide if you'd like to perform these on your own: Shopify Optimization Guide. Feel free to reach out to our team at speedboostr.com/contact if you'd like help with any of your optimizations!

[Selvence]

Update*

• My Crush Pics is now compressing my images on the website on the "Conservative" level so that I do not lose out on good looking pictures
• I downloaded Lazify for Lazy Loading for both my pictures and URLs 
• I downloaded a file optimizer that minifies my files on my main theme - saved a lot of space - 482290 kb
• I can run speed tests now - I removed a debugger 
• I am considering changing my theme to an AMP theme due to the constant suggestions on YouTube saying that it is really fast. I do not like how it looks personally and my Empire theme looks much better and accomplishes a general store with much more ease. 

Any other suggestions?

[Jason]

No. For now, see how those changes go and the impact to the design and customer experience. You don't want to go full on crazy and try to change every single thing at once. You could - but there's value in incremental changes so you can see and understand the impact of each change. When you do everything you never know what made the biggest change and where the most value was.

I would not suggest a theme change at this stage. That's the nuclear option.

Come back in a week and see if it's made a marked difference. I'm curious to see!