好久没写博客了，坚持写博客真的是一件很辛苦的事情。因为总是会有各种各样的事情耽搁，真的是很佩服阮一峰和廖雪峰老师，能够坚持更新博客，日复一日。平时其实笔记随手记得还是很多的，但要统一整理到博客上，并且写出一篇好的博客，真的需要大量的时间和资料去支持，加上深刻的理解。
唉，但愿我也能坚持的久一点。
1. 渲染原理分析与对比： fer & ssr & 同构
- fer：浏览器请求url，传给浏览器的页面只有一个backbone，数据获取一般通过ajax和fetch的方式，拿到后插入dom和需要的css，注入到需要渲染位置，最终生成完整页面。
- ssr：浏览器请求url，数据在服务器端就会塞给模板，生成完整的html和样式，然后推给浏览器，直接输出页面。
fer的优势在于不用刷新页面，体验增强，但由于爬虫只会爬取第一次加载时的html，所以seo不友好，google据说可以爬js，但有墙的影响，本身用途也不大。第二个缺点是首屏时间过长，毕竟一口气加载一堆js和css肯定很慢。不过代码切割和动态载入可以弥补，后续会讲到
ssr的优势自然就是可以方便seo。缺点同上。
同构本质上就是fer + ssr的结合体，流程是第一次访问页面时是服务器渲染，拿到的是完整html，之后的渲染全部是浏览器渲染，组件是通用的。基本上弥补了fer不能SEO的缺陷，目前知乎个人页就是同构的产品。
2. 同构基础
React 为了满足服务器渲染的要求，专门提供了对应的接口。这也是同构能够产生的根源。
React.renderToString
把 React 元素转成一个 HTML 字符串，因为服务端渲染已经标识了 reactid，所以在浏览器端再次渲染，React 只是做事件绑定，而不会将所有的 DOM 树重新渲染，这样能带来高性能的页面首次加载！同构黑魔法主要从这个 API 而来
#####React.renderToStaticMarkup
相当于一个简化版的 renderToString，如果你的应用基本上是静态文本，建议用这个方法，少了一大批的 reactid，DOM 树自然精简了，在 IO 流传输上节省一部分流量。
3. 实战nextjs
文档资料：https://juejin.im/post/59f72fef518825569538ef5a#heading-24
项目实战：next-demo
东西太多太杂了，直接看代码是最快的（懒得整理了）
4. 杂食堆 – 爬坑留念
- history 缺漏
router.push 相当于浏览器前进，保留历史记录，可以后退回来
router.replace 相当于url替换，是没有记录的，无法后退回来
- decorator 装饰器\适配器
es7的黑魔法，js常用的装饰者模式的封装，也叫AOP。
应用：Mobx里observer模式,服务器端logger实现。
资料：http://taobaofed.org/blog/2015/11/16/es7-decorator/
fetch 竟然不支持IE11，操蛋啊
Mock 假数据，Mock.js + pure。
最初是通过拦截ajax提供数据。如果结合pure，可以尝试构建mockserver搭建
完美构造假数据，容易上手，方便替换。
- VSCODE的JSON的智能提示，是通过JSON schema实现的
JSON schema 可以用来验证格式，并提供一些提示信息。
- nodejs与其他语言配合有2种方式：
- 通过http或tcp协议，进行数据交换。就是通过ajax访问接口。
- 通过c++拓展调用，node-gyp是用来编译原生C++模块的，有很多包要跨平台使用，基本都是通过node-gyp进行编译实现。
- es6 查遗补漏 — 参见MDN
find — 返回符合测试函数的第一个元素值
findIndex — 返回符合测试函数的第一个元素索引
includes — 查看数据是否包含某个值。
every —- 对数组整体进行判断，如果有一个值不符合要求则返回false，全部通过才返回true
- 给package.json 上锁
- npm install –save-exact/-E
–save-exact/-E参数强制npm在package.json中写死固定的版本号，而不使用如~，^这类的范围符号
- npm shrinkwrap
npm shrinkwrap命令会在项目路径下创建一个npm-shrinkwrap.json文件。该文件中包含了当前项目中所有依赖包的版本信息。把该文件提交到git中。其他人在clone该项目执行npm install时，npm检测到该文件后会按照文件中的信息完整的还原出完全相同的依赖树。从而解决版本不一致问题
- yarn
直接yarn即可，自动生成yarn.lock文件，包含了当前项目中所安装的依赖包的版本信息。唯一的缺点就是其他人想要获得相同环境也要通过yarn安装。