想提升网站排名？试试这几个react seo方法！

最近公司让我搞一个React项目，说是要给公司官网引流，这不就得考虑SEO嘛大家都知道，React 这类单页面应用（SPA）对搜索引擎不太友爬虫来的时候，看到的就是一个光秃秃的 HTML 结构，啥内容也没有，这哪行！

我就开始琢磨，怎么才能让搜索引擎更好地抓取到我们页面的内容？

折腾的开始

刚开始，我真是两眼一抹黑，啥也不懂。就在网上到处搜资料，看来看去，发现大家主要推荐两种方法：服务器端渲染（SSR） 和 静态站点生成（SSG）。

一开始我看到这两个词儿，头都大。啥是服务器端渲染？啥又是静态站点生成？听着就很高大上，感觉很难搞的样子。

深入研究

没办法，为完成任务，我只能硬着头皮继续研究。我发现，原来服务器端渲染（SSR）就是在服务器上就把 React 代码跑一遍，生成完整的 HTML 页面，然后再把这个页面发给浏览器。这样，搜索引擎爬虫来的时候，看到的就是一个内容完整的页面，就能顺利抓取。

而静态站点生成（SSG），更直接，它是在你构建项目的时候，就把每个页面都生成好静态的 HTML 文件。用户或者搜索引擎访问的时候，直接就返回这些静态文件，速度飞快，而且对 SEO 也非常友

选型和实践

看到这里，我心里大概有数。考虑到我们公司官网的内容大部分都是静态的，更新频率也不高，我觉得静态站点生成（SSG）更适合我们。而且我还发现一个叫 * 的框架，它既支持服务器端渲染（SSR），也支持静态站点生成（SSG），简直太棒！

于是我就开始用 * 来重构我们的项目。* 用起来还挺方便的，按照官方文档一步一步来，很快就把项目跑起来。我特意看一下生成的 HTML 文件，果然，每个页面都有完整的内容，这下搜索引擎应该能抓取到！

优化之路

• 为保险起见，我还做一些其他的优化：
• 我把一些不常变化的内容，比如页头、页脚之类的，单独提取出来，避免重复渲染。
• 我还用代码分割，把一些不重要的组件，延迟加载，这样可以加快首屏加载速度。
• 我还启用 Gzip 压缩，减小文件体积，进一步提升加载速度。
• 对网站的图片进行压缩处理。
• 在内容中自然的添加关键词。

经过一番折腾，我们的 React 项目终于对 SEO 友好。看着网站的访问量慢慢涨起来，我心里别提多高兴！这回的经历也让我学到很多东西，以后再遇到类似的问题，我就不慌！

如果你也遇到 React 项目的 SEO 问题，不妨试试我说的这些方法，希望对你有所帮助！