Facebook推荐/近期活动挂起浏览器并且速度非常慢

时间:2012-03-19 20:05:36

标签: javascript facebook facebook-fql facebook-recommendations

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

我发现大多数FB插件似乎都有这个问题。是否由于他们创建的iFrame,插件似乎创建了大量数据。

制作自己的JS版本会更好吗?

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

根据下面的评论,我想我已经准确地解释了我在做什么,我正在使用下面的脚本动态加载插件。目前只显示推荐插件,但最终将包含所有提到的内容。

HOWEVER ...即使将插件直接插入页面,我也注意到了这个问题。

$(document).ready(function(){          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元素不是出于相关目的所必需的,但我还有一个事件部分,显示我的FB事件和FB登录,因为我需要appId进行验证。

(只是试图解释一下,虽然它只是显示推荐的笨重,但它还打算做更多!)

1 个答案:

答案 0 :(得分:0)

请不要将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的问题。请参阅:Adding a Google +1 Button after page load in IE 8