Statcounter asynchronous code - non render blocking

From ETCwiki
Revision as of 19:04, 26 July 2015 by Ddxfish (talk | contribs) (Created page with "Recently I have been working on asynchronous loading of javascript resources on my pages. I use Statcounter as my way to see who visits my sites. Statcounter's code by default...")
(diff) ← Older revision | Latest revision (diff) | Newer revision → (diff)
Jump to navigationJump to search

Recently I have been working on asynchronous loading of javascript resources on my pages. I use Statcounter as my way to see who visits my sites. Statcounter's code by default is not asynchronous. If you use Google's Pagespeed Insights, it will read:

Eliminate render-blocking JavaScript and CSS in above-the-fold content


Statcounter async code

The only thing you need to add is the word "async" inside the script tag at the end. This is new as of HTML5. Your result will look like this:


<!-- Start of StatCounter Code for Default Guide -->
 <script type="text/javascript">
 var sc_project=YOURPROJECTHERE; 
 var sc_invisible=1; 
 var sc_security="YOURCODEHERE"; 
 var sc_https=1; 
 var sc_remove_link=1; 
 var scJsHost = (("https:" == document.location.protocol) ?
 "https://secure." : "http://www.");
 document.write("<sc"+"ript type='text/javascript' src='" +
 scJsHost+
 "statcounter.com/counter/counter.js' async></"+"script>");
 </script>
 <noscript><div class="statcounter"><img class="statcounter"
 src="http://c.statcounter.com/4776581/0/c22fb62c/1/"
 alt="shopify traffic stats"></div></noscript>
 <!-- End of StatCounter Code for Default Guide -->