Pagefind 是一个静态搜索工具。它不提供服务,只提供一个命令行程序:你把构建好的 HTML 目录丢给它,它扫描一遍,吐出一套索引文件和一个前端界面。
为什么不用第三方搜索
常见的做法是接 Algolia 之类的托管搜索。缺点有三个:
- 索引在别人服务器上,文章内容要上传。
- 有免费额度,超了就收费。
- 站点要联网才能搜。
Pagefind 三个都没有。索引就是 dist/pagefind/ 目录下的一堆文件,跟着站点一起部署。
怎么跑
构建脚本里串起来:
{
"scripts": {
"build": "astro build && pagefind --site dist"
}
}
顺序不能反。必须等 astro build 把 HTML 生成完,Pagefind 才有东西可扫。
索引是怎么做出来的
扫描生成的 HTML,按块提取文本,写成分片的压缩索引。查询时浏览器只下载命中的那几片,所以站点很大也不会一次性拖下整个索引。
提取时会跳过一些明显的噪声:脚本、样式、导航里的重复文字。剩下的正文会按语言做分词,中文按字切分,英文按词切分。
在这个站里的接法
搜索框平时不加载脚本,用户点搜索按钮或按 Ctrl+K 才去拉 /pagefind/pagefind-ui.js,拉回来再挂载。没搜索过的访问者不会为这个功能付任何下载成本。
开发模式的限制
npm run dev 时没有 dist/,也就没有索引。此时点搜索会弹一句提示,告诉你需要先跑一次 npm run build。这不是 bug,是静态搜索的固有前提。
什么时候不适合
需要搜索实时更新的内容、需要跨站点联合搜索、需要按用户权限过滤结果的场景,静态索引都不合适。