La recherche est la raison pour laquelle les sites sont considérés comme dynamiques depuis vingt ans. Pagefind a mis fin à cet argument. Il s'exécute une fois, après votre build, et indexe les fichiers HTML que vous possédez déjà. Le résultat est un index fragmenté de petits fichiers JSON que le navigateur récupère paresseusement.

Trois commandes

npm i -D pagefind
npx pagefind --site out
# serve the search UI wherever you like

C'est tout le pipeline. Sur un site personnel modeste, l'index pèse quelques kilo-octets et le navigateur ne charge que les fragments dont il a réellement besoin, de sorte que la page de recherche reste légère même avec des centaines d'articles.

Ce qui le rend très cool

  • Multilingue sorti de la boîte, donc « traduire » trouve la même page que « traduit » dans votre index de quatre langues.
  • Mise en évidence de la phrase correspondante à l'arrivée, sans travail de balisage supplémentaire.
  • Zéro backend, zéro coût, zéro risque de fuite d'un journal de recherche.

Connectez-le à votre rythme : exécutez-le dans CI après votre version statique préférée et déposez l'interface utilisateur dans une page sous la forme d'une simple balise de script. L'index se trouve dans le dossier de sortie, donc chaque déploiement l'actualise. Pour un site comme le nôtre, c'est tout ce qu'une fonction de recherche était censée faire.