how to choose between react mount/unmount vs css display/hide


I won’t go into many details at the moment since I myself don’t have a clear picture of the query.
Basically, I want to know which factors to consider when choosing between CSS’s display property and react’s mounting mechanism.

I am pressed to say the CSS technique will be faster, albeit by a few microseconds.

But I want some more input on this.

(Jakob Lind) #2

If you are using server side rendering for SEO then it makes a difference. If you have not mounted the component, google will not see it to index its content. If you on the other hand are using display: none, google will be able to see it’s content even though the user don’t see it.

One usecase where you want google to index non visible content could be an e commerce site which shows product information inside tabs. You wan’t google to index all the product information, not only the content available on page load.