Slow page load / blank screen before each page loads


Hi there!


I'm on a mission to speed up my site.


One thing I've noticed is a strange behavior compared to just about every other site; when you navigate to another page, the entire browser goes white/blank until the new page loads all at once.


So, one might expect the header to stay while the content in the middle loads, but that's not the case. Or, you might expect to stay on the current page until the next one loads, but that's not what my does either. Just a totally blank page, and then boom a completely loading page all at once.


I have a hunch that the order in which the items in my theme / head are coded could be causing this, perhaps some script should be moved down, something like that. Can any of you guys tell just by inspecting my site?


Thanks so much in advance!



Shopify Expert
2660 63 662


here is the code from your head (I mean <head>):

  <!-- Google Tag Manager -->
  <style>.async-hide { opacity: 0 !important} </style>
<script>(function(a,s,y,n,c,h,i,d,e){s.className+=' '+y;h.start=1*new Date;
h.end=i=function(){s.className=s.className.replace(RegExp(' ?'+y),'')};

Which basically (among other things):

  1. add a CSS rule to make element with class async-hide transparent
  2. Assigns this class to your html 
  3. Waits 4 seconds 
  4. removes this class, effectively revealing your site (which should be more or less fully loaded by this time)

So the question is why this code was added and by whom?

Want to hire me to tweak a theme? Mail me at!
My post solved your problem? Like it!
1 Like
Thanks for pointing this out !

It’s actually from Google Optimize, which is their A/B testing platform; I was experimenting with it a while back.

I’ll be removing this ASAP.