为解决SPA的SEO问题而实现的预渲染器。
目前流行的SPA应用存在SEO不好的问题，虽然提供了一些SSR和SSG方案，但都存在一些弊端，想要做到稳定高可用绝非易事。
将组件渲染逻辑从客户端改到服务器执行，计算资源的成本必须考虑在内
Most importantly, SSR React apps cost a lot more in terms of resources since you need to keep a Node server up and running.
与客户端程序相比，服务端程序对稳定性和性能的要求严苛得多，因此这里考虑在客户端将SPA的地址结果预先渲染为静态结果文件。然后在接收到访问请求的时候通过UA判定请求是否来自爬虫，选择访问真实的SPA内容还是rendify生成的静态结果（例如使用nginx来做）。
比如你正在编写一个SPA应用，然后希望生成当前react的静态页面，易于SEO，可以使用prender-gen。
rendify-gen [options]
Options:
-d, --dir [dirname] 读取指定文件夹中的rendify.json中的路由配置，默认是执行rendify-gen命令所在的路径
-
打开自己的项目目录。
-
本地启动项目服务。
比如你的项目gameApp是使用create-react-app创建的，一般可以在目录gameApp下执行npm start开启*http://localhost:3000*服务。
- 新建一个配置文件，内容是静态结果文件存放路径和地址的映射。
例如可以在项目gameApp根目录下创建一个rendify.json文件，填入如下内容。
{
"./build/shtml/home.html": "http://localhost:3000/home",
"./build/shtml/playground.html":"http://localhost:3000/playground",
"./build/shtml/setting/role.html":"http://localhost:3000/setting/role",
"./build/shtml/setting/music.html":"http://localhost:3000/setting/music"
}- 在当前路径创建另一个终端，运行npx rendify-gen命令。
./build/shtml/home.html等文件就会被创建，里面的内容是浏览器访问*http://localhost:3000/home*后的*静态结果*。
这些静态结果文件后续可以放入服务器，比如使用nginx配置，当访问来源于搜索引擎的爬虫，则提供这些静态结果文件。当不是搜索引擎的爬虫的时候访问的时候，提供正常的SPA主文件（一般是index.html）。
这里提供一个nginx配置的例子:
server {
location / {
index index.html;
try_files $uri @rendify;
}
location @rendify {
set $rendify 0;
if ($http_user_agent ~* "googlebot|bingbot|yandex|baiduspider|twitterbot|facebookexternalhit|rogerbot|linkedinbot|embedly|quora link preview|showyoubot|outbrain|pinterest|slackbot|vkShare|W3C_Validator") {
set $rendify 1;
}
if ($args ~ "_escaped_fragment_") {
set $rendify 1;
}
if ($http_user_agent ~ "rendify") {
set $rendify 0;
}
if ($uri ~* "\.(js|css|xml|less|png|jpg|jpeg|gif|pdf|doc|txt|ico|rss|zip|mp3|rar|exe|wmv|doc|avi|ppt|mpg|mpeg|tif|wav|mov|psd|ai|xls|mp4|m4a|swf|dat|dmg|iso|flv|m4v|torrent|ttf|woff|svg|eot)") {
set $rendify 0;
}
resolver 8.8.8.8;
if ($rendify = 1) {
proxy_pass http://render_server/render/$scheme://$host:$server_port$request_uri;
}
if ($rendify = 0) {
rewrite .* /index.html break;
}
}
}
rendify-render会启动一个koa服务，默认端口为8900，可以爬取到其他页面的静态内容并展示。例如http://localhost:8900/https://www.book.family.ink/webgl/basic
GET http://localhost:8900/https://www.book.family.ink/webgl/basic