Zu viele REST-API-Aufrufe auf einer Seite?


8

Eine Web-App, die mit hochmodularen, kleinen Komponenten entwickelt wurde (in diesem Fall unter Verwendung von AngularJS-Anweisungen, aber genauso gut WebComponents, ReactJS-Komponenten oder eine andere Technologie). Komponenten haben häufig asynchrone REST-API-Aufrufe, bei der Initialisierung oder bei der Benutzerinteraktion. Dieses Design verursacht viele API-Aufrufe pro Seite (manchmal 20+). Gibt es ein Problem mit diesem Design? Einige schlagen vor, die API-Aufrufe zu größeren clientseitigen Diensten zusammenzufassen, die als Singletons fungieren. Daher können 10 API-Aufrufe auf 1 reduziert werden, obwohl eine Seite möglicherweise nur einen Teil dieser Daten verwendet. Gibt es rote Fahnen oder Probleme mit diesem Design? Welches sollte bevorzugt werden?


Ich denke, vieles davon hängt von der Latenz ab, die Sie erleben, und von den Auswirkungen, die sie auf den Benutzer haben (bemerken sie es)?
Niall

Dies sind asynchrone Aufrufe und treten meist auf einmal auf (Seiteninitialisierung). Der Benutzer sieht also nur einen leicht ausgegrauten Bildschirm und eine Ladeleiste, bis alle Daten geladen sind. Ich denke, es ist eine gute Benutzererfahrung. Mein einziges Problem ist das Volumen der Serveraufrufe. Ist dies ein Problem (API-Einschränkungen? Usw.). In einer herkömmlichen App würde ich den Server pro Seite einmal anrufen.
Ryan Langton

1
Ich kenne keine Einschränkungen. Es klingt wie ein Kompromiss; Design vs. Wartung vs. Latenz vs. etc. Ich bevorzuge weniger, aber dass alle Daten für den Aufruf immer noch relevant sind (dh wenn die erforderlichen Daten für den API-Aufruf nicht relevant sind, machen Sie es zu einem separaten Aufruf). Ich gebe zu, ich denke das ist eine 6 von einem, ein halbes Dutzend von der anderen.
Niall

Antworten:


2

Browser begrenzen die Gesamtzahl der gleichzeitigen Anforderungen

/programming/561046

Also ja, es gibt ein Problem mit diesem Design. Ich denke jedoch, dass die akzeptierte Antwort darin besteht, zu einer Web-Sockets-Implementierung zu wechseln, bei der Sie eine einzelne Verbindung verwenden, aber viele Nachrichtentypen für die Kommunikation mit dem Server verwenden


1
Dies scheint kein Problem zu sein, da das Limit pro Browser gilt. Wenn es also mehr als 6 Anrufe gibt, werden die anderen nur in die Warteschlange gestellt. Einverstanden, dass Web-Socket-Verbindung effizienter wäre, nur nicht sicher, ob nötig.
Ryan Langton

hängt davon ab, wie Sie diese Anrufe verwenden, denke ich. Das Hauptproblem ist, dass Sie mit zunehmender Kompliziertheit des clientseitigen Codes auf die Einschränkungen von Javascript stoßen. z.B. Codierung eines Verbindungspooling-Socket-Clients in einer Sprache, die die Farbe von Text bei einem Mouseover ändern soll
Ewan

"Also ja, es gibt ein Problem mit diesem Design" - das scheint eine zu pauschale Aussage zu sein. Es gibt viele Möglichkeiten, wie dieses Design erfolgreich implementiert werden kann.
Richard

2

Dieses Design verursacht viele API-Aufrufe pro Seite (manchmal 20+). Gibt es ein Problem mit diesem Design?

Das sollte es nicht geben. Die Tatsache, dass jede Anfrage klein und asynchron ist, bedeutet, dass Sie Ihre Web-App erheblich beschleunigen können, anstatt auf eine einzelne große Anfrage warten zu müssen, die alles blockiert.

Stellen Sie einfach sicher, dass Ihr Javascript richtig asynchron ist und Dinge tun kann, während Ihre anderen Anfragen warten, und Sie erhalten eine viel bessere App, als wenn Sie eine massive Anfrage hätten, die alles abruft.

Nachdem alle Browser für das gleichzeitige Laden vieler URLs ausgelegt sind, kann selbst eine typische Standardwebseite zehn, wenn nicht Hunderte von Anfragen an Bilder, CSS, Javascript, Iframes usw. usw. Haben


1

Vergessen Sie nicht die Größe jeder Netzwerkanforderung. Wenn jede Anforderung nur 2 KB Daten zurückgibt, ist die Netzwerkanforderung für diese kleine Datenmenge im Allgemeinen zu teuer.

Wenn die Netzwerkanforderung bis zu 400 KB groß ist, teilen Sie sie in zwei Teile auf. Im Allgemeinen sind jedoch nicht genügend Daten für eine einzelne Netzwerkanforderung das Problem.


0

Einige Überlegungen hier:

Performance

Wenn Sie eine akzeptable Leistung sehen, sollten Sie sich darüber keine Sorgen machen. Wenn Sie HTTP2 ausführen können, sollten Sie eine Leistungssteigerung feststellen. [1] .

Design

Wie bei jedem Design gibt es keine festen Regeln, ob Sie viele kleine oder wenige große Anforderungen ausführen sollten. Einige Dinge zu beachten:

  1. Sind viele der Anrufe voneinander abhängig? Wenn Sie eine komplexe Abhängigkeitsbeziehung zwischen verschiedenen Aufrufen haben, kann dies die Wartung erschweren. In diesem Fall wäre eine Stapelverarbeitung von Antwortdaten sinnvoll.

  2. Teilen verschiedene Komponenten viele der gleichen Daten? In diesem Fall könnten Sie einen zentralen Punkt haben, der die gemeinsam genutzten Aufrufe ausführt und den Komponenten den Zugriff auf die gemeinsam genutzten Daten ermöglicht.

  3. Behalten Sie den Wartungsaufwand der kleinen Komponenten im Auge, wenn Sie separate Anrufe tätigen. Sie werden wissen, wann die Verwaltung schwierig wird und dann möglicherweise eine Änderung erforderlich ist. Das Ändern eines Entwurfs basierend auf hypothetischen zukünftigen Anforderungen kann zu Entwurfsfehlern führen, da Sie genau vorhersehen müssen, welche Probleme Sie in Zukunft haben werden. Wenn es jetzt gut funktioniert, wäre es auch unnötig, es zu ändern.

1: "HTTP / 2 ist vollständig gemultiplext, sodass mehrere Dateien und Anforderungen gleichzeitig übertragen werden können, im Gegensatz zu HTTP1.x, bei dem jeweils nur eine Anforderung / Verbindung akzeptiert wurde. HTTP / 2 verwendet dieselbe Verbindung zum Übertragen verschiedener Dateien Dateien und Anforderungen, um zu vermeiden, dass für jede Datei, die zwischen einem Client und einem Server übertragen werden muss, eine neue Verbindung hergestellt werden muss. " - https://css-tricks.com/http2-real-world-performance-test-analysis/

Durch die Nutzung unserer Website bestätigen Sie, dass Sie unsere Cookie-Richtlinie und Datenschutzrichtlinie gelesen und verstanden haben.
Licensed under cc by-sa 3.0 with attribution required.