React 服务端渲染初步尝试

查找 React 中文文档请往 https://doc.react-china.org/

简聊代码用了 React 存在, 存在加载缓慢的问题. 一些表单页面也会受到影响
于是开始尝试做服务端渲染, 方便在打开时能更快渲染页面
JavaScript 代码以 defer 模式等待页面渲染完成, 然后开始加载

脚手架和打包相关的代码我做了整理托管在 Teambition GitHub 上
https://github.com/teambition...
另外一些注意点在下边做一些笔记

服务端渲染

  • checksum 问题

React 在服务端渲染之后, 会在根节点生成一个 checksum 用于校验
同时 React 在浏览器端也会进行一次判断, 看 HTML 内容和客户端渲染是否一致
一般都用 React 不会出问题, 但是比如空白符, 或者内容不一致, 就会给出提示

  • script defer 执行

为了 JavaScript 延迟加载, 可以用 defer 属性指明, 或者直接把标签放在 后边
因为我们渲染的 HTML 是直接把 替换的, 所以用 defer 完成了功能

  • 上线之后 CSS 加载问题

实际使用虽然 Webpack 能够打包 CSS, 但是页面加载时的效果不能缺少 CSS
所以 CSS 实际上还是应该跟着 HTML 的

一起加载的
这个实际上会影响打包的复杂度, 在我的例子当中, 所以使用了一个 CSS 文件

  • 初始化数据

JavaScript 的初始化数据使用 HTML 形式的

你可能感兴趣的:(react.js)