作为Google SEO提取时反应白页

Question

我已经在我的React应用程序上尝试了很多对SEO友好的事情，不幸的是，我只是看到一个没有任何结果的白页..这是我尝试过的事情：

（PS：我实际上是在本地构建我的应用，并使用phantomjs检查结果。）

1-在应用程序的顶部使用不同的polyfill，例如

import 'es5-shim';
import 'es6-shim'; 

import 'babel-polyfill';
import 'url-search-params-polyfill';
import 'whatwg-fetch';

2-禁用来自我的APP的所有XHR呼叫。

3-尝试尽可能简化应用程序，例如

ReactDOM.render(<div>Hello, World!</div>, document.getElementById('app'));

在这里一切正常，在我的phantomjs结果中，我看到了带有Hello，World的图像！

现在，每次我将Root组件重新导入ReactDOM.render时，我都会再次获得白页。

我没有主意，我想过可能将我的应用程序转换成SSR应用程序，但我真的很想知道如果没有它，这是否可行。听起来我的Root组件可能太“沉重”，无法按时呈现。

我可以花一些时间在上面的任何想法吗？

Answer 1

我建议您使用Chrome而不是phantomjs来测试您的页面。在Prerender.io，我们已经看到很多情况下phantomjs无法渲染较新的网站而只显示空白页面，因此我们使用Headless Chrome渲染网站，效果很好！