โพสต์ในบล็อกของฉัน: เครื่องมือค้นหา WebAssembly สำหรับไซต์แบบคงที่
Crane เป็นการสาธิตทางเทคนิคที่ได้รับแรงบันดาลใจจาก Stork และใช้การตั้งค่าไฟล์การกำหนดค่าที่เกือบจะเหมือนกัน จึงต้องตั้งชื่อตามนกด้วย
ฉันเขียนสิ่งนี้เพื่อช่วยให้ฉันเข้าใจว่าเครื่องมือค้นหา WebAssembly ทำงานอย่างไร กรุณาใช้นกกระสาแทน
เครนมี 2 โปรแกรม โปรแกรมแรกจะสแกนกลุ่มเอกสารและสร้างดัชนีที่มีประสิทธิภาพ ข้อความและข้อมูลเมตา 1MB กลายเป็นดัชนี 25KB (gzipped 14KB) โปรแกรมที่สองคือโมดูล Wasm ที่ถูกส่งไปยังเบราว์เซอร์พร้อมกับโค้ดกาว JavaScript และดัชนีเล็กน้อย ผลลัพธ์ที่ได้คือเครื่องมือค้นหาทันทีที่ช่วยให้ผู้ใช้ค้นหาหน้าเว็บในขณะที่พิมพ์
เยี่ยมชมการสาธิต
เครื่องมือค้นหาข้อความแบบเต็มขับเคลื่อนด้วยโค้ดจากโพสต์บนบล็อกของ Artem Krylysov มาสร้างเครื่องมือค้นหาข้อความแบบเต็มกันดีกว่า
ไม่มีความพยายามที่จะย่อขนาดไบนารีของ Wasm ดูการลดขนาดไฟล์ Wasm
อธิบายไฟล์เอกสารของคุณและข้อมูลเมตาของพวกเขา
[ input ]
files = [
{
path = " docs/essays/essay01.txt " ,
url = " essays/essay01.txt " ,
title = " Introduction "
},
# etc.
]
[ output ]
filename = " dist/federalist.crane "
ส่งไฟล์การกำหนดค่าไปยังสคริปต์บิลด์ คุณจะต้องการดัชนีใหม่ทุกครั้งที่เอกสารของคุณเปลี่ยนแปลง แต่คุณจะต้องสร้างโมดูล Wasm เพียงครั้งเดียวเท่านั้น
./build-index.sh federalist.toml
./build-search.sh
โฮสต์ไฟล์จาก /dist
บนเว็บไซต์ของคุณ (เช่น wasm_exec.js
, crane.js
, crane.wasm
, federalist.crane
) และคุณก็ไป!
const crane = new Crane ( "crane.wasm" , "federalist.crane" ) ;
await crane . load ( ) ;
const results = crane . query ( 'some keywords' ) ;
console . log ( results ) ;
ดูการสาธิตภายใน /docs
สำหรับ UI พื้นฐาน
./gh-pages.sh