Initial Impression of Pagefind
By R. S. Doiel, 2022-11-21
I’m interested in site search that does not require using server side services (e.g. Solr/Elasticsearch/Opensearch). I’ve used LunrJS on my person blog site for several years. The challenge with LunrJS is indexes become large and that limits how much your can index and still have a quick loading page. Pagefind addresses the large index problem. The search page only downloads the portion of the indexes it needs. The index and search functionality are compiled down to WASM files. This does raise challenges if you’re targeting older web browsers.
Pagefind is a rust
application build using
Unlike the documentation on the Pagefind website which suggests
npx I recommend
installing it from sources using the latest release of cargo/rustic. For
me I found getting the latest cargo/rustc is easiest using rustup. Pagefind will not compile using
older versions of cargo/rustc (e.g. the example currently available from
Mac Ports for M1 Macs).
Here’s the steps I took to bring Pagefind up on my M1 Mac.
- Install cargo/rust using rustup
- Make sure
$HOME/.cargo/binis in my PATH
- Clone the Pagefind Git repository
- Change to the repository directory
- Build and install pagefind
curl --proto '=https' --tlsv1.2 -sSf https://sh.rustup.rs | sh export PATH="$HOME/.cargo/bin:$PATH" git clone firstname.lastname@example.org email@example.com:CloudCannon/pagefind.git src/github.com/CloudCannon/pagefind cd src/github.com/CloudCannon/pagefind cargo install pagefind --features extended
Next steps were
- Switch to my local copy of my website
- Build my site in the usual page
- Update my
search.htmlpage to use pagefind
- Index my site using pagefind
- Test my a local web server
page see Getting Started. The
search.html I ran the pagefind command1.
pagefind --verbose --bundle-dir ./pagefind --source .
The indexing is wicked fast and it gives you nice details. I verified
everything worked as expected using
pttk ws static site web
server. I then published my website. You can see the results at http://rsdoiel.sdf.org/search.html and https://rsdoiel.github.io/search.html
I specified the bundle directory because GitHub pages had a problem with the default