20200302 - 👾卓异

[vianvio]

问题列表：

1. 学习antd组件库设计，用自己的话描述antd的优劣，画一个antd的架构图配合讲解。
2. 对比antd和自己的组件库，是否有可以优化的地方？如果有，哪些地方可以优化。或是职责上有分工？如果是分工，那么怎么确定边界，如何包装？
3. 梳理一张自己的知识图谱，并标记上各个技能点的熟练度 0~5，5代表和作者一样牛逼。

[zoy-l]

Q1:

优势:

1. 周边工具有完整的闭环
2. 文档清晰 (最近更新4, 文档打开非常慢, 可能我是移动的网- -!)
3. 有一线技术支撑, 明确是中后台框架, 内部应该有很多业务实践
4. 组件覆盖大部分应用场景, 相对适合国人使用
5. 给出了框架, 也给了设计规范
   劣势:
6. 用了很多rc组件,不利于阅读和调试
7. 一些动画视觉上有点卡(hhhhh)
8. 改用hooks ? (猜测 可能考虑兼容, 时间上的成本 进行逐一改造)
   总结:
   本身对react 熟悉程度有限, 所以就不评论内部实现好与坏了😂 .. 读源码主要学到的是代码组织的方式, 其次是一些优雅的写法~ 不太明白为什么要引用rc组件而不内部实现 (猜测可能还有其它地方也用到了rc组件) . 架构一句话总结 各自维护好自己 😂.

Q2:
优化(自己的组件库):

1. Eslint, Stylelint, Cli 等配置单独抽出来 单独写成多个base NPM包 ? 疑问: 那么为什么antd没有这么做?
2. 组件再细分 某些组件再抽象出一层xxxBase ? 比如 buttonBase ?
3. 公共属性的抽离组织
   职责上分工:
   从 终端类型, 场景类型, 用户类型, 三个角度划分,
   比如antd明确是中后台框架, 终端是pc, 用户大多数是企业用户, 除开通用组件, 可以围绕后台常见的各种表单, 表格, 数据可视化 之类的进行组件扩展包装,注重功能上的方便, 引用一句话 把简单事情做复杂,把复杂事情做简单.
   自己的组件库, 是移动端, 并且是小程序, 用户是普通用户, 那么同样除开通用组件, 可以围绕小程序常用场景进行扩展, 比如常见的电商类, 商品简介, 商品规格, 提交订单栏 等一些小程序常见场景 进行组件扩展包装,因为面向是普通用户, 所以额外应该提供组件样式高度可定制的能力

最后: 本人实力有限,语言表达能力也不太好😂😂, 以上都是个人见解, 并不一定准确. 保持好奇心,共勉.

Q3:
html+css+js => 3.5
vue => 3.5
react => 2
ts => 1.5
webpack => 1.5
gulp => 1.5
node => 0.5(T.T)
http相关 => 1
测试相关 => 0 (T.T)
小程序 => 2.5
rn/ft => 0
算法相关 => 1

[vianvio]

Q1的图画的非常好，结构清晰。为什么有rc组件这部分再去看一些博客，有必要再思考一下。

Q2的目的是希望反思组件库的价值，因为大部分情况大家会因为组件库的概念而去做组件库，或者换一个说法为了复用而复用，虽然对于单一项目来说，能抽离总是好的，但是这里是希望能去细想一下，我为什么要复用，哪些地方应该再抽象一层。想明白之后，或许对Q1为什么有rc会有感觉。

Q3技能图谱太过简略了，所以这里的打分都不靠谱，打分本身不是目的，而是看你能否看清楚自己的能力，能拆解到多细本身也是一种熟练度的表现。