Welche Vorteile bietet die serverseitige Darstellung von Seiten?

19

Ich entwickle eine Web-App und habe derzeit die gesamte Website in html / js / css geschrieben und im Backend habe ich Servlets, die einige RESTFUL-Dienste hosten. Die gesamte Präsentationslogik wird ausgeführt, indem JSON-Objekte abgerufen und die Ansicht mit Javascript geändert werden.

Die Anwendung ist im Wesentlichen eine Suchmaschine, verfügt jedoch über Benutzerkonten mit unterschiedlichen Rollen.

Ich habe einige Frameworks wie Play und Spring recherchiert. Ich bin ziemlich neu in der Webentwicklung, also habe ich mich gefragt, welche Vorteile die Verwendung des serverseitigen Seiten-Renderings bieten würde.

Ist es: Geschwindigkeit? Einfachere Entwicklung und Workflow? Zugriff auf bestehende Bibliotheken? Mehr? Alles das oben Genannte?

javascript web-applications frameworks user1303881
quelle
4
Sicherheit ist groß. Insbesondere, wenn die Anwendung dynamisch ist und mit einer Datenbank kommunizieren muss.
Oded
2
@Oded - Warum ist Sicherheit einfacher, wenn Sie die Seite im Vergleich zur API rendern? Ich habe immer gedacht, dass das, was Sie programmieren müssen, in beiden Fällen gleichwertig ist, aber es ist (zumindest für mich) psychologisch einfacher, daran zu denken, dem Client beim Ausführen einer API nicht zu vertrauen. Ich frage, weil ich etwas übersehen möchte, das ich wirklich wissen möchte.
PSR
1
@psr Er bezieht sich möglicherweise weniger auf die Datensicherheit als vielmehr auf die Benutzersicherheit (z. B. MITM-Exploits). Nur eine Vermutung.
maple_shaft
1
@psr - Einverstanden. Allerdings habe ich erst gestern eine Frage beantwortet, in der das OP die Verbindungszeichenfolge in JS eingebettet hatte ...
Oded,
1
@maple_shaft - MITM ist etwas, über das man nachdenken muss, aber ich bin mir auch nicht sicher, warum es einen Unterschied zwischen API und servergeneriertem HTML macht. Ich nehme an, eine API ist bequemer zu programmieren, daher wäre es ein etwas einfacherer Riss, aber ich bezweifle, dass Sie das meinen.
PSR

Antworten:

16

Serverseitiges HTML-Rendering:

  • Schnellstes Browser-Rendering
  • Page-Caching ist möglich, um die Leistung zu verbessern
  • Für "Standard" -Apps sind viele Funktionen der Benutzeroberfläche vorgefertigt
  • Wird manchmal als stabiler angesehen, da Komponenten normalerweise zur Kompilierungszeit validiert werden müssen
  • Stützt sich auf Backend-Fachwissen
  • Manchmal schneller zu entwickeln

* Wenn die UI-Anforderungen gut zum Framework passen.

Clientseitiges HTML-Rendering:

  • Geringere Bandbreitennutzung
  • Langsameres Rendern der ersten Seite. Kann in modernen Desktop-Browsern nicht einmal auffallen. Wenn Sie IE6-7 oder viele mobile Browser unterstützen müssen (mobiles Webkit ist nicht schlecht), können Engpässe auftreten.
  • API-first erstellen bedeutet, dass der Client genauso einfach eine proprietäre App, ein Thin Client, ein anderer Webdienst usw. sein kann.
  • Verlässt sich auf die Erfahrung von JS
  • Manchmal schneller zu entwickeln **

** Wenn die Benutzeroberfläche weitgehend benutzerdefiniert ist, mit interessanteren Interaktionen. Außerdem finde ich die Codierung im Browser mit interpretiertem Code merklich schneller als das Warten auf Kompilierungen und Serverneustarts.

Sie können auch ein Hybridmodell mit einer leichten Back-End-Implementierung in Betracht ziehen, das ein Front-End- / Back-End-Template-System wie Moustache verwendet .

peteorpeter
quelle
1
Whoah, ich habe die Caching-Möglichkeiten komplett vergessen!
Michael K
"Für" Standard "-Apps sind viele UI-Funktionen vorgefertigt" Das ist irrelevant, sowohl Server als auch Client haben das.
Raynos
@Raynos Er hatte die Verwendung eines clientseitigen Frameworks nicht erwähnt , aber wenn er eines verwendet, ist das ein guter Punkt.
Peteorpeter
1
Danke, das ist meistens die Antwort, nach der ich gesucht habe. Ich habe nicht zu viel mit clientseitigen Frameworks gemacht, aber ich habe ein paar Nachforschungen über dust.js angestellt, basierend auf der Wahl von LinkedIn. Ich weiß, dass Schnurrbart eine Alternative ist, aber ich werde es weiter erforschen. Ich werde wahrscheinlich eine Art Hybrid machen, in erster Linie möchte ich Dinge auf den Server verlagern, wenn dies die Leistung verbessern kann. Danke noch einmal.
user1303881
Ich würde nichts für "Client-seitiges HTML-Rendering" als Vorteil ansehen. "Manchmal schneller zu entwickeln" fliegt noch einmal aus dem Fenster, als hochaktuelle Browser in Betracht gezogen werden (IE 8 usw.).
null
3

serverseitige HTML-Generierung:

  • einfacher zu debuggen;
  • keine Probleme mit der Browserkompatibilität;
  • Mit der klassischen Ganzseiten-Server-Generierung ist es schwieriger, HTML zu cachen, selbst wenn es große unveränderliche Teile enthält. (Lösung besteht darin, HTML-Fragmente über AJAX-Aufrufe abzurufen);
  • Caching-Proxies und CDNs für dynamisches HTML nicht nutzen;

clientseitige HTML-Generierung:

  • schwerer zu debuggen;
  • Einige Probleme mit veralteten Browsern;
  • Keine Probleme, HTML-Templates clientseitig zwischenzuspeichern.
  • Nutzung von Caching-Proxies und CDNs für HTML-Templates und JS-Code;
  • viel geringere Netzwerkauslastung;

Beachten Sie, dass die clientseitige Generierung bei erfolgreichen mobilen Websites so erfolgt, wie sie bei modernen Browsern anscheinend effizienter ist (WebKit-basierte Browser machen etwa 70-80% des mobilen Marktes aus).

LinkedIn hat einen Artikel über die Vorteile des clientseitigen Ansatzes unter Verwendung von dust.js als Beispiel: "JSPs im Staub lassen: LinkedIn auf clientseitige Vorlagen von dust.js verschieben"

vartec
quelle
1
+1 Auf modernen Smartphones (die hauptsächlich Webkit-Mobilgeräte verwenden) ist es unwahrscheinlich, dass JS einen Engpass darstellt, während dies bei der Bandbreite des Mobilfunknetzes der Fall ist .
Peteorpeter
1

Das hängt von Ihren Anforderungen ab. Wenn Sie eine leistungsstarke Lösung mit geringer Latenz benötigen, die von vielen kleinen Aufgaben abhängt, verwenden Sie möglicherweise eine Struktur, die Ihrer Beschreibung ähnelt. Die gängigsten Lösungen in Java, PHP und C # verwenden dies jedoch nicht standardmäßig.

Die meisten Webanwendungen hängen sehr stark von Datenbanken ab - die meisten davon sind so stark, dass Seiten nicht ohne mindestens einen Aufruf gerendert werden können. Offensichtlich möchten Sie Ihre Datenbank aus mehreren Gründen nicht öffentlich zugänglich machen:

  • Sicherheit (wie Oded erwähnt) - Sie möchten Ihr Netzwerk definitiv nicht öffentlich zugänglich machen! Idealerweise sollte die einzige Schnittstelle zu Ihren Systemen von außen https zu Ihrem Server sein.
  • Einfache Entwicklung - Sie wirklich, möchten SQL wirklich , wirklich nicht in Javascript schreiben, und die für die Webpräsentation entwickelten Sprachen funktionieren nicht gut mit RDBs. Sie haben zum Beispiel keinen Staatsbegriff.

Wenn Sie also eine Datenbank benötigen, verwenden Sie Sprachen wie Java, C #, PHP usw., die sich gut damit spielen lassen. Der einfachste Weg, eine Seite zu generieren, stellt sich wie folgt heraus: JSP und ASP sind jedoch zwei weitere sehr gebräuchliche Sprachen, um die Seite zu erstellen. Die Sprache bietet Konstrukte, die andere Module ansprechen. In PHP befindet sich dies normalerweise auf der Seite oder in einer anderen PHP-Datei, wobei das MVC-Muster verwendet wird. In JSP verwenden Sie Scriptlets oder die JSP-Ausdruckssprache. Mit diesen anderen Modulen können Sie eine Verbindung zur Datenbank herstellen, Logik ausführen und Werte an die Ansichtsebene zurückgeben. Das Endergebnis ist eine generierte HTML-Seite, die auf dem Server gerendert und an den Client gesendet wird.

Befindet sich Ihre Datenbank im selben Netzwerk wie Ihr Seitenrenderer, erhalten Sie auch eine bessere Leistung. Der Client muss nur eine Anforderung ausführen und erhält eine Seite. Möglicherweise müssen Sie 10 bis 15 DB-Anforderungen ausführen, bevor Sie alle Informationen haben, die der Benutzer benötigt. Eine Latenz von Millisekunden in Ihrem Netzwerk würde Sekunden bis Minuten betragen, wenn der Client sie alle ausführen müsste.

Wenn Systeme größer werden, wird die Trennung von Anliegen und Kernkompetenzen entscheidend. HTML ist gut für die Anzeige. Javascript ist gut für dynamische Inhalte. SQL eignet sich hervorragend zum Abfragen einer Datenbank, und andere Sprachen beherrschen die Geschäftslogik. Unsere Aufgabe als Entwickler ist es, alle uns zur Verfügung stehenden Tools zu nutzen, um ein wartbares System aufzubauen. Einfache Entwicklung ist ein großer Teil eines guten Systems. In meinen Augen ist es fast so wichtig wie Leistung und Benutzerfreundlichkeit. Große Systeme entwickeln sich im Laufe der Zeit. Schlechte Systeme wurden von Anfang an schlecht geschrieben und nie verbessert.

Michael K
quelle
you can't write SQL in Javascript Ja wirklich?! Haben Sie jemals sah bei Stackoverflow Fragen für Javascript? Da würde ich leider anders betteln. Zugegeben, es ist das Schlimmste, was Sie im Client-Code tun können, aber ...
maple_shaft
... auch ich habe Node.JS vergessen, aber das ist dann Server JS, der ein ganz anderes Tier ist.
maple_shaft
Anscheinend kannst du - BIS! Aber ... wow. Sprechen Sie jedoch über den Missbrauch der Sprache!
Michael K
2
Über die REST-Schnittstelle greift der Client derzeit über JSON-Objekte auf Datenbankdaten zu. Es macht nicht alles verfügbar und diese Anwendung ist Teil eines privaten Unternehmensnetzwerks. Ein Vorteil der Schnittstellen besteht darin, dass andere Anwendungen im Unternehmen jeden gewünschten Service nutzen können. Aus Sicht der Entwicklung kann ich Front-End-Entwickler in html / js / css tun lassen, was sie wollen, und dann können sie einfach die von den Java-Entwicklern entworfene RESTful-Schnittstelle abpingen. Die meisten von uns verfügen jedoch über gemischte Fähigkeiten, und diese Aufteilung ist möglicherweise nicht erforderlich.
user1303881
3
-1: @MichaelK: Sie diskutieren mit einem Strohmann, den Sie sich vorgestellt haben, der aber absolut nichts mit dem wirklichen Leben zu tun hat. RESTful verwendet HTTP. Niemand muss SQL in JS schreiben, dafür ist die RESTful-Schnittstelle gedacht. Auch RESTful bedeutet nicht, dass es eine 1-zu-1-Zuordnung mit DB-Abfragen gibt. Ihre Antwort war möglicherweise in den 1990er Jahren gültig, aber wir sind jetzt in 2012.
Vartec
0

Mobile Clients sind normalerweise auf Leistung, Bandbreite und Speicher beschränkt. Es ist wahrscheinlich besser, Seiten für sie auf dem Server zu rendern.

Für Desktop-Clients können Sie js + json senden, um die Seite auf dem Client zu rendern, dynamisch zu aktualisieren usw.

9000
quelle
In der Praxis ist jedoch oft das genaue Gegenteil der Fall. Tatsächlich basiert das jQuery Mobile-Projekt vollständig auf der Idee des clientseitigen Renderns.
Pointy
@Pointy: ja, das kann auch umgekehrt sein. Man sollte testen, wie sich bestimmte Seiten auf bestimmten Clients verhalten. Das Bereitstellen eines Links zu einer alternativen Version (z. B. Links für Mobilgeräte und Desktops) kann auch für den Benutzer hilfreich sein.
9000,
Mobilgeräte zeichnen sich heute weitaus mehr durch eine hohe Latenz als durch eine geringe Bandbreite oder Rechenleistung aus. In dem Projekt, an dem ich kürzlich gearbeitet habe, ging es uns mehr um die Seitengröße als um die Rendergeschwindigkeit - moderne Telefone sind ziemlich gut.
Michael K
@Pointy das jQuery Mobile-Projekt ist auch ein großer Haufen von schrecklichem Code, der nicht verwendet werden sollte. Popularity! == value
Raynos
@Raynos Wir verwenden Jquery Mobile, auch mit ziemlich gutem Erfolg. Wissen Sie etwas, was wir nicht wissen? ;)
Michael K
0

Ein großer Vorteil des serverseitigen Renderns ist die Barrierefreiheit - Javascript-basierte Apps sind immer noch ein großes Problem für Leute ohne Sehvermögen. Das und da gibt es diesen blinden Kerl namens "googlebot", für den Sie sich vielleicht interessieren. Er kann auch nicht so gut Javascript.

Wyatt Barnett
quelle
Ein guter Punkt, obwohl diese Anwendung kein SEO erfordert, weil sie privat ist, entwickle ich auch einige persönliche Apps und das ist eine Überlegung in diesem Bereich.
user1303881
Der Googlebot interpretiert JS / AJAX schon seit einiger Zeit: searchenginewatch.com/article/2122137/…
vartec
@vartec: Ich denke, der Schlüssel in diesem Artikel lautet: "Kann jetzt bestimmte dynamische Kommentare lesen und verstehen, die mit AJAX und JavaScript implementiert wurden." Mein Verdacht ist, dass es sich um Disqus und Facebook handelt, aber nicht um Ihr benutzerdefiniertes Ajax-Setup.
Wyatt Barnett