Google pagespeed is complaining about my facebook like button script. How can I defer the script?
45KiB of JavaScript is parsed during initial page load. Defer parsing JavaScript to reduce blocking of page rendering. http://static.ak.facebook.com/.../xd_arbiter.php?... (21KiB of inline JavaScript) https://s-static.ak.facebook.com/.../xd_arbiter.php?... (21KiB of inline JavaScript) http://www.facebook.com/.../like.php?... (3KiB of inline JavaScript)
Here's the code I'm using and I'm loading it into a .js file in the footer of my page.
(function(d,s,id){
var js,fjs = d.getElementsByTagName(s)[0];
if(d.getElementById(id)){return;}
js=d.createElement(s);
js.id=id;
js.async=true;
js.defer=true;//THIS DOES NOT APPEAR TO SATISFY PAGESPEED
js.src="//connect.facebook.net/en_US/all.js#xfbml=1";
fjs.parentNode.insertBefore(js,fjs);
}
(document, "script", "facebook-jssdk")
);
Results in the following script tag (via Chrome's inspector):
<script
id="facebook-jssdk"
async=""
defer=""
src="//connect.facebook.net/en_US/all.js#xfbml=1"></script>
Use the setTimeout luke!
setTimeout( function () {
(function(d,s,id){
// load js
...
}
(document, "script", "facebook-jssdk")
);
}, 3000);
You can throw the load in another 'thread' to async or Defer it