Higher load time after adding Facebook SDK

I'm working on adding Facebook social buttons for my website. You can view the website here.

I'm a beginner when it comes to Facebook API, however after adding the code in the footer, the load time of the website went much higher.

I did some research via Google, but I didn't find any good solution. I have tried to add open source jQuery social plugins, but that didn't go as I wanted.

I want to be able to use the default Facebook like/share buttons (which is currently on the footer).

Is there any way I can reduce the load time with the current code I have added with jQuery for example? Or is there any other way around so I can keep the default Facebook like/share buttons without affecting the load time?

Here is the current JavaScript code I have added after the <body> tag:

<script>
  window.fbAsyncInit = function() {
    FB.init({
      appId      : 'your-app-id',
      xfbml      : true,
      version    : 'v2.3'
    });
  };

  (function(d, s, id){
     var js, fjs = d.getElementsByTagName(s)[0];
     if (d.getElementById(id)) {return;}
     js = d.createElement(s); js.id = id;
     js.src = "//connect.facebook.net/en_US/sdk.js";
     fjs.parentNode.insertBefore(js, fjs);
   }(document, 'script', 'facebook-jssdk'));
</script>

Here is the HTML code at the footer:

<li><div class="fb-like" data-href="https://developers.facebook.com/docs/plugins/" data-layout="button_count" data-action="like" data-show-faces="false" data-share="true"></div></li>

Thanks in advance!

Solution

Ok then since we solved it, we moved the facebook loading to happen after the page loads like so:

$(window).load( function(){ 
    (function(d, s, id){ 
         var js, fjs = d.getElementsByTagName(s)[0]; 
         if (d.getElementById(id)) {return;} 
         js = d.createElement(s); 
         js.id = id; 
         js.onload = function() { fbAsyncInit(); }
         js.src = "//connect.facebook.net/en_US/sdk.js"; 
         fjs.parentNode.insertBefore(js, fjs); 
     }(document, 'script', 'facebook-jssdk')); 
});

The only change I made was to add an onload directly to the script tag which triggers on the load of the script since that loads after the body load, which triggers facebook's api to start up basically like normal.