Laden Sie gerenderte Inhalte, Jquery Templates oder Bigpipe? Erstellen einer komplexen Website

Question

Ich weiß, diese Frage wurde gestellt, wie man eine Website wie Facebook/Google Mail als in den Inhalt laden.

Aber Antworten sind dünn auf dem Boden. Um zu helfen, habe ich etwas recherchiert. Hat sich jemand damit beschäftigt und kann eine Anleitung geben?

Ich habe 3 verschiedene Routen ich gehen könnte:

1) jquery.load (Last in html), Last in CSS und JS getScript.

Was ich noch nicht verstehe, und ich muss herausfinden, wie man verfolgt, was CSS/JS dynamisch geladen wurde. IOW Ich möchte nicht in der gleichen CSS/JS laden, wenn a Der Benutzer besucht eine Seite, die er bereits zwischengespeichert hat.

Wäre es klug, globale JS-Variablen oder versteckte divs zu verwenden?

2) Bigpipe.

Ich habe Implementierungen von diesem für .net gesehen. Aber kennt jemand eine PHP-Implementierung? Ich sehe das auf GitHub: https://github.com/dynamoid/bigpipe Aber ich war nicht sehr beeindruckt. Irgendwelche anderen Implementierungen?

3) JQuery Vorlagen

Ich habe mit dieser ein wenig Forschung zu tun. Wäre das der beste Weg zu gehen? Selbst wenn ich die Vorlage zuerst laden (und zwischengespeichert) und dann die Daten erhalten kann. Ich bin immer noch fuzzy beim Verfolgen, wie CSS und JS pro Seite geladen wird.

Wenn Sie schließlich über Ressourcen, die über die Auswahl der besten Praktiken sprechen, Bescheid wissen, lassen Sie es mich wissen.

Thanks :)

Answer 1

Ich dachte, ich würde zurückkommen und diese Frage zu beantworten.

Nachdem ich auf diesen Blog stieß: http://jmperezperez.com/ Ich kam mit meiner eigenen Lösung.

1) Ich habe ein Drahtgitter der Kopfzeile, Inhalt und Fußzeile erstellt. Die Kopf- und Inhaltsbereiche erhielten später IDs, um Inhalt in sie zu laden.

2) Mithilfe der Jquery-Adresse konnte ich die Adressleiste aktualisieren, wenn ich auf der Website ohne Seitenaktualisierungen navigiere.

3) Auf dem Backend, assembliere ich dann json, um den Inhalt zurückzuzahlen, der mehrere divs sein kann und dann die JS und CSS lädt.

4) Ich habe dann ein Skript erstellt, um CSS und JS dynamisch zu laden und zu verfolgen, was bereits geladen wurde. CSS und JS können nicht zweimal geladen werden, wenn eine Seite mehrmals angefordert wird.

Vielleicht später, werde ich überprüfen, wie die Dinge zu tun, viel besser: http://jmperezperez.com/talk-facebook-frontend-javascript/

Jetzt meiner Seite funktioniert genau wie facebook/gmail. Keine Seite wird aktualisiert, außer dem An- und Abmelden.

Wenn jemand Github Repos kennt, die sich mit Single-Page-Anwendungen mit jQuery beschäftigen. Gib mir Bescheid.

Dank

Answer 2

Ich würde eine bigpipe Implementierung mit eher empfehlen, als das, was Ihr wie die garo Version https://github.com/garo/bigpipe zu tun, die in PHP und Prototype geschrieben.

Das Problem, das Sie mit Ihrer Website haben, ist, dass es eine Javascript-basierte Website ist, die Bots wie Google und dergleichen nicht in der Lage, den Inhalt Ihrer Website ordnungsgemäß zu indizieren, weil der Inhalt auf anderen Teilen Ihrer Website existiert während BigPipe erkennt und umgeht, wenn ein Bot auf Ihre Seite schaut und normal rendert.

Ich habe Bigpipe auf einer Wordpress-Installation getestet und kann sagen, dass die Ladezeit um 3000% verbessert wurde, was auf Engpässe beim Laden externer Daten wie Bilder, JS- und CSS-Dateien beim Laden der Seite zurückzuführen ist. Ich habe dies mit einem Plugin namens PHP Speedy verbunden, das ich geändert habe, um alle nutzlosen Leerzeichen zu bereinigen und css und javascript und alles andere in eine Codezeile zu komprimieren und Ihnen sagen zu können, dass es sich lohnt, auf Ihrer Site zu implementieren, anstatt sich auf AJAX-Methoden zu verlassen. Wenn Sie JQuery verwenden, müssen Sie möglicherweise die Funktion noConflict verwenden, um die beiden unterschiedlichen JS-Bibliotheken vor Konflikten zu schützen.

Sie können es von hier greifen: https://github.com/garo/bigpipe

Wenn Sie es verwenden, Sie sehen, dass es besser als das, was Sie tun!