How can I safely remove non-critical CSS code to enhance website speed?

Solved

How can I safely remove non-critical CSS code to enhance website speed?

Maalin223
Visitor
2 0 0

Hello! 

I really want to increase my websites speed and have seen in Chrome developer tools "Coverage" that I am not using 99,4% of the Shopify CSS. 

Can I remove some CSS code to increase the load speed without breaking my website? And can I delete/comment out some of the code that is Red (non-critical) as seen in the picture below?

 

Thanks for any advice and help! 😄

Skärmavbild 2022-11-29 kl. 10.17.03.png

 

 

 

 

 

Accepted Solution (1)
EcomRAZ
Shopify Partner
85 6 6

This is an accepted solution.

Hi @Maalin223 ,

 The website already has amazing speed with good SEO. Those CSS issues are not showing in the inspection. You can just keep this as it is. 

But one thing to make sure of, You need to keep the website optimized every 3-4 months to maintain good performance and speed. 

Shopify Store Developer || Certified Shopify Partner || Liquid and JavaScript || Figma/XD to Shopify || Shopify Plus || Shopify Speed Optimization
- If you find our reply helpful, please hit Like and Mark as a Solution || Book a Free Call NOW: ecom.raz23@gmail.com || Whatsapp: +923166892449

View solution in original post

Replies 5 (5)

EcomRAZ
Shopify Partner
85 6 6

Hi @Maalin223 ,

 Yes. It is possible to minify the CSS to optimize the website speed. Can you please share website link so I can analyze the speed for you?

 

Cheers 🙂

Zeeshan

Shopify Store Developer || Certified Shopify Partner || Liquid and JavaScript || Figma/XD to Shopify || Shopify Plus || Shopify Speed Optimization
- If you find our reply helpful, please hit Like and Mark as a Solution || Book a Free Call NOW: ecom.raz23@gmail.com || Whatsapp: +923166892449
Maalin223
Visitor
2 0 0

Thanks!
The website is:

www.imperialmaterial.se

EcomRAZ
Shopify Partner
85 6 6

This is an accepted solution.

Hi @Maalin223 ,

 The website already has amazing speed with good SEO. Those CSS issues are not showing in the inspection. You can just keep this as it is. 

But one thing to make sure of, You need to keep the website optimized every 3-4 months to maintain good performance and speed. 

Shopify Store Developer || Certified Shopify Partner || Liquid and JavaScript || Figma/XD to Shopify || Shopify Plus || Shopify Speed Optimization
- If you find our reply helpful, please hit Like and Mark as a Solution || Book a Free Call NOW: ecom.raz23@gmail.com || Whatsapp: +923166892449

oreoorbitz
Shopify Partner
257 31 132

If I'm correct, that's the CSS that is generated when you're viewing an unpublished theme, it loads through content_for_header, and it isn't much to worry about since it's not loaded on the live theme.



Available for pagespeed consulting
https://www.upwork.com/freelancers/~01a19b6cd90193f4f6?viewMode=1&s=1017484851352698949
EcomRAZ
Shopify Partner
85 6 6

It impacts the content whether it's published theme or not. But that impact is not much but still, if you can fix this, why not do that? 🙂

Shopify Store Developer || Certified Shopify Partner || Liquid and JavaScript || Figma/XD to Shopify || Shopify Plus || Shopify Speed Optimization
- If you find our reply helpful, please hit Like and Mark as a Solution || Book a Free Call NOW: ecom.raz23@gmail.com || Whatsapp: +923166892449