Fast initial load of dynamic pages with Meteor and React

From experience, the blinking problem (white-screen flicker) is caused by the following in a component:

React render -> componentDidMount -> query data -> callback with results -> setState with the results -> re-render

We solved this issue by ensuring that componentDidMount will not run any data query function because the state already has the data from the SSR page. Without data query, no setState, no re-render. Therefore, it is just hydration in the initial load.

2 Likes