Searchkit V3: GraphQL for Elasticsearch

Joseph McElroy
Searchkit Blog
Published in
3 min readNov 14, 2020

--

4 years ago we wrote Searchkit because it was so hard to build a great search experience. Searchkit made it possible to build a great Search UI without needing to be an expert on React or Elasticsearch. Since its release, Searchkit became one of the most popular UI React frameworks and helped many corporations like Netflix, Mozilla, News Corp & The Financial Times.

Today we have released v3 of Searchkit which hopes to address alot of the pain points that we had, namely developer experience, security and Searchkit’s future.

Developer Experience

Searchkit v2 was very quick to configure but very difficult to customise. Searchkit addresses this by splitting the one layer into 3: Backend, State and UI. You choose what layers you want to use, either Searchkit’s or your own.

The backend layer is a GraphQL tier that sits in between Elasticsearch and the client. Searchkit leverages Apollo GraphQL to provide a Search UI centric API thats really easy to develop for from just a simple configuration.

Another advantage is you don’t need to use React to get the benefits of Searchkit. With Searchkit GraphQL, you skip needing to build your own API and become a Elasticsearch expert to build a great search experience.

Since Searchkit was released, the NPM React ecosystem has exploded with UI frameworks. Today developers want to use their own UI components and neither is it cost effective for us now to maintain our own. So we provide two layers for the frontend: @searchkit/client and @searchkit/elastic-ui.

@searchkit/Client provides an api shared across components to update search state like filters, query and pagination. With @searchkit/client, its super easy to integrate with your React components.

@searchkit/client is also extremely small (under 10kb), keeping your webpages fast.

Then @searchkit/elastic-ui is for those who just want a great search experience quickly. It uses the awesome @elastic/eui UI framework to provide UI components out the box.

More Secure

As the previous version required direct access to the Elasticsearch instance, most developers found this was difficult to overcome as exposing the Elasticsearch instance to the internet was seen as a security risk. Fine for internal projects, not so much for your eCommerce site.

Searchkit v3 solves that by moving the integration with Elasticsearch to a GraphQL tier providing both security and speed improvements from smaller payload responses. You specify what fields can be queried, faceted and returned by the API configuration. You no longer need to expose your Elasticsearch instance. In future you’ll be able to configure rules for facets and fields, locking down the API.

Searchkit Future

Reducing the “footprint” of what Searchkit does and leveraging other popular libraries to do the parts we don’t do, Searchkit becomes easier to maintain and to contribute towards. We heavily lean on frameworks like Elastic EUI, Elasticsearch, Apollo & Next because they’re widely adopted and used for a huge range of applications. They are well maintained, easy to google and get support when stuck.

Searchkit on Github or our website.

Joe

--

--