The question reads:
“The cached React pages show a blank page. How should the React pages be coded with SSR to make them Googlebot-friendly?”
A cached URL is a snapshot that shows what the URL looked like when Googlebot last crawled it.
Googlebot may have encountered a problem crawling a cached page if it appears empty or missing content. However, this is not always true. Mueller explained that Google's cache does not capture the HTML elements.
Google can cache JavaScript, but catching JavaScript can be hindered by browser restrictions.
Google's cache displays HTML Only
Mueller states that it is difficult to get cached JavaScript pages.
This is not being said from a technical perspective but a security perspective. Web browsers place restrictions on the content that can be accessed, and they may also block JavaScript file requests from websites other than Google's cache.
Google Search may keep a copy of an HTML page downloaded from a server and show it to users as a cached page. This is just the HTML page.
It can get a bit more complicated for JavaScript-based websites. There are some restrictions regarding how content can be accessed via a page because of browser security.
Browsers can block requests from other websites that require JavaScript files. In this case, the cache of Google comes from the other website.
This means that JavaScript-based websites may show an empty or incomplete page when viewed from Google's cache. This is normal and does not indicate a problem ."
Although an empty page in the Google cache might seem discouraging, it is what matters most for search: how the page is indexed.
Google can process JavaScript independently and index the page according to how users view it.
Mueller continues:
“Google will process JavaScript separately for indexing and attempt to index what a user would view when they visit your site directly. If you need to double-check, this rendered page can be seen in Google Search Console’s test tools.
Google can index and render JavaScript-based websites’ content without a problem for the most part. It’s not unusual for a JavaScript-based website to have a cache view that is incomplete or empty, and it’s not a sign of a problem.”
