Leistungsmaßstab: PHP-generierte Inhalte vs. Javascript und DOM über AJAX

Question

Für die folgende recht einfache Aufgabe: eine Liste von Produkten aus einer DB abfragen und auf einer Webseite präsentieren, Erwägen Sie 2 Aufstellungen:

Einrichtung1 : PHP-Skript-Abfragen. Der gesamte Inhalt wird auf dem Server erstellt und die gesamte Seite wird an den Kunden zurückgegeben.

Einrichtung2 : Statisches HTML-"Seitengerüst", das Inhalte über AJAX anfordert. Der empfangene Inhalt wird auf der Client-Seite mit Javascript geparst und mit innerHTML oder ähnlichem gerendert.

Die zweite Variante ist natürlich nur dann sinnvoll, wenn Sie Seiten, Kategorien und Tags zur Verfügung haben, aus denen der Kunde wählen kann.

Ich muss vergleichen diese beiden, zumindest mit Hilfe von:

• Zeit, die benötigt wird, um den Inhalt zu servieren
• Benutzererfahrung (Setup1 wird als Ganzes geliefert, Setup2 wird in "zwei Teilen" geliefert)
• Skalierbarkeit - wie verhalten sich die Systeme im Vergleich, wenn ich täglich 100.000 Abfragen habe?

Für jeden Gedanken zu diesem Thema wären wir sehr dankbar.

Answer 1

Die folgende Frage könnte für Sie hilfreich sein: Smarty vs. Javascript/AJAX

In meiner Antwort auf diese Frage habe ich einige Punkte angesprochen:

• Sie sollten serverseitige Skripte verwenden, um alle Daten anzuzeigen, die zum Zeitpunkt des Ladens der Seite bekannt sind . In diesem Fall wissen Sie, dass die Liste der Produkte angezeigt werden soll. Die Tatsache, dass die Antworten auf eine Frage angezeigt werden sollen, ist beim Laden der Seite bekannt.

• Sie sollten AJAX-Aufrufe nur verwenden, um dynamische Daten zu laden, die no zum Zeitpunkt des Ladens der Seite bekannt . Zum Beispiel, wenn Sie auf den Link "Kommentare" unter einer Frage oder Antwort auf Stack Overflow klicken. Die Tatsache, dass Sie die Kommentare zu einer bestimmten Frage anzeigen möchten, ist beim Laden der Seite nicht bekannt.

• Javascript sollte no für den Zugriff auf die Kernfunktionen Ihrer Website erforderlich sein .

• Sie sollten die Funktionalität sanft abbauen, wenn Javascript deaktiviert ist. . Stack Overflow zum Beispiel funktioniert auch mit deaktiviertem Javascript einwandfrei. Sie haben zwar keinen Zugang zu Markdown-Vorschauen in Echtzeit oder dynamischen Badge-Hinweisen, aber die Kernfunktionalität bleibt erhalten.

• Eine einzige HTTP-Anfrage an eine vom Server generierte Seite wird deutlich schneller geladen als eine Anfrage zum Laden einer Seite, die fünf oder sechs zusätzliche AJAX-Aufrufe macht , insbesondere bei Verbindungen mit hohen Latenzzeiten (wie Mobilfunknetzen). Siehe Yahoos Bewährte Praktiken für die Beschleunigung Ihrer Website .

Sie sollten Javascript als eine Bonusfunktion betrachten, die möglicherweise nicht aktiviert ist, und nicht als etwas, das für die Erstellung wichtiger Teile Ihrer Website verwendet werden sollte. Es gibt Ausnahmen von dieser Regel. Wenn Sie eine Art Paginierung durchführen möchten, bei der Sie auf eine Schaltfläche "Nächste Seite" klicken und sich nur die Produktliste ändert, könnte AJAX die richtige Wahl sein. Sie sollten jedoch darauf achten, dass Benutzer ohne Javascript nicht von der Anzeige der gesamten Liste ausgeschlossen werden.

Es gibt nichts Frustrierenderes, als wenn auf eine Seite nicht zugegriffen werden kann, weil der Webentwickler sich nicht an die KISS-Prinzip . Ein Beispiel dafür ist Friendly's Restaurants . Ich wollte nachsehen ihr Menü als ich im Einkaufszentrum war, also lud ich ihre Website auf mein iPhone, nur um herauszufinden, dass man ohne Flash buchstäblich keine aussagekräftigen Informationen über das Restaurant erhalten kann. Es ist zwar schön, schicke Speisekarten zu haben, auf denen überall Desserts herumschwirren, aber eigentlich wollte ich nur die Speisen auf der Karte sehen. Das konnte ich nicht, weil sie Flash benötigten. In diesem Fall wäre es hilfreich gewesen, den Service zu entschärfen.

Einige Dinge im Web können ohne Javascript nicht effektiv durchgeführt werden. Die Anzeige einer Liste von Produkten ist no einer von ihnen. Wenn Sie noch unsicher sind, schauen Sie sich an, wie andere beliebte Websites vorgehen. Ich denke, Sie werden feststellen, dass die meisten erfolgreichen, gut durchdachten Websites die oben aufgeführten Richtlinien befolgen.

Answer 2

AJAX ist wahrscheinlich die bessere Wahl, wenn sich nur ein kleiner Teil der Seite ändert.

Ich würde empfehlen, mit der serverseitigen Version zu beginnen und dann AJAX darauf aufzubauen. Auf diese Weise erhalten Sie auch eine Version Ihrer Website, die ohne Javascript funktioniert, was Sie wahrscheinlich sowieso brauchen, wenn Sie in Suchmaschinen indiziert werden wollen.

Konzentrieren Sie sich jedoch zunächst darauf, eine Seite zu erstellen, die einfach funktioniert - Sie können sie später immer noch optimieren.

Answer 3

Die Leistung des Kunden hängt von vielen Faktoren ab. Was läuft gerade, welcher Browser, was ist der Inhalt, was ist das CSS der Seite, wie voll ist der Cache des Browsers, welche Plug-ins sind installiert, was passiert im Netzwerk, usw. Denken Sie einfach daran, wenn Sie mit den Zahlen spielen.

Answer 4

Solange die Implementierung nicht schlecht ist, sollte AJAX die Nase vorn haben. Zu den Vorteilen gehören:

• Parallelität durch parallele Anfragen auf der Client-Seite (d.h. Sie können mehrere Server-CPU-Kerne verwenden, um Teile einer Webseite zu bedienen, was mit PHP nicht so einfach möglich ist)

• das Auffrischen nur kleiner Teile der Seite ist schneller (weniger Daten zu übertragen, zu generieren ...)

• die Skalierbarkeit ist viel besser, da der Server weniger Arbeit hat (vor allem, wenn man einen Teil der für die HTML-Erstellung erforderlichen Verarbeitung auf den Client verlagern kann, anstatt sie nur zu liefern)

Dynamische Seiten wie http://www.startpagina.nl/ haben dies erfolgreich seit langem vor der jüngsten AJAX-Mode getan (1 statische Datei geliefert, alle Anpassungen auf der Client-Seite getan - das letzte Mal, dass ich überprüft sowieso).

Natürlich kann man bei beiden Methoden etwas falsch machen, so dass sie langsamer werden als die andere.