Can you check the speed of a theme that has not been published yet?

Solved

Can you check the speed of a theme that has not been published yet?

LSAccounting
Trailblazer
197 1 30

I have recently got an updated version of my theme (Spark) as my current version is very slow. I was wondering if I can check the speed of the updated version (which I have not published yet but I did copy the codes from my old one (json)) 

 

I don't want to publish and potentially loose my old version if the speed is still the same.

By L&S Team
Accepted Solution (1)

Cedcommerce
Shopify Partner
718 76 113

This is an accepted solution.

Hello @LSAccounting

 

First, you need to bring all the required changes from your old theme to your new theme. Then you can compare the speed and publish anyone of them. As we have checked both the themes have the same website speed score.

 

In case you find your speed to be average or poor, you need to work on the following below-mentioned points :

 

Note: We advise you to follow the below suggestions only if you are familiar with the Shopify theme or liquid.code, else please refrain from this and ask a Shopify developer to help you with it or connect with us. 

 

  • Reduce unused JavaScript
  • Reduce and Eliminate render-blocking resources
  • Use minified CSS and JS files
  • Replace GIFs With Static Images
  • Reduce Large Image Sizes
  • Image compression is important and a necessity for faster-loading web pages. Make sure your images are of good quality and do not add too many images on a single page. You can try some tools like tinypng
  • Firstly try to find fonts from the Shopify admin. If the third-party font is required then should upload to the Assets folder.
  • Use the Font-display property as a swap.
  • Replace GIFs with static images
  • To reduce the initial load time, you can use the Lazy load technique
  • Remove third-party JS scripts and Shopify App which you are no longer using you should disable app features you don't use, or you can remove the app if you don't need it. If you are removing an app make sure to remove the code that was added as part of the app install process.
  • Avoid multiple-page redirects
  • Use video formats for animated content
  • Preload the Largest Contentful Paint image
  • Avoid large layout shifts
  • Set an explicit width and height on image elements to reduce layout shifts and improve CLS. 
  • Large GIFs are inefficient for delivering animated content. Consider using MPEG4/WebM videos for animations and PNG/WebP for static images instead of GIF to save network bytes.
  • Apply lazy loading  on video

 

Check the below images for references.

Cedcommerce_0-1669191994702.png

 

image.png

 

Cedcommerce_1-1669191994707.png

 

image.png

 

Hope it helps, let us know if you need any further help. 

 

Regards, 

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- apps@cedcommerce.com
- Whatsapp:- Join Here

View solution in original post

Replies 12 (12)

MandasaTech
Shopify Partner
723 146 153

Hello @LSAccounting,
Please share your updated website preview link.

☞ Helpful or Question answered? Please Click Like & Mark it Accepted Solution
☞ Want to modify or custom changes on store for affordable price? Click on Contact button here
☞ Email at info@mandasa.in
☞ Whatsapp at +918989609120 | Hire us at: Website Support Page
LSAccounting
Trailblazer
197 1 30

@MandasaTech 

 

https://www.lsaccountingfirm.com/?_ab=0&_fd=0&_sc=1

This is the one that has updated and is in my theme library - I haven't completely updated everything. 

 

https://www.lsaccountingfirm.com/ 

This is my original with the low speed levels. 

 

I think these links do not work anyway because once you try to access the updated version which has not been posted it takes you to the old one. 

 

TIA

 

 

By L&S Team
MandasaTech
Shopify Partner
723 146 153

@LSAccounting,

Please share preview Link - 

https://www.lsaccountingfirm.com/?_ab=0&_fd=0&_sc=1
It's you live website URL

☞ Helpful or Question answered? Please Click Like & Mark it Accepted Solution
☞ Want to modify or custom changes on store for affordable price? Click on Contact button here
☞ Email at info@mandasa.in
☞ Whatsapp at +918989609120 | Hire us at: Website Support Page
LSAccounting
Trailblazer
197 1 30

@MandasaTech This was the preview link. 

By L&S Team
oscprofessional
Shopify Partner
16022 2401 3107

@LSAccounting ,

I have checked your store. Here is the score.

 

oscprofessional_0-1669191080663.png

I have gone through your store. It really looks nice. You have chosen the best-known e-commerce solution Shopify platform currently on the market.

 

Optimizing your Shopify store is time-consuming. Themes are made up of Liquid, HTML, CSS, and JavaScript code. When you edit or customize the themes, file sizes can increase and affect your store speed.

 

Google PageSpeed Insights is a free tool to help you find and fix issues slowing down your web application. Get your PageSpeed score and use PageSpeed suggestions to make your website faster through our online tool.

 

You need to work on the following points :

  • Theme Upgrade if there is a scope and upgraded theme available
  • Reduce JS Payload.
  • Use Critical CSS.
  • Replace GIFs With Static Images
  • Reduce Large Image Sizes
  • Migrate Tracking Codes To Google Tag Manager
  • Compress Images
  • Limit Third-Party JavaScript & Shopify Apps
  • Preload Web Fonts. 
  • I would suggest limiting to one and using a standard web font.

By fixing these issues, your website speed score can definitely improve.

If you’re looking to improve your Shopify store’s site performance or SEO.

For more details please check the link below. 

 

https://www.oscprofessionals.com/blog/shopify-speed-optimization-guide/

If anything is missed out or unclear then don't hesitate to ask. 

We will surely help you. 

Have a nice day !

Get pass your Store Core Web Vital Free Speed Optimization Audit, Chat on WhatsApp | Skype : oscprofessionals-87 | Email: pallavi@oscprofessionals.com | Hire us | Guaranteed Site Speed Optimization | Website Free Audit | Shopify Theme Customization | Build Shopify Private App | Shopify SEO | Digital Marketing | Oscp Upsell & Cross sell App : Free | Oscp Sales & Volume Discount App : Free | Custom Pricing Wholesale App : Free
LSAccounting
Trailblazer
197 1 30

@oscprofessional  Hi! 

 

So the score you have checked is for my existing website. My question was regarding the theme update that I have not yet published.

 

But thank you for the tips, I will definitely go through them and complete what I can as when it comes to things like reducing JS payload, preloading web fonts or migrating tracking codes to google tag manager - I have no idea what any of these mean! 

By L&S Team
oscprofessional
Shopify Partner
16022 2401 3107

@LSAccounting ,

May be you should have an expert Shopify developer.

Get pass your Store Core Web Vital Free Speed Optimization Audit, Chat on WhatsApp | Skype : oscprofessionals-87 | Email: pallavi@oscprofessionals.com | Hire us | Guaranteed Site Speed Optimization | Website Free Audit | Shopify Theme Customization | Build Shopify Private App | Shopify SEO | Digital Marketing | Oscp Upsell & Cross sell App : Free | Oscp Sales & Volume Discount App : Free | Custom Pricing Wholesale App : Free
LSAccounting
Trailblazer
197 1 30

@oscprofessional 

 

I did try to find one to help me but no response from the Shopify Team regarding that as of yet unfortunately. 

By L&S Team

Cedcommerce
Shopify Partner
718 76 113

This is an accepted solution.

Hello @LSAccounting

 

First, you need to bring all the required changes from your old theme to your new theme. Then you can compare the speed and publish anyone of them. As we have checked both the themes have the same website speed score.

 

In case you find your speed to be average or poor, you need to work on the following below-mentioned points :

 

Note: We advise you to follow the below suggestions only if you are familiar with the Shopify theme or liquid.code, else please refrain from this and ask a Shopify developer to help you with it or connect with us. 

 

  • Reduce unused JavaScript
  • Reduce and Eliminate render-blocking resources
  • Use minified CSS and JS files
  • Replace GIFs With Static Images
  • Reduce Large Image Sizes
  • Image compression is important and a necessity for faster-loading web pages. Make sure your images are of good quality and do not add too many images on a single page. You can try some tools like tinypng
  • Firstly try to find fonts from the Shopify admin. If the third-party font is required then should upload to the Assets folder.
  • Use the Font-display property as a swap.
  • Replace GIFs with static images
  • To reduce the initial load time, you can use the Lazy load technique
  • Remove third-party JS scripts and Shopify App which you are no longer using you should disable app features you don't use, or you can remove the app if you don't need it. If you are removing an app make sure to remove the code that was added as part of the app install process.
  • Avoid multiple-page redirects
  • Use video formats for animated content
  • Preload the Largest Contentful Paint image
  • Avoid large layout shifts
  • Set an explicit width and height on image elements to reduce layout shifts and improve CLS. 
  • Large GIFs are inefficient for delivering animated content. Consider using MPEG4/WebM videos for animations and PNG/WebP for static images instead of GIF to save network bytes.
  • Apply lazy loading  on video

 

Check the below images for references.

Cedcommerce_0-1669191994702.png

 

image.png

 

Cedcommerce_1-1669191994707.png

 

image.png

 

Hope it helps, let us know if you need any further help. 

 

Regards, 

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- apps@cedcommerce.com
- Whatsapp:- Join Here
LSAccounting
Trailblazer
197 1 30

@Cedcommerce 

 

Hi!

 

Unfortunately, same with the answer above yours. The speed you have been comparing are for the same existing theme rather than one for the already published and one for the one that has not been published yet. 

 

Thank you for providing tips for speed optimising however, most of these I have no idea how to do. I.e., reducing the render blocking resources. 

By L&S Team
Cedcommerce
Shopify Partner
718 76 113

Hello @LSAccounting,

 

Okay, then we suggest you hire a Shopify expert who will optimize your website speed for any of your themes whether it is published or not.

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- apps@cedcommerce.com
- Whatsapp:- Join Here

OneCommerce
Shopify Partner
253 19 109


Hi there,
Pls follow the instructions in the images below to get the preview link
https://prnt.sc/cImhuy8ZihEb
Then pls kindly use Google Page Speed to measure your speed score and compare it with your current score without publishing the edited theme

OneCommerce - The Ultimate eCommerce Solution Platform
We offer 12+ solutions to help increase traffic, maximize conversion rates and generate better revenue for more than 500,000 eCommerce merchants worldwide.

Get know us at: Website | Blog | FAQ | Contact us