PageSpeed Insights - Excessive DOM size (I was told I need a Shopify expert for this)

[ManKaveStore]

My website is: https://mankave.store/

 and I am using the Refresh Theme.

I have a few errors, but I'm either going to address them one at a time, or until I can find someone reliable enough to help me with this. Here is one of the major errors I believe I need fixed

"Avoid an excessive DOM size 7,244 elements

A large DOM will increase memory usage, cause longer style calculations, and produce costly layout reflows. Learn how to avoid an excessive DOM size.TBT

StatisticElementValue

Total DOM Elements		7,244
Maximum DOM Depth	a#Afghanistan > span.visibility-hidden > svg.icon > path <path fill-rule="evenodd" clip-rule="evenodd" d="M11.35.643a.5.5 0 01.006.707l-6.77 6.886a.5.5 0 01-.719-.006L.638 4.845a.5…" fill="currentColor">	23
Maximum Child Elements	div.disclosure > div.disclosure__list-wrapper > div#HeaderCountryMobile-country-results > ul.list-unstyled <ul role="list" class="list-unstyled countries">

I assumed merely removing the shipping to that country would fix it, but it did not. I'm sure there is some edit in the theme code to fix this...

[oreoorbitz · Accepted solution]

Here is the thing about DOM size, there is no free lunch. The more content you have, the more dom elements you have
Content = DOM elements. 
Of course things can be done a way to minimize DOM content, or not, but most developers don't give a **** about minimizing DOM content, usually because they are not instructed to, so there you have it. So yeah, depending on your theme, how many sections you have on any page, and the amount of apps you have injecting content, you can end up with alot of DOM elements.

Here is an experiment, copy your live theme, in the copy, go into the customizer and remove all the sections on the homepage, save. Take the preview URL, and run that in Page Speed Insights. If you have noticable reduction in DOM size, then you have too many homepage sections. If there is not a noticable change, then its either the header, or content being injected elsewhere, like popups, that are are heavy in DOM elements.

In summary: there is no easy fix, you have to decide whats really vital for your page and remove what isn't, if you are going to worry about that warning.

[ManKaveStore]

I'll look into this. I ended up hiring someone on Fiverr to help get me approved on Google Merchant Center, which is the reason why I was trying to improve these pagespeed issues.

Hopefully it all works out, thanks!