[ERLEDIGT] Preload für datalists

[wurzeltraktor]

Ich habe eine datalist mit über 13.000 Einträgen (options) am Start und beobachte selbst in meiner lokalen Testumgebung, dass es sichtlich dauert, bis alle Werte geladen sind. Bevor ich damit online gehe meine Frage:

Kann man für eine datalist eine vergleichbare onload-Funktion bauen, wie es sie z.B. für Bilder, Videos gibt? Die datalist wird per document.write(data); aus einer txt-Datei gefüllt.

Vielen Dank!

 

[wurzeltraktor]

Ich unterscheide bei der datalist zwei Benutzertypen: Die Einen, die wissen was sie suchen und über die schnellen Ergebnisse nach nur wenigen Zeichen froh sind. Das funktioniert schon jetzt auch ohne Serverseitiges.

Und die Anderen, die einfach nur stöbern wollen, also die datalist (per Doppelklick in FF) komplett öffnen. Die müssen im Moment noch reichlich warten, bis die Scrollbar nach unten gewandert ist.

Ich bin JS-Einsteiger und versuche step-by-step zu lernen und da sind mir einzelne Scripts hilfreicher als Bibliotheken und asynchrone Server-Kommunikation. Also kein Ajax oder jQuery, o.Ä. Bei Bildern klappt das schließlich auch.

 

[wurzeltraktor]

Die datalist wird per document.write(data); aus einer txt-Datei gefüllt.

Die Quelldatai wird als script im head angemeldet und dann per div im body abgefufen.
Die txt enthält die Liste der Optionen in Form von

var data = '<option value ="abc"></option> ....'

 

[jonas3344]

Was bedeutet sichtlich?

Aus Performance-Gründen ist es eher weniger sinnvoll 13000 Elemente in eine Datalist zu schreiben. Du kannst aber natürlich über

$(document).ready()

oder

document.addEventListener("DOMContentLoaded", function() {
  // code...
});

die Datalist befüllen sobald Deine Seite gerendert ist. Damit ist sie hoffentlich voll wenn der User dann ins Textfeld klickt.
Sinnvoll wäre hier aber wahrscheinlich eine Lösung welche per Ajax vom Server aus die Optionen zurückliefert, welche der Benutzer haben will (also wenn er B klickt alle welche mit einem B beginnen, etc.)

 

[jonas3344]

Vielleicht überzeugt Kollege wurzeltraktor eine zweite Meinung in diese Richtung sich da reinzuarbeiten. ;)

Eine wirklich gute, fixe Lösung wird es mit dem Ansatz ohne Serverseitige Kommunikation bei dieser Datenmenge wohl nicht geben.

 

[wurzeltraktor]

Mit "sichtlich" ist etwa eine Minute gemeint, die die Seite im FF benötigt, um alle Optionen aufzurufen, wenn man die Geduld hat, mit der Maus solange nach unten zu ziehen.

Wie schon gesagt: Bei der gezielten Auswahl / Eingabe von einzelnen Zeichen durch den Benutzer ist die Performance absolut okay - nur das Stöbern dauert.

Chrome und Edge limitieren die Ausgabe übrigens auf (geschäzte) 50 Einträge, was das Stöbern quasi unmöglich macht - also einfachste (und beste) Lösung: Thema einfach vergessen :-(

Dennoch allen: Vielen Dank!