DOM Size reduction

[Namit]

GTMetrix and google keep asking me to reduce the DOM size on www.kathaakaar.in

How do I do this?

[oreoorbitz]

Remove elements from your page.

[JohnCodes]

Hi @Namit 

As @oreoorbitz mentioned, you'll want to reduce the number of elements being used throughout your website.

This could be due to apps or your theme injecting excessive HTML elements into your site. A possible way to tackle this issue would be to perform an audit on the apps you're currently using and uninstall any that aren't absolutely essential. Uninstalling any unneeded apps will likely remove that code from your site and will ultimately result in a reduced DOM size, especially if it is a larger app.

Quick note: Sometimes, even after uninstalling an app, the code stays in your theme. You might want to jump into your theme code after uninstallation to verify that the code has been removed.

Beyond uninstalling apps to reduce DOM size, you can remove any unused code in your theme (this can get very tricky and time-intensive), or remove any page elements that may not be necessary. 

If that isn't possible then I'd recommend just trying to optimize other areas of your site to improve performance. I ran your product page through the Shopify Analyzer (free tool our team built for the Shopify community). It looks like all of your pages could benefit from some lazy loading, but your product pages could benefit from multiple optimizations. You can check out the report at https://analyze.speedboostr.com/result/fwfgiecazq.

Feel free to reach out to our team at speedboostr.com/contact if you have any questions or need any help with your optimizations. If you'd prefer to handle these issues on your own, you can check out our optimization guide: How To Optimize a Shopify Site: Complete Guide to Faster Load Speed

I hope this helps!

[Namit]

Thank you for your reply

 There are virtually no apps on the site. not 1. 

I combed the code and did not find any un necessary code but I do find this.

 

GTMetrix Says: 

Top Issues

These audits are identified as the top issues impacting your performance.

  

IMPACT AUDIT    

Med-High	Avoid an excessive DOM size
Med-Low	Avoid CSS @import
Low	Use passive listeners to improve scrolling performance
Low	Serve static assets with an efficient cache policy
Low	Preconnect to required origins

[JohnCodes]

Hi @Namit 

That notification you're getting regarding the deprecation of SCSS files on Shopify shouldn't have anything to do with your current website performance. That's just to notify developers that they'll be moving away from SCSS file types and will strictly be using CSS files moving forward. If you're interested in reading more about this change: https://www.shopify.com/partners/blog/deprecating-sass.

Your GT Metrix scores are actually quite good. We typically see Shopify stores scoring unsatisfactorily in multiple categories, whereas your store is only showing an unsatisfactory time for Total Blocking Time. It looks like this might be related to one of your main style files (vendor.min.css), but deferring it could potentially cause issues. It's hard to say.

Regarding the audit issues GT Metrix is displaying:

• Avoiding an excessive DOM size can only be reduced at this point by reducing the number of elements on your pages, but I wouldn't recommend removing any elements if they aid in generating sales.
• The files causing the Avoid @CSS import and serving static assets with efficient cache policy issues are pretty much all 3rd party scripts that can only be adjusted by the developer they're coming from. There's not much you can do beyond reaching out to the developers themselves.
• GT Metrix is recommending that you preconnect to https://monorail-edge.shopifysvc.com. If you'd like to handle that yourself, we have an article that describes the process in greater detail: https://speedboostr.com/preloading/

I hope this info helps!