狗蛋看了我的文章并重构了手上的项目，然而前端的重构带来的表现只停留在代码层面，上级也感受不到重构前后带来的差异。
此文简述微医前端如何优化用户体验
现状
回归到3年前，狗蛋刚踏入前端大门，他也只是个懵懂的切图仔，然而随着node和各种终端的兴起，前端在各个领域也都有了一席之地。 每个人都在想着做自动化，工程化，微服务，中间层，毕竟kpi嘛。 那些高大上的东西却让狗蛋越来越模糊，当时选择前端的初心不正是因为离用户最近嘛！
关联
为何有蚂蚁金服体验部？
用户放弃一个产品只需要1秒，加载时间每增加1秒，那都意味着金钱和用户的流失。
现在的竞品实在太多了，用户的口味也刁钻了，如果我们能帮助用户，优化流程，有良好的应用体验，价值便从技术上升到了产品层次
如果可以量化重构代码前后的数据，例如：
通过优化某块代码，优化用户30%的注册时间
具体到业务里，就是节省了用户30%的挂号时间
听起来就狂拽炫酷叼霸天，狗蛋直接走上升职加薪之路.
架构
业务单元：区别于一般埋点，由程序员自己控制，例如注册模块，从进入注册的入口到点击提交按钮结束，算完成一个业务单元
微医架构部前端团队根据在业务上的时间归类出业务单元，赋予了前端们优化的业务的能力。
吹了那么多，怎么做呢？
答案：通过AOP（面向切面编程） 的形式上报业务单元。
首先前端得了解自己的产品（这也是很多前端的不足之处，不够深入产品），关注每个业务模块的入口和出口，总结出业务的流程，在业务里埋点，计算出这个业务的整体时间并通过大数据分析出大多数用户的操作时间和习惯。
解构
找的都是网图，如有雷同纯属巧合，以下优化是纯前端完成的
案例一
操作过于复杂
通过对用户停留时间的分析，发现此业务单元过于复杂，用户总是在摸索如何使用。
优化：操作引导提示
结果： 使用时间整体前移
案例二
重复性操作过多
重复的内容过多，容易劝退用户，搜索功能筛选条件复杂
优化：快速操作、默认操纵
灵活利用localStorage,保存近期操作数据自动填充
1.记录重复性的表单
结果：流程耗时都往下降了
优化前
案例三
接口查询时间超过1s
已经优化过的接口响应时间在1秒左右，然而用户进入页面看到加载动画时间超过1s其实是可以感知到等待时间的，尤其是页面模块少的时候
利用localStorage,达到秒开的感知程度
这里的秒开是指用户等待接口相应时间并渲染界面的时间
这个操作我称之为错觉数据，保存了相对变化不大的旧数据先填充页面给用户一种秒开的错觉，之后在变更
具提要看业务的情况实施，这种方案一般在数据对用户影响不大且改变较少的情况下酌情使用，例如管理后台的表格
结果：访问量增多
其实还有很多优化的方案和需要造的轮子等待我们去开拓
收获
每个人最关心的年终考核到了，狗蛋这次利用了平台在年终汇报的时候底气十足。 他沉入业务里，对业务模块进行深入分析。
"我对用户开票流程进行了优化，剖析了用户操作习惯，优化了30%开票流程时间，并开通了快速开票入口直接降低每人1分钟的填写流程"
配合一个个趋势图，交出了领导满意的答卷
未来
微医前端们有了自己的不可替代性，也有了属于自己需要深挖的体验方向
- 符合自己公司用户体验的UI框架
- 优化自己业务的前端业务架构师
- 能与产品、UI一起剖析的大数据
- 提供具有说服力的前端晋升通道
如果觉得不错，请素质四连，点赞、关注、转发、评论，毕竟要恰饭的嘛
