Facebook iFrame hidden um Performance zu sparen?

[mQN]

Hallo Leute :)

ich baue grade meinen eigenen Blog und will auf der Startseite, auf der alle meine Artikel liegen, für jeden Artikel einen Facebook-Likebutton anzeigen. Bis jetzt funktioniert das prima, jedoch tritt folgendes Problem auf: Die Ladezeit nimmt enorm zu und die Seite ruckelt beim Aufbau und Infinitie-Scrollen sehr stark. Nun habe ich mir überlegt einen Button mit 'share' zu erstellen der erst beim klick den Facebook button des jeweiligen Artikels hervorrufen soll. Würde dass das Problem lösen? Also einen DIV zu Anfang hidden einzustellen und erst bei klick sichtbar zu machen? Wann wird ein iFrame, Facebook, GooglePlus,Twitter geladen?

Grüße,
Nick

 

[threadi]

Soweit ich mich entsinne wird der Inhalt eines iframes nach dem Inhalt der Seite die das iframe enthält geladen. Du könntest das auch umgehen indem Du solche Inhalte per AJAX nachlädst, aber eben auch erst wenn die Seite fertig geladen ist. Dennoch sollte es die Gesamtladezeit etwas verringern.

 

[mQN]

Hast recht, auch wenn die Buttons alle auf display hidden oder none stehen werden sie mitgeladen...
Ich habe mit AJAX noch nie was gemacht :/... Benutzte bis jetzt nur jQuery.
Könnte ich das mit jQuery.append() machen? Also beim klick auslesen auf welchen Artikel geklickt wurde, dann bei der Überschrift den Permalink holen, diesen bei der Facebook iFrame vorlage einfügen und mit jQuery.append() zum richtigen DIV hinzufügen?
Wird das iFrame dann geladen?

 

[threadi]

Ja, das sollte auch klappen.

 

[mQN]

das scheint irgendwie nicht zu funktionieren. Es wird zwar alles im Quelltext angezeigt jedoch wird der Inhalt des iFrame glaube ich nicht geladen :/...

var artikel = $(this).parents('.article').attr('id');
var permalink = $('#'+artikel+' .post-title a').attr('href');
$('#'+artikel+' .footer_facebook').append('<div data-href="'+permalink+'" id="fblike" class="fb-like" data-send="false" data-layout="button_count" data-width="24" data-show-faces="false" data-action="like"></div>');

Update:
Ok gelöst muss dann nochmal FB.XFBML.parse(); ausführen... -> Load time 1.11s