Mein Blogbeitrag: WebAssembly-Suchtools für statische Websites
Crane ist eine technische Demo, die von Stork inspiriert ist und ein nahezu identisches Konfigurationsdatei-Setup verwendet. Daher musste es auch nach einem Vogel benannt werden.
Ich habe es geschrieben, um zu verstehen, wie WebAssembly-Suchtools funktionieren. Bitte verwenden Sie stattdessen Stork.
Crane besteht aus zwei Programmen. Das erste Programm scannt eine Gruppe von Dokumenten und erstellt einen effizienten Index. 1 MB Text und Metadaten werden in einen 25 KB großen Index umgewandelt (14 KB im gzip-Format). Das zweite Programm ist ein Wasm-Modul, das zusammen mit etwas JavaScript-Glue-Code und dem Index an den Browser gesendet wird. Das Ergebnis ist eine Sofortsuchmaschine, die Benutzern hilft, Webseiten während der Eingabe zu finden.
Besuchen Sie die Demo
Die Volltextsuchmaschine basiert teilweise auf Code aus Artem Krylysovs Blogbeitrag „Let's build a Full-Text Search engine“.
Es wurden keine Anstrengungen unternommen, die Wasm-Binärdatei zu verkleinern. Siehe Reduzieren der Größe von Wasm-Dateien.
Beschreiben Sie Ihre Dokumentdateien und deren Metadaten.
[ input ]
files = [
{
path = " docs/essays/essay01.txt " ,
url = " essays/essay01.txt " ,
title = " Introduction "
},
# etc.
]
[ output ]
filename = " dist/federalist.crane "
Übergeben Sie die Konfigurationsdatei an das Build-Skript. Sie benötigen einen neuen Index, wenn sich Ihre Dokumente ändern, müssen das Wasm-Modul jedoch nur einmal erstellen.
./build-index.sh federalist.toml
./build-search.sh
Hosten Sie die Dateien von /dist
auf Ihrer Website (z. B. wasm_exec.js
, crane.js
, crane.wasm
, federalist.crane
). Und los geht's!
const crane = new Crane ( "crane.wasm" , "federalist.crane" ) ;
await crane . load ( ) ;
const results = crane . query ( 'some keywords' ) ;
console . log ( results ) ;
Eine grundlegende Benutzeroberfläche finden Sie in der Demo in /docs
.
./gh-pages.sh