Search

The search is powered by fuse.js, a lightweight fuzzy-search library with no other dependencies.

The search is 100% client side an the index is built at build time of the static site.

You can view a demo of the search functionality on the demo search

The Seach Index

The search index is created at build time via the /source/search_data.json.erb file. View output example here.

In this erb file, Ruby Static Pro iterates over all the resources in the app, and generates a JSON file that is used as the search index. This file will be located at the url: /search_data.json. You can view the file here on the demo

As new pages get added to your app, the search data will automatically get updated. Yes, this means that the index could grow quite large. If you want to limit the amount of data that is present that is in the resulting JSON file, you can adjust the code that generates this json file in the /source/search_data.json.erb.

This same mechanism is also what powers the doc search here. Notice how the doc search is limited to scope in just the /docs folder. This is a small modification we made to the script to support our docs site.

Wiring Up the Search with the Search Stimulus Controller

Fuse.js search is wired up with a Stimulus controller, located at /source/javascripts/controllers/search_controller.js

You can view the usage of this controller in the search.html.erb file.

The controller needs a urlValue and a place to return the results. This is present in the search.html.erb file.

The urlValue is provided via the data-search-url-value="/search_data.json" html attribute.