Why use Elastic Search-UI instead of ReactiveSearch? What are the differences? Is there a comparison table somewhere?

Elastic Search
1

Why use Elasticsearch-UI instead of ReactiveSearch? What are the differences? Is there a comparison table somewhere?

2

Hey @tombburnell,

It depends on the route that you're taking with Elasticsearch and how involved you want to get with the code. I would say they're largely the same (from a feature standpoint) but serve different use-cases.

Search-ui (https://github.com/elastic/search-ui/) is a frontend framework that allows you to build Search experiences on the frontend easily. Its designed in mind for Elastic Enterprise Search | Elastic. This pairing is great for companies who want search with little code. Then you have an option with building your own connector to use for any backend ( for example your own API). The advantage there is its awesome for those who want to get started quickly with enterprise search but then transition to their own API. Writing your own connector, you do not need to rewrite the frontend again to transition between enterprise-search and Elasticsearch or another technology.

Search-ui is also backed by Elastic and being actively developed for.

Another reason is Reactivesearch out of the box calls Elasticsearch directly from the browser and requires Elasticsearch to be exposed publicly. We don't advise you to expose Elasticsearch for security reasons (though this does depend on the situation).

Theres another called Searchkit https://searchkit.co/

Hope this helps.
Joe

3

Hi Joe, Thanks for the explanation. I have a few followup questions:

  1. One thing I would like to achieve is to have a number of panels on my homepage which are essentially different product search results - latest/trending/our picks etc. But for them to share a common faceting controls for the genre of all panels at the same time so when the user changes the genre, all panels update.
    I'd like to store the user's selection of genres (in local-storage) so the next time they return, it will have them preselected.
  • Is this something that is supported by search-ui? (multiple panels with different search params but same genre selection? And the ability to read the selected parameters.

  1. When I try to use the facet component I couldn't find a way to show how many items are in each facet. Is this possible?

  2. I'll be using with Next.js. Does search-ui support Server side rendering too?

  3. You mentioned not using ES directly and using Enterprise Elasticsearch. Does this fulfil the same role as https://github.com/appbaseio/reactivesearch-api for reactive search? Ie acting as a proxy between the frontend and ES. Are they interchangeable? Could one use reactivesearch-api with search-ui for example?

  4. You mention SearchKit too - why would one choose searchkit over search-ui? Have you thought about making a comparison chart between them all?

  5. Did you consider to simply make a backend for the popular instantsearch.js instead of creating a new search library?

Thanks, Tom

4

Great Questions Tom!

  1. You could but will require some FE work, no matter the framework you pick. Sounds like what you need is to perform a query per view (latest / trending / our picks) and gather the facets from one of these queries to derive the genre options. For this, might be best to custom build these components as they don't sound too difficult + you want your homepage to be fast, importing a large library like search-ui / ReactiveSearch isn't going to help matters.

  2. Definitely possible. from the API response, each facet will come with a count of how many items are in the facet. If its not being displayed, might be an issue with your setup of the component.

  3. Search-ui does not yet support SSR. We want to in the future.

  4. Yes you are correct! Didn't want to mention it at first to confuse things further but yes, reactivesearch-api is similar to enterprise search.

  5. I mention searchkit because im a little biased (im the author). Personally if you're using next and your type of requirements of building custom components that aren't typical of a "search" interface, Searchkit might be a good fit.

  6. We haven't but its a good point, building a connector for instantsearch to run enterprise-search. It could be complimentary to our offering

Hope this answers your questions!

5

Hi Joe, thanks for your clear answers.

A couple more if you don't mind..

If I just made the components by hand and then the requests via my own backend API would there be any advantage in using enterprise search/reactivesearch-api rather than going direct to ES?

Are they just there to act as a query filter to prevent dangerous queries or do they do more than that?

I think if I used a single facet for 2 search panels (with different underlying queries), the numbers could only make sense for one panel so in this specific use-case might not be so useful.

This is how I setup my component - and I didn't get any numbers. Can you see what I may have missed?

<SearchProvider
                config={{
                    apiConnector: connector,
                    searchQuery: {
                        disjunctiveFacets: ["genre"],
                        facets: {genre: {type: "value", size: 30}}
                    }
                }}
            >
                Facet:<Facet field="genre" label="Genres" view={MultiCheckboxFacet} />
                <div className="App">
                    <Layout
                        header={<SearchBox />}
                        bodyContent={<Results titleField="title" />}
                    />
                </div>
            </SearchProvider>

Cool that you make SearchKit - I'll try it out too!

Thanks again!

6

Sure!

Yes but ent-search offers other additional advantages where it simplifies the integration between elasticsearch and you. It works on common search patterns customers use and simplifies those use-cases. Ent-search also provides a UI for tweaking relevance / synonyms without needing to touch code. Great for business users who want to refine search over time without involving the developer.

Which API connector are you using? Your configuration looks correct to me of the react code. I would check the XHR request panel in console to see what the response is back from ent-search to see if you get back numbers.

Another thing is would remove the facet field from disjunctiveFacets to see if that helps too. If it does and you're using enterprise-search api connector + backend, please open a ticket in the github repo :slight_smile:

thanks!
Joe