浅谈RSK_Mobx_SSR整个改进过程

这是一个以RSK为基础,准备为实际项目使用的seed

先干掉了GraphL那套和facebook验证那套

整合mobx

mobx的整个过程并不费劲,基本就是对组件的改写,和store的分离
基本采取的是单例store,让大家基本可以沿用原来的基本MVC思路来写,完全舍弃setState,不可变数据那套,也没有使用provider来全局注入

基本优化

  • 路由使用require.ensure 来按需
  • webpack的配置,单独生成common.js
  • eslint的配置修改

SSR 优化

  • 脚手架其实是有ssr能力的,但没有页面直推的代码,随意要对其改造
    • 真对不同路由所需要的store,对store的内容进行html里的注入
    • client端要获取同步的state

      为此,设定了基本的规则,每个store都要有initial 和clear方法

脚手架有个问题就是在异步的路由里的请求会做两次,为了避免这个问题,每个store还需要一个synced属性标记,当然在client端的时候要恢复这个属性值,以便从前端路由访问的时候可以正常请求

扩展性的实验

  • 引入lodash
  • 引入reChart
  • antDesign引入 - 但是css引入有问题,应该和自带styleWith的loader有关系

组件练习

  • 写了一些HOC,并且有的需要的改写成decorator的形式,感觉蛮受益的

值的么?

  • 速度优化有限
  • 开发体验受限,很多代码要注意,否则你会经常见到server端和client不一样的错误
  • 路由里的数据处理是千万注意

Repo:https://github.com/dreambo8563/RSK