页面上有多个“Like Button”

Question

我有一篇包含20篇文章的页面，每篇文章都有一个Facebook Like Button，使用标签实现。

因此，我的网站速度大大减慢，因为Firefox会在后台为每个类似按钮进行查询。

我有什么办法可以减轻这种负担吗？

Answer 1

根据我的经验，所有额外的IFRAM实际上都比使用JavaScript SDK更快，即使Like图标应该异常加载。我有一个页面上有大约18个相似的按钮，至少IFRAME方法不会导致像JS版本那样的用户感觉减速 - 唯一的缺点是Like按钮“弹出”到页面中一点点IFRAMES的后期。

Answer 2

我假设您正在使用iframe来显示您喜欢的按钮。性能是使用iframe的缺点。如果你有20个iframe，则相当于加载20个网页（有20个独立的http请求）。由于浏览器每个域都有连接限制，因此加载这么多iframe可能需要一段时间。在旧版浏览器中尤其如此，其中每个域的连接限制仅为2，这意味着一次只能加载2个iframe。 iframe也可能具有阻止其他下载的负面影响，这使得问题更加严重。您可以在此处阅读有关iframe性能问题的所有信息：

http://www.stevesouders.com/blog/2009/06/03/using-iframes-sparingly/

如果可能，您可能需要考虑使用xfbml like按钮而不是iframe。不幸的是，这意味着您需要加载Facebook的JavaScript SDK，但是有20个类似的按钮，您应该会看到整体性能提升。

Answer 3

作为替代方案，如果你不热衷于xfbml的想法，你可以尝试像OpenLike这样的服务：http://openlike.org/

来自docs：

  

通过首先加载OpenLike javascript然后调用OPENLIKE.Widget（）来创建窗口小部件。多个小部件可以嵌入到同一页面中，每个小部件都有不同的选项。

Answer 4

我最终使用JQuery Sonar进行类似于此解决方案Lots of XFBML Facebook Like buttons are slow?的操作。它似乎为我做了伎俩。我更喜欢一个加载所有按钮的单个调用，但它不受我的控制。

如果我有更多的时间，我会做的是使用facebook API获取计数并制作我自己的按钮（如果我想要他们的功能，可能会在悬停时加载真正的按钮但是你只需要调用“分享”功能直接）。我目前没有时间按摩facebook这么多，所以这是一个临时的黑客攻击，我认为没有太多的缺点，它似乎被许多不同的网站使用。