Javascript Framework für Pushstate "Hijax"

Question

Alle unsere Apps sind PHP-Mvc und mit einem sehr einfachen Js Verhaltensebene auf der Client-Seite an der Spitze. Wir wollen das Javascript mehr strukturieren und aufhören, "Schnipsel" anzufordern, um einfaches Verhalten auszuführen (wie das Laden verschiedener jQuery-Plugins überall). Wir verwenden keine JavaScript-MVC-Frameworks und suchen nach einer optimalen Lösung für unsere neuen Apps.

Eine der attraktivsten Lösungen ist es, die Server-Seite für uns zu behalten, wie Twitter does. Sie nennen es "Hijax + serverseitiges Rendering". Wir bevorzugen keine Blas- MVC-Framework in Javascript haben, aber diese Zitate aus dem Blog zu uns sehr ansprechend sind:

Mit Vertrag, unsere Komponenten heften sich an einem einzelnen DOM-Knoten, hören über Delegation, Feuer, an Veranstaltungen Ereignisse im DOM, und diese Ereignisse werden über DOM-Event-Bubbling an andere Komponenten gesendet. [...] Zweitens werden alle unsere Komponenten mit AMD definiert.

Wir haben versucht, etwas eigenes zu bauen, aber ohne Javascript-Erfahrung auf hohem Niveau können wir nicht weit kommen. So etwas wie jquery-pjax scheint auch für sehr einfache Fälle eine gute Lösung zu sein.

Wir suchen:

1. A UI/Datentrennung zu loosly Paar XHR mit dem DOM
2. Event Driven UI, so Devs Zuhörer auf alle Arten von DOM anhängen können Objekte

Gibt es so etwas wie ein JavaScript-Framework? Mit pushState bekommen immer mehr Aufmerksamkeit, ich hoffe, dass etwas verfügbar sein wird. Irgendwelche Ideen?

Answer 1

Sie möchten History.js und Amplifyjs zur Kasse (und möglicherweise microjs für einige Komponenten zusammen stellen)

Answer 2

Ich werde versuchen, Ihre Frage zu den besten meiner Fähigkeit zu beantworten. Mit diesem gesagt werde ich sagen, dass Ihre Frage sehr breit und ziemlich mehrdeutig ist. Sie haben nicht erfolgreich kommuniziert, was genau Sie in einer JavaScript-Bibliothek suchen. Sie haben viele verschiedene Themen erwähnt, die alle kompliziert sind und von denen jeder einen bestimmten Zweck in der clientseitigen Entwicklung erfüllt. Während all diese Konzepte in der Wildnis implementiert werden können, gibt es keine eindeutige Antwort, um all Ihre Probleme zu lösen.

Ich werde mit Ihrem ersten Punkt "UI/Datentrennung" beginnen. Bei diesem Konzept geht es eigentlich um die Trennung von Belangen. Sie möchten, dass Ihre Benutzeroberfläche getrennt von Ihren Daten existiert. Was Sie wirklich suchen, ist, dass Ihr HTML den aktuellen Zustand Ihres Datenmodells widerspiegelt. Sie möchten, dass dies automatisch für Sie geschieht. Dies ist ein sehr häufiger Arbeitsablauf mit einem MVC-Entwurfsmuster. JavaScript hat mehrere Optionen für Sie da: Backbone.js, AngularJS, EmberJS, und die Liste geht weiter ...

In meiner persönlichen Erfahrung mit ganz wenigen dieser unterschiedlichen Rahmenbedingungen, würde ich Backbone.js vorschlagen, es ist flexibel und leicht Natur . In Backbone haben wir das Konzept einer "Ansicht", dass direkt an ein Datenmodell gebunden werden kann. Es unterstützt auch Ihr gewünschtes Konzept von "pushSate" durch seinen Routes-Mechanismus.

Der Abschnitt "Event Driven UI" kann von einer beliebigen Anzahl verschiedener JavaScript-Bibliotheken verarbeitet werden. jQuery ist wahrscheinlich die beliebteste Bibliothek, um Ereignisse an "alle Arten von dom-Elementen" anzuhängen. Backbone.js ermöglicht auch die einfache Einrichtung der Ereignisdelegierung (durch Event-Bubbling) mit seinem View-Objekt.

Kurz gesagt, wenn Sie suchen, um Struktur zu Ihrem JavaScript ... es kommt wirklich genau was Sie wollen. Für nur einfache Dinge, wird ein bisschen Handarbeit jQuery tun. Wenn Sie wirklich eine App im MVC-Stil wollen, die das Potenzial hat zu wachsen, dann sind MVC-Frameworks wie Backbone der richtige Weg.