Fast Fuzzy Search In Pure JavaScript – fuzzysort

Preview:

Description:

fuzzysort is a dependency-free JavaScript that provides fast, Sublime Text-like, client-side fuzzy search/live filter functionality with keyword highlighting for your large datasets.

How to use it:

1. Install and import the fuzzysort library.

# NPM
$ npm install fuzzysort

import fuzzysort from 'fuzzysort'
const fuzzysort = require('fuzzysort')

<script src="https://cdn.jsdelivr.net/npm/fuzzysort@VERSION/fuzzysort.min.js"></script>

2. Basic usages.

// result.score
// result.target 
// result.obj 
// result.indexes
const results = fuzzysort.go(searchInput, sortableData, options)

3. Highlight the search terms.

fuzzysort.single('tt', 'test').highlight('*', '*')
result.highlight((m, i) => <react key={i}>{m}</react>) // [<react key=0>t</react>, 'es', <react key=1>t</react>

4. Advanced usage.

let objects = [{
  title: 'Liechi Berry',
  meta: {desc: 'Raises Attack when HP is low.'},
  tags: ['berries', 'items'],
  bookmarked: true,
}, {
  title: 'Petaya Berry',
  meta: {desc: 'Raises Special Attack when HP is low.'},
}]
let results = fuzzysort.go('attack berry', objects, {
  keys: ['title', 'meta.desc', obj => obj.tags?.join()],
  scoreFn: r => r.score * r.obj.bookmarked ? 2 : 1, // if the item is bookmarked, boost its score
})
var keysResult = results[0]
// When using multiple `keys`, results are different. They're indexable to get each normal result
keysResult[0].highlight() // 'Liechi <b>Berry</b>'
keysResult[1].highlight() // 'Raises <b>Attack</b> when HP is low.'
keysResult.score           // .84
keysResult.obj.title       // 'Liechi Berry'

5. Possible options with default values.

{
  threshold: 0,
  limit: 0, 
  all: false, 
  key: null,
  keys: null,
  scoreFn: null,
}

Changelog:

v3.0.1 (05/17/2024)

• optimization