Online Store Speed Rated 12 - Please Help

Selvence
Excursionist
44 0 1

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!!

 

Selvence_0-1616809962901.png

 

Website: selvence.com 

0 Likes
Jason
Shopify Expert
10360 158 2009

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.

I jump on these forums to help and share some insights. Not looking to be hired, and not looking for work.

Don't hand out staff invites or give admin password to forum members unless absolutely needed. In most cases the help you need can be handled without that.


★ http://freakdesign.com.au ★
Selvence
Excursionist
44 0 1

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

 

Selvence_0-1616934841079.png

 

Selvence_1-1616934855861.png

 

 

 

 

 

0 Likes
Jason
Shopify Expert
10360 158 2009

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!

I jump on these forums to help and share some insights. Not looking to be hired, and not looking for work.

Don't hand out staff invites or give admin password to forum members unless absolutely needed. In most cases the help you need can be handled without that.


★ http://freakdesign.com.au ★
JohnCodes
Shopify Partner
130 10 69

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!

Developer at SpeedBoostr (Shopify optimization and dev agency).
Try out our Shopify Analyzer (free performance analysis tool).
Check out Order Automator (app that auto tags + fulfills orders, and more automation)
More Apps: Theme Scientist (A/B testing tool), Tip Jar (add a tip button to your store), File Optimizer (optimize CSS, JS, Liquid)
Selvence
Excursionist
44 0 1

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

0 Likes
Selvence
Excursionist
44 0 1

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?

0 Likes
Jason
Shopify Expert
10360 158 2009

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!

I jump on these forums to help and share some insights. Not looking to be hired, and not looking for work.

Don't hand out staff invites or give admin password to forum members unless absolutely needed. In most cases the help you need can be handled without that.


★ http://freakdesign.com.au ★

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

PageFly_0-1617177633766.pngPageFly_1-1617177633753.png
PageFly_2-1617177633763.png


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.

PageFly_3-1617177633755.png
PageFly_4-1617177633746.png4. 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!

PageFly - Advanced Shopify Page Builder - Empowering 90.000+ active merchants.

Check our Evergreen Guide on Moving Your Brick-n-Mortar Store Online.

Want To Strive The Coolest E-commerce Knowledge? Explore Our FREE Video Resources.