如果你在玩《剑网3缘起》，你会发现游戏有一个内置社区。虽然这个应用是个 CSR，但是会发现加载并不慢

而且这些都不是事后优化。所以正好可以分享一些可能对其产生作用的习惯和做法，或者说开发时可以注意的地方

TL;DR

总之就只有一个目标：尽量砍掉第一次加载的大小和尽量减少加载所需要花费的时间

• 减少加载体积
• 懒加载/延迟加载：利用 import/export 做代码分段
• 充分利用 http2 和 vite（开箱即用版 rollup ）
• 非常巧合的做法，指跟 React Beta 版文档异曲同工

以下全是暴论

这是一个发生在今年的对话：

Q：组件通信有几种方式？
A：balabalabala（无非 props, provide/inject，vue 还有 $parent/$children
Q：还有吗？
A：postmessage 可以算吗
Q：也行，还有吗？
A：localStorage/sessionStorage 可以算吗？
Q：算半个，还有吗？

这 TM 不就这些方式还有吗？

回来一拉清单，各家文章盘点确实还多了一个：EventBus

无图版，会更有图版

背景

上篇文章（最近总是莫名联动）才写了 electron，主观感受，electron 有这么些好处：

• 使得前端技术可以运用在本地桌面应用
• 跨平台
• Chromium 让兼容性不是首要考虑对象
• 通过 NodeJS 既可以操作系统，也能利用本身能力与生态

但是：

• 我好像不需要跨平台
• 原生开发更加能操作系统 API
• 扯破大天不就是webview嘛
• 依然不需要考虑兼容性，并且体积会大幅减小

所以，electron 再见！

思路

有个做广告设计的朋友，自己开个小工作室，平时接些小广告设计维持生活。但总会遇到一些甲方拿着某个站点的图片，让他用这个图片给他做广告牌或者海报。就这样，作为老切图仔就一直在帮他「从网站里拿出图片」这种脏累活。想着是不是可以干脆送他个工具，这样他就可以自己玩了
（不是很推荐这种操作，但是毕竟要恰饭要苟活，而且这种外包单，甲方是这样的）

想了一下，切图仔唯一高效 GUI 的选型只有 electron 了，没得选。但是这次有点特别，因为 electron 的特殊性，我有了些想法

electron = node + chromium，都有个完整浏览器了 484 不需要无头就可以加载 remote 然后直接获取资源？

这里用的模板是之前实验服务一体化的模板 electron-react-koa-template，然后删除了server…

删了server……

TL;DR

• webview
• 获取资源
• 提供下载

Gatsby 比 Hexo 更像一个通用框架，关于博客的工具真是全靠社区衬托。Nlvi 迁移遇到了标签云和分类等各种问题，还有一个多语言问题…

找了一圈插件，i18n 大多数方案都是「一个站点同时多语言」，这对一个博客来说没必要啊（相对来说我博文是不是也得写个几份…），想了一圈好像也没必要上react-intl，直接手作一个吧 —— 按照**「好看的皮囊千篇一律」**写一个

但是主题毕竟是要开源的，所以如果有好兄弟萌觉得 i18n 处理不行，自行替换成 gatsby-plugin-i18n 或者 react-intl 就可以了

这问题真的是土到我了，立刻就发了一个知乎想法。但后来我发现，他会不会想问的是几百年前，在盘古开天辟地之后的react 0.x时代，于是我默默把想法干掉了。

如果是createClass和extends React.Component，还有点意思。如果是functional component，那您怎么不用同样很「渐进式」同时又更牛逼的vue呢？

简单对比：

其中对我来说，这两个的区别可能mixin最有意思

事出有因，写 rabbit 的时候，一条单测出了问题

Reducer _object returned undefined during initialization.

想来必然是 reducer 缺少默认的 state 所致，但是我的单测是从 dva 直接拿过来改改就用的，应该不会出现问题，所以一定是哪里出了差错。后面发现了，虽然 dva 可以接受 reducers 是空对象，但应用运行起来有一样问题。

主要是这个问题无伤大雅，model 不会出现只有 reducers 这种情况。我也给出了解决：构建 reducer 给一个默认 state 顶着（但我认为一个 model 应该强制存在 state）

显然这次并不想讲这个，而是想理解 combineReducers