Concepts / Getting started / Algolia Search - Step-By-Step
May. 10, 2019

Algolia Search - Step-By-Step

We’ll start with the obvious: You need to give your users a point of entry - the search bar.

Search is performed on Algolia’s servers

The search bar is placed on the end user’s browser. To execute a search, you have 2 options: Either the browser connects to your own servers which then connects to Algolia to execute the search; or the browser communicates directly with Algolia’s servers, thus avoiding the extra trip to your servers. Since all of your searchable data is on Algolia’s servers, removing your servers from the search process is much faster and less resource intensive to go from browser to Algolia.

Algolia provides results in milliseconds - meaning, your users should be able to see results instantaneously. Instant results enables them to make decisions as they type. If they start typing an actor’s first name and get a list of unrelated actors and films, they’ll keep typing, or switch to the last name, or enter something completely different, maybe more precise. This back and forth is what makes search “conversational”. Users greatly benefit from conversational search.

No search button

As-you-type search relies on sending a search with every keystroke.

Having one search bar encourages your users to type freely, mirroring their thought process. The benefit of this might not be so obvious, as there are still many websites that offer more than one search bar - one for title, another for keyword, a third for author, and so on. Algolia works best with only one search bar. How does this work? Essentially, what you type is matched against all of your data. If you type an author’s name, Algolia returns all records that match the author’s name. If you add a book title next to the author in the query, that further restricts the search. And same with theme, genre, character names, a book’s full text - any text that you freely add inside the search bar impacts the record-matching process.

This approach works perfectly well because of how Algolia organizes, configures, and searches your data. It does so in a way that any set of query terms can be matched against any part of your data. There is, therefore, no need to offer more than one search bar.

That was the search bar, the easy part. Now let’s look at what happens when the engine executes a search.

The Response

Instantaneous

So the user types in a character and a search is sent out to Algolia. The response comes back - immediately (within 100 milliseconds, average 10 to 20ms). You now have a small subset of results, which corresponds to the first page. Your job is to display these results as quickly as possible, without any delay, to let your users see their results change as they type (that is, to keep it conversational).

Perception-wise, the maximum amount of time you have to receive a response and display them is 200 milliseconds - anything longer breaks the feeling of immediacy.

Ready for display

Algolia helps this process by including in the response everything you need for displaying results, nothing more nor less. The response includes all necessary data, such as descriptive text and URLs of images. It also formats the results for highlighting and snippeting. By the way, you control the contents of your results by how you structure your data.

The contents of Algolia’s response enables you to build a search UI without any additional data processing on your side. The response should be the sole source of truth and information for displaying results.

Highlighting, Snippeting, Paging

Your results contain all HTML to highlight and snippet your results. By highlighting the text that matches, users can see why a record has been found. Snippeting keeps long descriptions within a manageable size.

The response always returns data in page-size batches. Because of this, Algolia manages all paging.

Drilling Down with Filtering and Faceting

If you have set up categories in your data and placed all of your records in one or more of these categories, Algolia can return the relevant information for you to display these categories on your UI.

Geolocation

If you have marked your records with geo-locations, you’ll be able to search by geo-localization. This requires no extra work on your part.

Metadata, Rating Information

Finally, your response contains the overall number of results and pages, processing time, and the original query.

You can also ask Algolia to send back extended information for debugging purposes, like ranking information and geolocation data.

Data, Configuration, Search UI

The success of search and response comes from:

  • Data - How you prepare your data
  • Configuration - How you Configure your Index and Search

A full search solution includes the 3rd ingredient:

  • A great search UI/UX

Everything you need to know about data

Your company’s data is the starting point. Algolia never searches your data directly; it never touches your servers. It only searches a copy of your data on its own servers (called an Index). You, therefore, need to send your data to Algolia.

Additionally, Algolia does not need all of your data. It only needs data that can help people find your products and services. This usually means names, titles, descriptions, prices, brands, genres, and any other data you think may be useful to locate items. The general idea is to consider what users may type in the search bar, and what they would need to see in the results; this is the data you’ll need in your index on Algolia’s servers.

Here are several kinds of data you’ll need:

  • Searchable Data that users may use to search, like title, description, and other descriptive content.
  • Data to filter records, like genre and brand.
  • Data to help order your records, like most popular or highest sales, or to sort by price or date.
  • Data that people may want to see when in the results, like descriptions and images.

Algolia does not need to receive or store any data that does not serve these purposes.

What kind of data do you send to Algolia

The data you send to Algolia should be in a key/value format. The key, like “title”, should have a value, like “Star Wars”: “title=Star Wars”. Other examples include “price=10” and “desc=iphone X with unlimited speed, space, and battery time”. We expect you to send us these key/values in a JSON format.

Key Terms

  • Index - A collection of records. It is composed of data you send to us and that we store on our servers. You can store your data/records in one or more indices (indexes).

  • Record - Each product, film, actor, service, article, and so on - each definable item in your catalog corresponds to a record. A record contains all information (attributes) you need to describe an item.

  • Attribute - Every key/value is called an attribute. Some attributes are simple, like “title=star wars”, some are more complex, like “genre=adventure, sci-fi, comedy”, or even more complex “name = {first=john}, {last=smith}”.

Configuration

Some Key Settings

  • Searchable Attributes
  • Adding Business Metrics
  • Typos
  • Prefix Search
  • Synonyms
  • Distinct
  • Avoiding No Results

These are essential to making search great. Without these, there’s nothing. They are not everything, but they are necessary.

And not very far beyond that is:

  • Filtering
  • Grouping
  • Geolocation

Moreover, when we think about the broader experience, the actual end goals of why we want and need good search on our websites:

  • Merchandising
  • Personalizing
  • Detecting user intent to individualize results completely
  • Avoiding insufficient results
  • Query suggestions
  • Creating a great UI (see below)

InstantSearch

To help you build the best solution, we provide a full set of UI components that you can use on any web or mobile application. They can be used as-is, styled by your own CSS, or you can fully customize their functionality.

The Search Workflow

Now, let’s put all that together.

As soon as the user enters a single character into the search box, the machine starts.

  • Every keystroke initiates a trip to the Algolia servers.
  • The engine receives the query and goes to work, comparing the query to your data.
  • The comparison tries to match all or part of a query against one or more attributes of a record.
  • If there is a match, the record is selected. The quality or strength of this match is not yet taken into account.
  • When the matching algorithm finishes, the engine has a group of matching records in no particular order.
  • The ordering (ranking) process begins: the engine ranks records using a tie-breaking algorithm.
  • The engine then applies your custom ranking, making sure your best items appear at the top.
  • Finally, all results are formatted with highlighting, faceting, paging, and other such front-end-related information.
  • Engine sends back the results.
  • And then your front end goes to work. This is where Algolia’s InstantSearch comes into play.

All this is done within an average of 10 to 20ms.

Did you find this page helpful?