Wie kann ich AJAX-Daten ohne Leistungseinbußen im Hintergrund laden?

Question

Ich habe einen sehr großen Produktkatalog, den ich in "Seiten" von, sagen wir, 10 Artikeln gleichzeitig laden möchte.

Jetzt, wenn ein Benutzer meinen Katalog öffnet und 30 Sekunden lang die erste "Seite" durchsucht, möchte ich, dass meine App weiterhin Daten vom Server lädt - so dass der Nutzer zu einer anderen Seite wechselt sind hoch, dass ihre Daten bereits in ihren Browser geladen werden.

Ich habe es geschafft, mit einem rekursiven Ajax.Request, dass, nachdem eine Seite geladen ist, lädt die nächste Seite.

Leider verursacht dies Performance-Probleme - der Browser reagiert auf Benutzereingaben sehr schleppend, bis der gesamte Katalog geladen ist. (An diesem Punkt kann ich auch entweder den gesamten Katalog laden oder Hintergrund laden).

Was kann ich tun, um Hintergrunddaten mit niedriger Priorität im Hintergrund zu implementieren? Ist es überhaupt möglich? Soll ich aufgeben und einfach nur faulen Laden?

Answer 1

Das Problem ist nicht mit dem Ajax-Aufruf, der den Benutzer überhaupt nicht aufhängen sollte. Das Problem tritt auf, wenn Sie diese Daten verarbeiten. Große Loops und viele Schreibvorgänge im DOM werden den Browser träge machen. Kleinere Schleifen, die Verwendung von setTimeout for loops und das einmalige Schreiben in das DOM sorgen für mehr Reaktionsfähigkeit.

Ohne den Verarbeitungscode zu sehen, das ist so viel Hilfe wie ich geben kann.