Facebook推荐/最近的活动挂在浏览器上,速度非常慢

Facebook Recommendations/Recent Activity Hangs Browser and is Really slow

本文关键字:浏览器 速度 非常 推荐 最近 活动 Facebook      更新时间:2023-09-26

我在我的网站上使用了Recommendations插件,它的加载速度非常慢,主要是使用Firefox。

我发现大多数FB插件似乎都有这个问题。是不是因为他们创建的iFrame,插件似乎创建了很多数据。

制作我自己的JS verson会更好吗?

如果是,是否有人有任何指针可以通过FQL/AJAX调用访问相同的数据?

根据下面的评论,我想我应该确切地解释我正在做什么,我正在使用下面的脚本动态加载插件。目前只显示推荐插件,但最终所有提到的都会被包括在内。

无论如何。。。我已经注意到这个问题,甚至在直接将插件注入页面时也是如此。

$(文档).ready(函数(){addFBelements();});

 //==== THIS GENERATES SOCIAL ELEMENTS ====
 function addFBelements() {
     window.fbAsyncInit = function () { // sets up asynchronous loading of FB elements
         FB.init({ // initialise FB
             appId: 'MYAPPID',
             status: true, // check login status
             cookie: true, // enable cookies to allow the server to access the session
             xfbml: true,  // parse XFBML
             oauth: true
         });
     };
     (function () {
         if ($("#fb-root").length <= 0) {
             $('body').prepend('<div id="fb-root"></div>'); // add FB div to top of page if not already there
         };
         var e = document.createElement('script'); // load the Facebook Javascript file
         e.src = document.location.protocol + '//connect.facebook.net/en_US/all.js';
         e.async = true;
         document.getElementById('fb-root').appendChild(e);
         $.getScript(document.location.protocol + '//apis.google.com/js/plusone.js'); // Load Google Plus files
         $.getScript(document.location.protocol + '//platform.twitter.com/widgets.js'); // load Twitter files
         renderButtons(); // render the buttons in the page
     } ());
 };
 // ends setting up of FB/Twitter etc links and JS files
 // add Social elements to the pages where required with correct sharing URLs
 function renderButtons() {
     var linkUrl = window.location.href;
     if ($('.googlePlus').length > 0) {
         $('.googlePlus').html('<g:plusone href="' + linkUrl + '" size="medium" style="float:right"></g:plusone>');
     };
     if ($('.fbLike').length > 0) {
         $('.fbLike').html('<fb:like send="false" href="' + linkUrl + '" layout="button_count" width="80" show_faces="false" font="arial"></fb:like>');
     };
     if ($('.fbSend').length > 0) {
         $('.fbSend').html('<fb:like send="false" href="' + linkUrl + '" layout="button_count" width="80" show_faces="false" font="arial"></fb:like>');
     };
     if ($('.tweet').length > 0) {
         $('.tweet').html('<a href="http://twitter.com/share" data-url="' + linkUrl + '" class="twitter-share-button" data-count="none" data-via="hartnollguitars">Tweet</a></span>')
     };
     if ($('.fbComments').length > 0) {
         $('.fbComments').html('<fb:comments href="' + linkUrl + '" num_posts="3" width="640"></fb:comments>');
     };
     if ($('.fbRecommend').length > 0) {
         $('.fbRecommend').html('<img style="border: none" alt="" src="images/like_us_home.png"><fb:activity recommendations="true" border_color="#000000" font="arial" colorscheme="dark" header="false" height="400" width="220" site="www.hartnollguitars.co.uk"><span>');
     };
 };
 // == END OF SETTING UP SOCIAL NETWORKING ELEMENTS. ====

您可以看到,该脚本设置了我的所有FB/Twitter等元素,并将它们插入到具有相应类的元素中。

appId元素不是所讨论的目的所必需的,但我还有一个Events部分,它显示我的FB事件和FB登录,因为我需要appId进行验证。

(只是想解释一下,虽然只显示推荐很庞大,但它的作用要大得多!)

请不要将window.fbAsyncInit = function () {放在jQuery的$(document).ready(function () {中,因为在不同的浏览器中,在不同的条件下会导致混合结果。请参阅我最近的回答:

http://facebook.stackoverflow.com/questions/9788273/fblogin-button-not-showing-up-in-firefox-ie-or-opera-but-works-fine-in-chro/9792371#9792371

我在IE8中也看到了$('.googlePlus').html('<g:plusone的问题。请参阅:在IE 8 页面加载后添加Google+1按钮