Re: Slow Loading Product Page

Solved

Why is my product page loading slowly on mobile after IOS 16 update?

ValvedExhausts
Excursionist
20 0 7

Hello everyone, I have an issue with my shopify store, on desktop the site product pages load instantly with all my apps, but on mobile ever since updating to IOS 16 the product pages takes forever to load, 10+ seconds for everything to finally load after it freezing! Can someone help me out please I’m using the dawn theme 

website link 

valvedexhausts.ca

Kyle Bristow
Accepted Solution (1)

Cedcommerce
Shopify Partner
718 76 113

This is an accepted solution.

Hi @ValvedExhausts,

 

We have checked your store’s speed and as you said it takes forever to load you were right as you can see it in the screenshots below. 

 

You can check your store speed for the product page using the below link: 

https://pagespeed.web.dev/report?url=https%3A%2F%2Fvalvedexhausts.ca%2Fproducts%2Fford-mustang-cat-b...

  

  The major issues are: 

  1. Remove unused JavaScript - they play a huge role in increasing the LCP score which is 12.1s for your store which is much higher than the expected LCP score of 2.5seconds. 
  2. Optimize the third-party scripts such as Facebook and google tag manager to reduce the total blocking time(TBT).
  3. Eliminate render-blocking resources - you have to work on reducing the blocking scripts and stylesheets and they increase the overall blocking time for the webpage to load. Try to work with ‘async’ and ‘defer’ attributes for js scripts and preload the CSS files. 
  4. Defer offscreen images - the images on your stores needs to be lazyloaded.
  5. Ensure text remains visible during web font load - use Font-display property as a swap.
  6. Properly sized images.
  7. Reduce Javascript execution time - you need to work on the Js files optimization so that the overall time to execute JS gets reduced. 
  8. Remove facade alternative issue ‘YOUTUBE video’ - you need to optimize the YT video to ensure that the video doesn’t reduce your store speed.  
  9. Avoid enormous network payloads - you need to work on image optimization and video along with the overall resources that the webpage loads. 

 

You can work on all the points listed above using the methods suggested. Also, you can look at the below points to ensure that your store maintains a good score:  

  1. Image compression is important for faster loading of web pages. Make sure your images are of good quality.
  2. Avoid too many images on a single page. 
  3. Prioritize fonts from the Shopify admin panel.
  4. Replace GIFs with static images.
  5. Remove third-party JS scripts and Shopify App which you are no longer in use.
  6. Disable unused app features.
  7. Clear app data while removing an unused app.
  8. Avoid multiple page redirects.
  9. Use video formats for animated content.
  10. Preload the LCP image.
  11. Avoid large layout shifts.
  12. Set width and height on image elements to reduce layout shifts and improve CLS.
  13. Avoid large GIFs for animated content, consider using MPEG4/WebM videos for animations and PNG/WebP for static images.

Hope it’ll help

All best
CedCommerce

CedCommerce || Shopify Expert
- Let us know if our reply is helpful for you. Like it.
- Was your question answered? Mark it as an accepted solution.
- For further discussion contact: Email ID- [email protected]
- Whatsapp:- Join Here

View solution in original post

Replies 4 (4)

MS_WEB_DESIGNER
Shopify Partner
695 52 135

Hi @ValvedExhausts 

This is Anni from MS Web Designer. I helped 1000+ Shopify Store owners to Optimize their website loading speed for both mobile and desktop and increase their conversion rate.

Here are some proven steps that will improve your website speed dramatically for both mobile and desktop.

  • Select a light Weight Shopify Theme (OS 2.0 Compatible
  • Remove all Unwanted Shopify App ( That you have installed, but not using)
  • Minify Javascript, CSS 
  • Reduce the Large Image Size
  • Eliminating the halting problem in Javascript
  • Apply Lazy loading per section wherever required
  • Replace Gifs with the Static Images
  • Resize Products images using Shopify App ( for Bulk )
  • Check Page Speed by Google page Insight.

By fixing these issues, your website speed score can definitely improve
If you want a Free complete Website Optimization Audit Report ( All the Actionable steps for your store ), let me know. 

 

If you have any concerns feel free to ask me!

Pro Tips :
Proven Shopify App to Improve and Sales Conversion Dramatically

Coupon Discount Popup in Cart :
https://apps.shopify.com/available-discount-coupon-list-on-cart-page

- Show Selected Coupons on Cart
- Show Saving on Cart Value
- Boost Conversion Rate & AOV

MS_WEB_DESIGNER_0-1663134933844.png

 

Elegant Sticky Add to Cart, Floating Cart, Sticky Checkout
https://apps.shopify.com/cart2sale

MS_WEB_DESIGNER_1-1663134933677.jpeg

 

Recover abandoned carts and market better with web push

https://apps.shopify.com/pushowl?


Useful Resources for Speed Optimization :
10 Proven Steps that will Improve your Shopify Website Speed
https://blog.mswebdesigner.com/10-proven-steps-that-will-improve-your-shopify-website-speed/

How to Maintain Shopify Speed Post Optimization: A Quick Guidelinehttps://blog.mswebdesigner.com/how-to-maintain-shopify-speed-post-optimization-a-quick-guideline/


Best wishes for your store.

Regards,
Anni

banned

Cedcommerce
Shopify Partner
718 76 113

This is an accepted solution.

Hi @ValvedExhausts,

 

We have checked your store’s speed and as you said it takes forever to load you were right as you can see it in the screenshots below. 

 

You can check your store speed for the product page using the below link: 

https://pagespeed.web.dev/report?url=https%3A%2F%2Fvalvedexhausts.ca%2Fproducts%2Fford-mustang-cat-b...

  

  The major issues are: 

  1. Remove unused JavaScript - they play a huge role in increasing the LCP score which is 12.1s for your store which is much higher than the expected LCP score of 2.5seconds. 
  2. Optimize the third-party scripts such as Facebook and google tag manager to reduce the total blocking time(TBT).
  3. Eliminate render-blocking resources - you have to work on reducing the blocking scripts and stylesheets and they increase the overall blocking time for the webpage to load. Try to work with ‘async’ and ‘defer’ attributes for js scripts and preload the CSS files. 
  4. Defer offscreen images - the images on your stores needs to be lazyloaded.
  5. Ensure text remains visible during web font load - use Font-display property as a swap.
  6. Properly sized images.
  7. Reduce Javascript execution time - you need to work on the Js files optimization so that the overall time to execute JS gets reduced. 
  8. Remove facade alternative issue ‘YOUTUBE video’ - you need to optimize the YT video to ensure that the video doesn’t reduce your store speed.  
  9. Avoid enormous network payloads - you need to work on image optimization and video along with the overall resources that the webpage loads. 

 

You can work on all the points listed above using the methods suggested. Also, you can look at the below points to ensure that your store maintains a good score:  

  1. Image compression is important for faster loading of web pages. Make sure your images are of good quality.
  2. Avoid too many images on a single page. 
  3. Prioritize fonts from the Shopify admin panel.
  4. Replace GIFs with static images.
  5. Remove third-party JS scripts and Shopify App which you are no longer in use.
  6. Disable unused app features.
  7. Clear app data while removing an unused app.
  8. Avoid multiple page redirects.
  9. Use video formats for animated content.
  10. Preload the LCP image.
  11. Avoid large layout shifts.
  12. Set width and height on image elements to reduce layout shifts and improve CLS.
  13. Avoid large GIFs for animated content, consider using MPEG4/WebM videos for animations and PNG/WebP for static images.

Hope it’ll help

All best
CedCommerce

CedCommerce || Shopify Expert
- Let us know if our reply is helpful for you. Like it.
- Was your question answered? Mark it as an accepted solution.
- For further discussion contact: Email ID- [email protected]
- Whatsapp:- Join Here
ValvedExhausts
Excursionist
20 0 7

Can you do these solutions for me,

I am not the best with coding and all that 

Kyle Bristow
Cedcommerce
Shopify Partner
718 76 113

Sure! we have replied to your message in the inbox kindly check that and then we can proceed accordingly.

CedCommerce || Shopify Expert
- Let us know if our reply is helpful for you. Like it.
- Was your question answered? Mark it as an accepted solution.
- For further discussion contact: Email ID- [email protected]
- Whatsapp:- Join Here