Pagefind

Having seach on your website is very nice and convenient. I had it with Known, then, as I moved to static, I didn’t have it for a couple of months, then after the switch to LoveIt I had it back. LoveIt has builtin facilities to make use of either Algolia or Lunr.js, so I started using this second option. It worked well for some time, but then I started adding old posts from Google Plus and LJ, and suddenly there were too many pages on my site.

Essentially, there was a separate file generated for Lunr.js that had all the text content of the whole site, and that file had to be downloaded by your browser for the script to be able to search it. The file grew too big, and it became easier to just fire up Google and do a site-specific search there than to wait for the “builtin” search to load. I ended up disabling the search altogether, it was unusable anyway.

Last week, I saw a note on Lobste.rs about how version 1.0 of a new cool search engine tailored for static generated websites called Pagefind. Gave it a look — interesting! A standalone binary that takes a generated website, creates an index, and saves it to a subdirectory together with WASM code; that code can later be queried from the browser using JavaScript. Index, they say, is composed in a clever way, not just as one big file, and so the amount of data being transferred and processed during a query is rather modest.

Yesterday night, as my household went to sleep, I decided to give it a try. Had the subdirectory generated — index, WASM, some JS/CSS for the builtin UI, over 20 MB in total. Gave it a run, it worked. Fast. And, judging by the browser console, there was just about 100 kB worth of traffic for a search query, that’s including WASM. And the index is rather configurable, all it takes is throwing in a couple of HTML tags. Nice!

So, my website has a search button again! With my (lack of) JavaScript knowledge, it took about two hours to make the LoveIt interface work with Pagefind, so I went to sleep well after midnight, but it was definitely worth it. Besides, I learned a little more JavaScript, and that’s not a bad thing either.