许多xfml Facebook Like按钮都很慢

Lots of XFBML Facebook Like buttons are slow?

本文关键字：按钮 Like xfml Facebook 许多      更新时间：2023-09-26

参见http://running.ph/

它只是挂铬一段时间，而所有的按钮加载。我读过使用IFrame避免这种情况，但我真的想使用XFBML JS的所有额外的功能，你得到它像跟踪喜欢，评论，和发送按钮。

有人有解决办法吗?我敢肯定，我不是唯一一个有10多个"喜欢"按钮的网站。

啊，我通过查看Techcrunch/AOL的工作找到了答案。在用户滚动时加载xfml。

1)。不要在FB上解析xfml。init或加载JS SDK

FB.init({
  appId  : APP_ID,
  xfbml  : false
});

2)。加载jQuery和jQuery .sonar.js -这包含滚动和滚动自定义事件

<script src="//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script src="http://artzstudio.com/files/jquery-boston-2010/jquery.sonar/jquery.sonar.js"></script>

3)解析滚动事件上的XFBML的jQuery代码(偷自Techcrunch)

jQuery(document).ready(function($) {
    var $shareWidgets = $( '.share-widget' );
    $shareWidgets.bind( 'scrollin', { distance: 500 }, function() {
        var $share = $( this );
        if (!$share.data( 'initFB' ) && window.FB) {
            $share.data('initFB', 1);
            $share.unbind( 'scrollin' );
            FB.XFBML.parse( $share[0] );
        }
    });
});

4.)将XFBML标签包装在一个名为'share-widget'的类中

<span class="share-widget"><fb:like></fb:like></span>

瞧!不再有该死的xfxml减慢您的页面。当然，这只有在页面上有很多xhtml标记时才有用。大多数博客都有。

谢谢AOL!

参见AOL使用jQuery的SlideShare演示:http://www.slideshare.net/daveartz/jquery-in-the-aol-enterprise，他们在那里讨论了这个和他们使用的其他优化。

Sharrre只在需要的时候加载你的分享按钮，你可以使用所有喜欢的按钮功能，它有内置的谷歌分析跟踪。

我对此也有问题。

这是社交网络的API错误。如果你在Chrome中查看。NET选项卡，你会看到每个页面有252个请求!(Facebook, g+， Twitter，你的资源)

这是问题的一部分

loadScriptAsync('//connect.facebook.net/en_US/all.js');

它加载所有可能的脚本，可能多次没有缓存。我认为这是无法避免的。

OT:为什么在登录网站时需要离线短信访问?我想没有哪个聪明人愿意给你他/她的电话号码和/或离线访问权限

下面是一个快速的纯javascript代码片段，用于帮助对多个like按钮进行节流:

https://stackoverflow.com/a/11002386/223002

相关文章：