加载Facebook点赞和共享按钮更快

如何异步加载Facebook按钮？

几乎每个博客, 网站都有Facebook的点赞, 分享或关注按钮。

如你所知, 默认的Facebook社交共享代码与你的网页资源同步加载。

这将增加你的网站加载时间并损坏SEO得分。这不仅是SEO, 还会破坏用户体验。

我确定Facebook社交分享按钮是必不可少的, 但不是你要显示的实际代码。由于默认的Facebook代码, 许多博客或网站的页面加载时间更长。

异步使用Facebook代码将帮助你更快地加载网页0.5 – 1.5秒。这就是你必须更快地加载Facebook的喜欢, 共享或关注按钮的功能。

这是我从Facebook Developer获得的代码, 喜欢分享给geekflare.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>

现在, 我需要添加的只是代码中的一行, 这将有助于更快地加载按钮。

js.async=true;

因此修改后的代码将是：

<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>

容易吗？

使用WordPress？请查看这篇文章, 其中介绍了如何在没有插件的情况下优化性能。而且, 如果你正在寻找不会减慢速度的社交媒体插件, 那么我强烈建议你使用Social Warfare。

我确定你希望网页加载速度更快, 希望对你有所帮助。