Optimize online store

[Coelho63]

is there any code that I can add to improve my mobile and desktop performance

[kazi]

Hello @Coelho63 

                                        If you want to optimize speed of your shopify store test the store current performance in google page speed tool. Most of them are

- Optimize your large images/media files make them smaller and convert .webp lightweight

- Clean unused CSS/JS codes

- Fix render blocking resources

- Lazyload off screen media files

- Fix Javascript errors (check chrome console)

- Optimize CSS/JS files

If you google you will find more

[Coelho63]

https://lojamanuelcoelho.com/

This is my store, please verify

Thanks

[Coelho63]

Hi Blake

What do you mean by We can help you with this Shopify theme?

I appreciate all support

Thanks

[Website_Speedy]

Hi,

Certainly! Improving mobile and desktop performance on your Shopify store is crucial for providing a smooth user experience and boosting your conversion rates. Below are code-based solutions and strategies that can help optimize your Shopify store’s performance across both mobile and desktop:

1. Optimize Images for Faster Loading

Use srcset to serve different image sizes based on the screen resolution and device. This ensures users get the best quality image while keeping load times fast.

<img srcset="{{ 'image_small.jpg' | asset_url }} 480w, {{ 'image_medium.jpg' | asset_url }} 1024w, {{ 'image_large.jpg' | asset_url }} 1920w"

     sizes="(max-width: 480px) 480px, (max-width: 1024px) 1024px, 1920px"

     src="{{ 'image_large.jpg' | asset_url }}" alt="Product Image">

Use WebP Images: WebP is a modern image format that provides better compression. If your Shopify store doesn’t automatically serve WebP images, you can use apps like Image Optimizer or TinyPNG to convert and serve WebP versions of your images.

<picture>

  <source srcset="{{ 'image.webp' | asset_url }}" type="image/webp">

  <img src="{{ 'image.jpg' | asset_url }}" alt="Product Image">

</picture>

1. Enable Lazy Loading for Images

You can add the loading="lazy" attribute to your images

<img src="{{ 'image.jpg' | asset_url }}" alt="Product Image" loading="lazy">

1. Defer Non-Essential JavaScript

Use the defer or async attribute for non-critical JavaScript files:

<script src="{{ 'non-critical.js' | asset_url }}" defer></script>

1. Minify CSS and JavaScript
   
2. Check Your Shopify Theme

• Removing unused sections or features that aren’t needed for the user experience.

By implementing these design and performance improvements, you should see an increase in core web vital.

Alternative: If you do not want to invest much time on optimizing yourself, you can try our speed optimization tool called Website Speedy, that comes with 14-days trial.

It will do the optimization automatically for you.

You can install it here: https://apps.shopify.com/website-speedy

(Disclaimer: We are the developer of this tool and are happy to answer any questions you may have.)

[Coelho63]

Good morning

Please let me know where to paste these codes

Website speedy does not have any 14 day trial period

[image: image.png]

Thanks

[Website_Speedy]

Hi,

While you install, from there 24 hours of free trial is activated and if you see the improvement, you've to activate the 14 days trial period which will be done and activated once you add the payment method to your account.

Within the 14 days you can review the performance and subscribe to the plan if you're satisfied with it. If not, you can reach out to us and we'll do the manual optimization for your website to improve the performance at it's best potential.

Please let me know if you have any questions.

[Coelho63]

Good morning

There is no change at all

Cumulative Layout Shift still in 0.12

[Website_Speedy]

Hi @Coelho63 , 

There should be an option for expert optimization, which you can directly go and activate in the account itself.

Please check and let me know if you did not find it.

[Coelho63]

Hi

This is very difficult for me, can you please check

[Website_Speedy]

Hi,

I will be happy to take a look at the website. I have sent you a message in the DM.

[Coelho63]

Please do

https://lojamanuelcoelho.com/

[Coelho63]

Hi all

I dont see any improvement, yesterday was better

[Coelho63]

Good morning and thanks for your kind answer

Can you please let me know where to paste these codes

Thanks,

Manuel Coelho