Morsels

Easy, relevant, and efficient client-side search for static sites.

Description

Morsels is a client-side search solution made for static sites, including a search UI and library depending on a pre-built index generated by a CLI tool.

A few other players in this space are Stork and TinySearch. Morsels does the same, with a focus on providing a much more feature rich and customisable search experience, while still being extremely easy to get started with for the simplest of use cases (e.g. static sites).

Features

Feature-rich, Relevant Search 🔍: spelling correction, automatic prefix search, boolean and phrase queries, BM25 scoring, proximity scoring, persistent caching, and more.
WebAssembly & WebWorker powered, enabling efficient, non-blocking query processing
Multi-threaded 🏇 CLI indexer powered by Rust
Semi-Scalable, achieved by optionally splitting the index into tiny morsels, and complete with incremental indexing.
A customisable, accessible user interface 🖥️
Support for multiple file formats (.json,csv,pdf,html) to satisfy more custom data requirements.

Documentation

The documentation, which also uses Morsels for its search function, is available here.

Check out the website here as well!

Getting Started

Powering static site search with Morsels is extremely easy, and requires just a folder of your HTML files. Titles, links, headings, etc. are automatically sourced, assuming your folder structure follows how your site's pages are layed out as well.

1. Installing the indexer

If you have the rust / cargo toolchains setup, simply run cargo install morsels_indexer --vers 0.6.1.

Alternatively, download the cli binaries here.

2. Running the indexer

Run the executable as such, replacing <source-folder-path> with the relative or absolute folder path of your source html files, and <output-folder-path> with your desired index output folder.

morsels <source-folder-path> <output-folder-path>

3. Installing the Search UI via CDN

Add the following resources to your pages:

<!--  Search UI script -->
<script src="https://cdn.jsdelivr.net/gh/ang-zeyu/morsels@v0.6.1/packages/search-ui/dist/search-ui.ascii.bundle.js"></script>
<!-- Search UI css, this provides some basic styling for the search dropdown, and can be omitted if desired -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/ang-zeyu/morsels@v0.6.1/packages/search-ui/dist/search-ui-light.css" />

If you wish to host the files, you can find them in the <output-folder-path>/assets directory generated by the indexer, or in the releases page.

4. UI Initialisation

Give any <input> element in your page an id of morsels-search, then call:

initMorsels({
  searcherOptions: {
    // Output folder url specified as the second parameter in the cli command
    // Urls like '/output/' will work as well
    url: 'http://<your-domain>/output/',
  },
  uiOptions: {
    // Input / source folder url, specified as the first parameter in the cli command
    sourceFilesUrl: 'http://<your-domain>/source/',
  }
});

License

This project is MIT licensed.

morsels_common 0.6.1