Was ich gerne wissen würde ist, wie haben Sie Ihre Webanwendung erstellt? Ich bin wirklich verwirrt, welche Methode ich für mein Projekt verwenden sollte.
Schon entschieden, welche Technologien zu wählen sind.
1) Node.js und Express als sein Framework
2) MongoDB
3) Reaktion + Fluss
Aber das Problem im Moment, sollte ich Methode (A) oder Methode (B)
verwendenMethode (A) - Serverseitiges Rendering für HTML
%Vor%Methode (B) - Clientseitige Darstellung für HTML
%Vor%Methode A wird den HTML-Code vom Server und den Daten rendern.
Methode B wird nur die Daten antworten, die für den Client benötigt werden, der React.js ist, damit es die Daten manipulieren kann.
Mein Anliegen ist, welche Methode soll ich verwenden? die meisten Startups verwenden welche Methode?
Danke.
Es ist kein Entweder-oder-Vorschlag.
Reagieren ist ein clientseitiges Framework. Sie müssen auf der Clientseite rendern. Die Frage ist, ob auf der Serverseite zusätzlich zum Rendering auf der Client-Seite gerendert werden soll.
Die Antwort? Wenn du kannst, JA!
Sie erhalten SEO-Vorteile und eine anfängliche Leistungssteigerung durch Rendering auf der Serverseite. Aber Sie müssen immer noch dasselbe clientseitige Rendering durchführen.
Ich Vorschlag googeln "isomorph reagieren" und etwas lesen. Hier ist ein Artikel zum Thema. Ссылка
Nun, es hängt wirklich davon ab, welche Vision du im modernen Web hast und was du bereit bist zu tun.
Ziehen Sie es vor, Ihre Benutzer warten zu lassen, indem Sie einen Loader anzeigen, während Daten asynchron geladen werden, oder möchten Sie Ihre Benutzer so lange wie möglich belästigen?
Hier sind verschiedene Artikel, die Ihnen helfen werden, Ihre Gedanken zu klären und sich der verschiedenen Vorteile bewusst zu sein, die Sie durch serverseitiges Rendering, clientseitiges Rendering mit mehreren Problemen, haben können.
Sie können diesen Beitrag im Twitter-Blog sehen, indem Sie sagen, dass sie ihre anfängliche Seitenbelastung um 1/5 gegenüber der vorherigen verbessern, indem Sie das Rendering auf den Server verschieben:
Ein anderer Artikel, dieses Mal von airbnb, beschreibt die Probleme, die Sie mit dem clientseitigen Rendering selbst haben können:
Es gibt auch einen anderen interessanten Artikel, der über clientseitiges / serverseitiges Rendering spricht und eine Debatte darüber bringt, wann wir serverseitiges oder clientseitiges Rendering verwenden / nicht verwenden sollten und warum:
Und zum Schluss kann ich Ihnen zwei weitere Links geben, die sich mehr auf das Reagieren konzentrieren und beschreiben, auf welche Weise das serverseitige Rendering für Ihren Fall hilfreich sein könnte:
Nun, was Sie tun sollten, es ist eine Frage dessen, was Sie genau tun müssen, meiner Meinung nach, aber im Grunde können Sie beides gleichzeitig tun (Client-Seite UND Server-Seite), um die zu haben beste Benutzererfahrung.
Dieses Konzept wird "isomorphes JavaScript" genannt und wird heutzutage immer beliebter.
Die einfachste Architektur besteht darin, einfach dynamisches HTML-Rendering auf dem Server auszuführen, ohne Ajax und mit einer neuen HTML-Seite, die für so ziemlich jeden Client-Klick angefordert wird. Dies ist der "traditionelle" Ansatz und hat Vor- und Nachteile.
Die nächste einfachste Methode besteht darin, dem Client vollständig statische html + js + css (Ihre React-App) bereitzustellen und XMLHttpRequest-Aufrufe an webservices vorzunehmen, um die erforderlichen Daten (d. h. Ihre Methode B) abzurufen.
Der komplexeste, aber ideale Ansatz (aus Performance- und SEO-Sicht) besteht darin, eine "isomorphe" App zu erstellen, die beide Ansätze unterstützt. Die Idee ist, dass der Server alle notwendigen WS-Aufrufe durchführt, die der Client machen würde, und die erste Seite, die der Benutzer besucht hat (was ein tiefverlinkter Teil der Anwendung sein könnte), ein bisschen wie Option A, aber mit Reagieren auf Führen Sie das Rendering durch, und übergibt dann die Kontrolle an den Client für zukünftige DOM-Updates. Dies ermöglicht dann schnelle inkrementelle Aktualisierungen der Seite über Web-Service-Aufrufe, wenn der Benutzer interagiert (z. B. genau wie B). Die Navigation zwischen verschiedenen "Seiten" an dieser Stelle beinhaltet die Verwendung der Verlaufs-API, damit Sie so aussehen, als würden Sie die Seite wechseln, wenn Sie gerade die aktuelle Seite mithilfe von Web-Services manipulieren. Aber Sie haben dann eine Browseraktualisierung durchgeführt, Ihr Server würde den vollen HTML-Code der aktuellen Seite zurücksenden, bevor Sie die Kontrolle an die clientseitige React-Funktion übergeben. Es gibt viele React + Flux + Node-Beispiele dieses Ansatzes, die online verfügbar sind und die verschiedenen Flavour-Varianten verwenden, die das serverseitige Rendering unterstützen.
Ob sich dieser Ansatz lohnt, hängt von Ihrer Situation ab. Es ist wahrscheinlich sinnvoll, Ansatz B zu verwenden (Sie können Ihre HTTP-API zwischen mobilen Apps und Websites freigeben), verwenden Sie jedoch eine Flux-Architektur, die serverseitiges Rendern unterstützt und dies berücksichtigt. Auf diese Weise haben Sie die Möglichkeit, die Leistung der anfänglichen Seitenladevorgänge zu verbessern.