full text indexing in browser

Full Text Indexing in the Browser

Only Half As Bad As You Might Think!

...actually a talk about Web Workers

Why do it in the browser?

Beer Festivals!
Traveling attendees with poor/no mobile internet
Webapp with all its data can be accessed offline
Searching?

Full Text Searching

Web Workers!

Simple script that runs on another thread
I/O through XHR/fetch
Communicates by sending/receiving messages
Separate global context to window
Access to things like IndexedDB & WebSockets

Full Text Searching

💥 With Web Worker 💥

import FullTextSearch from 'full-text-search-light'

let index
function initializeIndex (beerData) {
  index = new FullTextSearch()
  beerData.forEach(beer => index.add(beer))
  postMessage('indexed')
}

searchworker.js

import FullTextSearch from 'full-text-search-light'

onmessage = message => {
  const payload = message.data
  const messageType = payload.messageType
  switch (messageType) {
    case 'init':
      initializeIndex(payload.beerData)
      return
    default: return
  }
}

let index
function initializeIndex (beerData) {
  index = new FullTextSearch()
  beerData.forEach(beer => index.add(beer))
  postMessage('indexed')
}

searchworker.js

import FullTextSearch from 'full-text-search-light'

let index
function initializeIndex (beerData) {
  index = new FullTextSearch()
  beerData.forEach(beer => index.add(beer))
  postMessage('indexed')
}

app.js