Meine Frage ist, ob jemand Ideen hat, wie man eine HTML-Zeichenkette, die viele Knoten enthält, mit höchster Leistung direkt an ein vorhandenes DOM-Element anhängen kann.
Lassen Sie mich erklären, was ich mache. Ich erstelle ein Javascript-Vorlagen-Skript. Im Moment ist es wahnsinnig schnell. Ich kann 40.000 mehrdimensionale Elemente aus JSON als HTML-Knoten in das DOM in etwas mehr als 3 Sekunden rendern (Chrome 16 läuft auf einem OSX Macbook Pro).
Nachdem ich die Zeichenfolge analysiert habe, füge ich sie über .innerHTML in ein neu erstelltes span-Tag ein und hänge dieses span-Tag dann an das DOM an. Es ist verdammt schnell, effizient und schick, aber verdammt, es funktioniert einfach nicht. Warum? Weil es die Knoten mit einem überflüssigen Tag umschließt und dies wird zweifellos in einigen Fällen mit CSS und Gott weiß was noch, stören. Also müssen multiple neu erstellte DOM-Knoten direkt unter einem vorhandenen HTML-Tag angehängt werden können.
Also bin ich vom Anhängen des span-Tags (zusammen mit all seinem über innerHTML zugewiesenen HTML) zum Durchlaufen jedes Kindknotens dieses Spans und zum separaten Anhängen davon übergegangen. Aber, Mann, ist es viel langsamer! Es dauert fast 20 Sekunden, um 40.000 Einträge zu rendern, im Vergleich zu 3 Sekunden.
Und ich halte mich für dieses spezielle Projekt von jQuery fern. Und nein, ich rechne nie damit, dass in einer realen Situation 40.000 Elemente auf einer Seite gerendert werden. Ich mache das nur, um die Geschwindigkeit zu testen. Ich möchte, dass das Skript absolut so schnell wie möglich ist.
0 Stimmen
Warum als SPAN? Alle diese Knoten sind inline? Ein DIV wäre hier die generische Wahl.