
一直有人建议聚BT增加站内搜索功能,一直没有足够时间弄。网站是基于 WebStackPage 构建,纯HTML架构,要让网站支持站内搜索,可选用的几种方案:
1、升级成类似 WebStack-Laravel 支持数据库的WebStackPage 系版本,通过数据库搜索实现全站搜索
可行性分析:不可性。数据库搜索性能差,升级迁移工作量大
2、迁移到VitePress,VitePress 官方版本已经内置通过MiniSearch实现站内搜索
FMHY等众多主流的导航站都采用VitePress,确实有诸多优势。
可行性分析:不可行,迁移工作量大。
3、采用支持静态页面搜索的搜索引擎
可选用的方案:
a、传统基于Lucence的搜索引擎,包括 Elasticsearch、Solr、OpenSearch 等
b、RAG以及向量搜索解决方案
c、类 Algolia、Meilisearch、Typesense的轻量级搜索引擎
d、类似Pagefind、MiniSearch、TinySearch、FlexSearch 的无搜索服务器方案
这几种方案的对比不具体描述。
类似Pagefind、MiniSearch、TinySearch、FlexSearch 的无搜索服务器方案是比较好的选择。
对比后,选择了Pagefind作为静态页面站内搜索解决方案。
Pagefind 官网:https://pagefind.app/
Pagefind的安装使用并不复杂,具体可以参考官方文档。
直接用AntiGravity进行Vibe Coding,很快集成了Pagefind,体验还不错。
目前 聚BT 基于Pagefind 增加全站内容搜索功能,在聚BT首页的底部、其他页面的顶部和底部都有Pagefind搜索框,有兴趣的可以体验:
体验:https://jubt.top/cn/about.html
一些经验:
1、使用Pagefind对静态页面索引后,要在Pagefind搜索结果中精准跳转到原HTML页面的具体元素,可以使用URL Text Fragments
搜索结果大致效果:/test.html#:~:text=Keyword
优点:不需要对原HTML页面元素做任何调整,只需要在Javascript中对Pagefind返回的搜索结果拼接 Text Fragments即可:#:~:text=搜索词