
Pagefind Has a Free Static Site Search — Here's How to Use It
Algolia charges $1/1K search requests. Elasticsearch needs a server. Pagefind runs entirely in the browser — add full-text search to any static site with zero hosting cost. What Is Pagefind? Pagefind is a fully static search library. It indexes your site at build time and runs searches client-side using a compressed index — no server, no API, no monthly bill. Quick Start npx pagefind --site dist That's it. Pagefind indexes your built site and generates a search UI. <!-- Add to any page --> <link href= "/pagefind/pagefind-ui.css" rel= "stylesheet" > <script src= "/pagefind/pagefind-ui.js" ></script> <div id= "search" ></div> <script> new PagefindUI ({ element : " #search " }); </script> How It Works Build your site (Astro, Hugo, Next.js, etc.) Run Pagefind — indexes HTML output Compressed index — split into chunks (~100KB base + lazy-loaded fragments) Client-side search — WebAssembly-powered, instant results Performance Site Size Index Size Search Speed 100 pages 20KB <10ms 1,000 pages
Continue reading on Dev.to Webdev
Opens in a new tab

