2010-02-11 10 views
5

Anstatt mich auf die Datenbank jedes Mal, wenn jemand ein Zeichen in das Suchfeld eingibt, möchte ich statische .js-Dateien erstellen.20K Produkte mit Autovervollständigung, wollen statische JavaScript-Dateien erstellen

Was sind einige Techniken, die ich verwenden kann, um statische JS-Dateien, die im Grunde sind Arrays zum Laden der JQuery Autocomplete-Plugin mit erstellen.

Mein Aussehen Produkt SKUs wie:

ABC1234 

oder

Alpha Beta C 1234 

(abc ist die Kurzform für die Herstellernamen, während 'Alpha Beta C' die lange Form, gefolgt von 3 -4 Nummern).

+0

Nur 20.000?!?! –

Antwort

2

Dies ist eine gute Verwendung für JSON. JavaScript-Objekt-Notation. Sie können einfach die JS-Dateien einfügen und Sie haben alle Ihre Daten in Objekten.

http://www.json.org

var products = [{sku:'aaaa', price: 50}, {sku:'bbbb', price: 60}]; 

Bitte meine Syntax überprüfen, dann ist es aus dem Speicher.

+0

Abhängig von den Bandbreitenbeschränkungen und der Länge jedes Produktnamens könnte die erste Seitenladung ein Doozey sein. –

+0

Ich würde auf jeden Fall sicherstellen, dass der js-Skriptlader am Ende der Seite ist. –

+1

Das stimmt. Sie können die JSON-Datei am Ende eines AJAX-Aufrufs ablegen. Auf diese Weise laden Sie nicht die gesamte Datenbank zur Laufzeit auf die Seite und Sie treffen auch nicht jedes Mal die db. Dies funktioniert nur, wenn Ihre Produktdatenbank ständig aktualisiert wird. – chamiltongt

1

Sie können auch alle verbleibenden Möglichkeiten in JSON über einen AJAX-Aufruf senden nur nach 2/3 Tastenanschläge und extrahieren Sie die restlichen Ergebnisse von diesem Objekt/Array (ich weiß nicht, ob JQuery dieses Verhalten unterstützt). Dies spart Bandbreite, da nicht die gesamte Datenbank an den Client gesendet werden muss und Sie die Datenbank nicht mehr als einmal aufrufen müssen (in der Regel, wenn die ersten Schlüssel korrekt waren).

Ich bin mir nicht sicher, ob Ihre Frage auch serverseitig ist (noch welche server-seitige Technologie Sie verwenden), also sehen Sie sich bitte PHP's JSON functions (speziell json_encode) an, um mehr darüber zu lesen.

+0

Ja, sendet eine JS Quasi-Datenbank an den Client klingt schmerzhaft –

0

Sie könnten eine minimierte endliche Zustandsmaschine (z. B. eine DAWG) erstellen, die Endknoten für alle vorhandenen Produktcodes enthält. Dann speichern Sie diese in einem optimierten Format in einer Javascript-Zeichenfolge (oder einer kleineren Anzahl von Zeichenfolgen).

Diese Zeichenfolgen könnten dann komprimiert an den Browser gesendet werden, es würde wahrscheinlich nicht sehr lange dauern, um zu laden.

Dann können Sie die Statusmaschine in Abhängigkeit von der Anzahl der bereits eingegebenen Zeichen durchlaufen und effizient alle Produktcodes finden, die mit diesen Zeichen beginnen.

So würde ich es trotzdem tun.

Oder vielleicht laden Sie einfach das ganze Wörterbuch, weil 20k nicht so viele ist. Ich habe ein Javascript-Spiel geschrieben, das ein größeres Wörterbuch geladen hat und kein wirkliches Problem war.

+0

Er sagt 20K * Produkte *, nicht 20K Bytes.Wenn ein Produktdatensatz durch 100 Byte JSON dargestellt wird, müssen Sie 2 MB JSON-Daten herunterladen, um die gesamte Datenbank zu erhalten. –

+0

Nur um den Produktcode zu speichern, sollte nicht 100 Bytes und wesentlich weniger, wenn Sie sie effizient speichern und komprimieren. Ich denke, 10 Bytes sind realistischer. – MarkR