Usung Instantsearch.js Server-Side rendering with PHP

Although you care more about react users and ignore those who use instantsearch.js, there are still these “old school” developers in some places :slight_smile:

In order for Google to read the content, we need to load the HTML on the Server-Side. I did something like this for this.

$client = SearchClient::create( '', '' );
$index  = $client->initIndex( 'index_name' );
$hits   = $index->search( '' );
const search = instantsearch({
  indexName: 'index_name',

    container: '.hits',
    templates: {
      item(hit, { html, components }) {
        return html`
          <h2>${components.Highlight({ attribute: 'name', hit })}</h2>

But there is a problem here. Because instantsearch.js replaces the first HTML that I loaded with PHP. I don’t think this is a good idea, I think there should be a feature for Server-Side rendering that doesn’t replace the first loaded content. Or maybe there is, so I need your help.