: How is Google's indexing affected by history.pushState? When should it be called? I am maintaining a single page app and I am trying to make it friendlier to search engines. The way the page

Posted in: #Ajax #CrawlableAjax #Html5 #Javascript #SinglePageApplication

I am maintaining a single page app and I am trying to make it friendlier to search engines. The way the page works is that when a user clicks on an internal link, an AJAX request is made to fetch new content and then the DOM is updated to display the new content. My job is to add a history.pushState somewhere so that search engines know when the state of the page has changed. Right now, I am experimenting with the following order or operations:

await fetchNewContent(...);
updateDOM(...);
history.pushState(...);

My thinking is that history.pushState should be called after the page has been made because search engines index the snapshot of the page at the time this function is called. The problem is that I am not sure that search engines work that way, and putting the asynchronous fetchNewContent first, complicates the logic of my code. It would be nice if I could write my code in the following way:

history.pushState(...);
await fetchNewContent(...);
updateDOM(...);

The thinking here is that the search engine will see that some js code is still running after the call to history.pushState and wait for that code to complete before indexing the page.

What are there the best practices here? Does Google have any public documentation about this?

10% popularity Vote Up Vote Down