Laad Facebook Vind ik leuk en deel knop sneller

Hoe de Facebook-knop asynchroon laden?

Bijna elke blog, een website heeft een like-, deel- of volgknop van Facebook.

Zoals u wellicht weet, wordt de standaard Facebook-code voor sociaal delen synchroon geladen met uw webpagina-bronnen.

Dit zal de laadtijd van uw website verhogen en de SEO-score schaden. Het is gewoon geen SEO, maar bederft ook de gebruikerservaring.

Ik weet zeker dat de Facebook-knop voor sociaal delen essentieel is, maar niet als uw daadwerkelijke code om eerst weer te geven. Er zijn veel blogs of websites met een hogere laadtijd van pagina’s vanwege de standaard Facebook-code.

  Wissel privé foto's van een evenement uit met je Facebook-vrienden

Door asynchroon Facebook-code te gebruiken, kunt u uw webpagina 0,5 – 1,5 seconde sneller laden. Dit is wat je nodig hebt om de like-, deel- of volgknop van Facebook sneller te laden.

Hier is de code waar ik vandaan kwam Facebook-ontwikkelaar voor like en deel op epcdream.nl.com

<div id="fb-root"></div>
<script>(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#xfbml=1&appId=xxxxxxxxxx&version=v2.0";    
fjs.parentNode.insertBefore(js, fjs);  
}(document, 'script', 'facebook-jssdk'));</script>

Nu hoef ik alleen maar de enkele regel in mijn code te volgen, wat zal helpen om knoppen sneller te laden.

js.async=true;

Dus de gewijzigde code zou zijn:

<div id="fb-root"></div>
<script>(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.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&appId=xxxxxxxxxx&version=v2.0";    
fjs.parentNode.insertBefore(js, fjs);  
}(document, 'script', 'facebook-jssdk'));</script>

Is het niet gemakkelijk?

  Schakel uw Facebook-e-mail uit en houd spam buiten

Update: de nieuwe codefragmenten die door Facebook worden aangeboden, hebben bovenstaande niet nodig, omdat het script-async bevat dat je hieronder al kunt zien.

<div id="fb-root"></div>
<script async defer crossorigin="anonymous" src="https://connect.facebook.net/en_US/sdk.js#xfbml=1&version=v7.0" nonce="JekfmCeX"></script>

WordPress gebruiken? Bekijk dit bericht waarin wordt uitgelegd hoe u kunt optimaliseren voor prestaties zonder een plug-in. En als u op zoek bent naar een plug-in voor sociale media die niet vertraagt, dan raad ik u ten zeerste aan Novashare.

Ik weet zeker dat u het prettig vindt dat uw webpagina sneller laadt, en ik hoop dat dit u helpt.

Met plezier het artikel gelezen? Hoe zit het met delen met de wereld?

  Bijlagen verzenden in Facebook Messenger

gerelateerde berichten