FB + Twitter 分享按钮 + FB Like 按钮 === 巨大的性能问题

发布于 2024-10-31 14:24:41 字数 261 浏览 4 评论 0原文

我的全新工作充满了奇妙和可怕的惊喜。这项工作最有趣的部分之一是增强、加速、使一切规模化的意愿。今天，第一个真正的问题。事情是这样的：我们最多有 20 个列表元素，每个元素都显示自己的 Facebook 分享、Twitter 分享和 Facebook Like 按钮。可以想象，打开 60 个 iframe 对于用户体验来说简直就是一种痛苦。我的问题：有人已经面临过这样的问题，您会建议什么来升级这些性能问题？

当我正在考虑 AddThis 实现时，我希望还有其他我可以考虑的解决方案。

原文

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

听不够的曲调 2024-11-07 14:24:41

提高性能的最佳方法不是从 Facebook 插件复制粘贴代码。

Facebook“点赞按钮”代码如下所示：

<div id="fb-root"></div>
<script src="http://connect.facebook.net/en_US/all.js#appId=127702313984818&xfbml=1"></script>
<fb:like href="example.com" send="true" width="450" show_faces="true" font=""></fb:like>

问题是，如果您有 20 个点赞按钮，则使用 id="fb-root" 创建 20 个 Div，并调用 all.js 脚本 20 次。最好的方法是将移动

<div id="fb-root"></div>
<script src="http://connect.facebook.net/en_US/all.js#appId=127702313984818&xfbml=1"></script>

到页面标题，每当您需要“赞”按钮时，仅对

<fb:like href="example.com" send="true" width="450" show_faces="true" font=""></fb:like>

Facebook 评论和评论使用“相同”。其他插件。

此外，facebook 的一些插件提供了使用 xfmbl 或 iframe 代码的选项。始终选择 iframe 代码，因为 facebook 的 js 必须解析所有 xfbml 代码并转换为 iframe。它会导致大量 DOM 插入并减慢页面速度。

希望这有帮助！

Best way to improve performance is not to copy paste the code from facebook plugins.

Facebook 'Like Button' code looks like:

<div id="fb-root"></div>
<script src="http://connect.facebook.net/en_US/all.js#appId=127702313984818&xfbml=1"></script>
<fb:like href="example.com" send="true" width="450" show_faces="true" font=""></fb:like>

Issue with this is, if you have 20 like buttons, then 20 Divs are created with id="fb-root" and 20 times the script for all.js is called. Best way is to move the

<div id="fb-root"></div>
<script src="http://connect.facebook.net/en_US/all.js#appId=127702313984818&xfbml=1"></script>

to header of page and whenever you want a like button, only use

<fb:like href="example.com" send="true" width="450" show_faces="true" font=""></fb:like>

Same goes for facebook comments & other plugins.

Also, foir some plugins facebook provides option to either use xfmbl or iframe code. Always pick the iframe code because facebook's js has to parse all xfbml code and convert to iframe. It causes a lot of DOM insertions and slows down the page.

Hope this helps!

回复收藏 0 原文

~没有更多了~