Ich habe also mehrere (~ 30) Async-Aufrufe mit Daten (~ 25 Datensätze pro Aufruf), die ich in einer bestimmten Reihenfolge anzeigen möchte.
Derzeit wartet die Seite darauf, dass alles geladen wird, sortiert ein einzelnes internes Array und fügt dann die DOM-Elemente hinzu (jedes Datenelement wird auf eine HTML-Vorlage / Zeichenfolge angewendet, die effektiv verkettet und einmal dem innerHTML des übergeordneten Elements hinzugefügt wird) .
Ich würde gerne die Daten mit jedem Datensatz eingefügt werden (wie es zurückkommt) ... aber das bedeutet, dass ich eine andere Art und Weise brauche, um die Sortierung / Reihenfolge zu handhaben.
Ansätze, die ich in Betracht gezogen habe:
Im Idealfall spiegeln Sie das DOM in einer Art B-Tree, so dass INSERT-Operationen nur die Baumstruktur durchlaufen und nach dem richtigen Element für insertBefore / insertAfter suchen, da ich noch keine Bibliothek zur Adressierung sehen kann Dieses Bedürfnis, es scheint, als ob ich am Ende ein bisschen Code schreiben würde.
manuelles Iterieren des DOMs nach dem einzufügenden ElementAfter ... scheint relativ langsam, relativ langsam.
verwenden Sie einfach jQuery.sort (fn) nach dem Laden jedes Dataset ... scheint bestenfalls hacky (angesichts der Anzahl der Male, die es ausgeführt werden würde, und das Volumen der DOM-Manipulation), aber bei weitem die einfachste Code-weise zu implementieren, da es wie 5 Zeilen ist.
Ich habe eine Art Pufferwarteschlange zwischen den Async-Returns und der DOM-Manipulation betrachtet, aber es gibt viel zu viel, was ich NICHT über JS und Threading weiß, um mich mit dieser Methode wohl zu fühlen.
Ich mag die Idee, direkt in den sortierten Slot einzufügen, aber ich bin mir bewusst, dass DOM-Manipulation "langsam" sein kann (abhängig davon, wie es gemacht wird usw. - und ich bin auf keinen Fall ein JS-Guru) . Die Idee der Pufferwarteschlange mit einem separaten Leser / DOM-Handling schien einen vernünftigen Kompromiss zwischen Reaktionsfähigkeit und DOM-Manipulationsschmerz zu bieten, aber das ist für mich an diesem Punkt alles theoretische ... und alles gesagt und getan, wenn es endet es ist mehr Aufwand, als es wert ist, ich werde entweder wie es ist, oder einfach die faule Route von jQ.sort das DOM gehen.
Ihr kompetenter Rat würde sehr geschätzt werden:)
Danke
Ich würde mit Option 2 gehen. Das DOM ist nur Objekte in einer Baumstruktur, so dass Sie keinen separaten abstrakten Baum benötigen, außer wenn Sie einen möchten. Sie können Daten direkt mit den Elementen über Attribute oder expando-Eigenschaften verbinden (wenn Sie Letzteres tun, achten Sie auf Namenskonflikte, wählen Sie etwas sehr Spezifisches für Ihr Projekt) - letztere haben den Vorteil der Geschwindigkeit und sind nicht auf Strings beschränkt.
>Das Durchsuchen einer Liste von DOM-Elementen ist überhaupt nicht sehr langsam, und es ist auch nicht viel Arbeit.
Beispiel zum Einfügen von Zufallszahlen in divs innerhalb eines Container-div:
Tags und Links javascript jquery sorting