Wie erfolgreich XHP und ReactJS Implementierung einer Komponente zu mischen

Angenommen, wir haben die folgende Situation: Wir haben einen Blog mit einem Posts-Feed. Wenn die Seite geladen wird, sollte bereits 3 <PostCard> s geladen sein, erstellt auf der Serverseite; Der Benutzer scrollt nach unten oder drückt eine Load more Schaltfläche und einige neue Postkarten sollten dynamisch zur Seite hinzugefügt werden.Wie erfolgreich XHP und ReactJS Implementierung einer Komponente zu mischen

Ich habe Hack XHP Komponente <PostCard> und wir haben die ReactJS Komponente <PostCard>.

So sollte ich:

Implementieren Sie die ganze Sache auf der Client-Seite, in Reagieren und haben die render() Methode des XHP Komponente nur constructReactInstance()? (Ich habe irgendwann so etwas gemacht, aber ich habe bemerkt, dass es beim Laden der Seite einige Verzögerungen gibt, so etwas wie eine "Verzögerung").
Implementieren Sie die Komponente zweimal, sowohl auf Server- als auch auf Clientseite? (Das ist ein totaler Schmerz ...)
Etwas anderes ...?

Ich hoffe, dass ich mich klar und jemand wird mir helfen können: smile_cat:

Quelle

2016-05-06 Victor

Wie Sie damit umgehen ist eine ausgezeichnete Frage, und ich wünschte, ich wüsste genug für eine gute Antwort für Sie. Ich werde versuchen, einige meiner FB-Kollegen dazu zu bringen, etwas zu schreiben. Mein Verständnis ist, dass wir bei FB meistens (1) für nicht-triviale Komponenten tun, aber einige unserer einfacheren Sachen, die wir tun (2), da wir noch ein bisschen voll-server-gerenderten Kram machen und Basiskomponenten in beiden Sprachen benötigen. –

@JoshWatzman, ich freue mich auf die Antwort, über die Sie gesprochen haben. Vielen Dank für die Idee. Ich habe versucht (1) was XHPJS betrifft und ich fand heraus, dass das Repo für XHPJS veraltet und nicht gepflegt ist. Ich und viele andere Leute würden sicher einige Aktualisierungen davon schätzen! – Victor

Es gibt keine Open-Source-Lösung meines Wissens, die auf einem Server HHVM Reagieren macht, so dass Sie gehen irgendwo einen Trade machen müssen. Die Art, wie Sie XHP aufrufen RenderReactInstance ist eine gültige Lösung für die Integration von XHP und Reagieren, aber Sie werden diese wahrgenommene "Verzögerung" leiden, wie die Seite lädt und dann analysiert und führt die JS. Caching kann helfen, aber es muss immer noch den JS analysieren und ausführen. Alternativ können Sie auch nur eine XHP-Komponente verwenden und die React-Komponenten für die kleineren Details speichern. Insbesondere möchten Sie möglicherweise nur, dass der Kommentarabschnitt Reagieren ist, wenn dies die vorherrschende interaktive Komponente ist, und etwas, das in Ordnung ist, etwas später als alles andere zu laden. Dadurch könnte der Blog den Inhalt beim Laden der Seite posten, aber Sie müssen möglicherweise andere Nicht-React-JS schreiben, um das asynchrone Laden neuer Komponenten zu verarbeiten. Es ist alles eine Abwägung und ich denke, Sie müssen nur bestimmen, was Sie für wichtiger halten.

Quelle

2016-05-09 21:05:19

Es gibt eine Menge Unterstützung für serverseitige Reaktion Rendern http://facebook.github.io/react/docs/environments.html – Hamms

Lassen Sie mich neu formulieren, gibt es keine Open Source _Hack_ Lösung zum Rendern React Rendering auf dem Server. Wird die Antwort aktualisieren. –

[php-v8js] (http://php.net/manual/en/book.v8js.php) Einen nodejs-Daemon laufen zu lassen wäre wahrscheinlich ziemlich einfach – Hamms

Natürlich gibt es eine Umgebung für XHP und React JS. Sie können finden, was Sie hier brauchen: https://github.com/hhvm/xhp-js

Sie können sehr kraftvolle Sache mit all dem zusammen tun. Eine Anpassungszeit ist erforderlich, aber es gibt ein tolles Tutorial, dass einige Facebook-Typ tut, und es ist gut expli: https://github.com/hhvm/xhp-js-example

Quelle

2016-11-15 11:52:07 bbichero

Wie erfolgreich XHP und ReactJS Implementierung einer Komponente zu mischen

Antwort

Verwandte Themen