观麦实习总结

[Gesangs]

有幸在观麦实习的195天，是不可多得的一段宝贵经历。

其中最受益匪浅的是团队所推行的三原则，是书中学不来，别人教不来的一种经验，值得不断地践行之。

1. 闭环。通俗点说是做事有头有尾，要及时反馈到位。
2. 推进。团队中合作一件事，由最难受那个人去推动，推力会更大。
3. think。跳出眼前，放眼 bigger。

团队中经常会有技术上的讨论，mobx的对什么作出反应，react的生命周期执行顺序......也时常讨论一些工作案例。得出一些很棒的点。

1. 沟通漏斗模型。
2. 交流时的xy现象。
3. 出现问题时解决问题优先（女朋友除外） ......

团队中，不同角色之间交流都有一个“适配器”。身为前端，与产品交流时，把产品所述转换为前端角度再接收。说给产品听时，转换为产品角度再输出。

观麦中所涉技术栈较广，web、原生、pc端、小程序都有。 刚来公司不久便开始接需求，接触最多的是station和bshop。

在 station 上沉迷于业务，并未作出啥可提及的贡献，比较有意思的是最后做的商城首页自定义那个需求，尝试了很多新的姿势，不过还存在很多不足之处，希望不会留坑......

bshop中花了比较多心血的应该是虚拟列表和浮层页了，搞懂背景，方案探索，一路下来雅堂给了我很大的帮助。下面说一下bshop添加这两个东西的缘由。

1. bshop中的商品列表比较重，这包括逻辑上和dom结构上的“重”。但一开始bshop是没有详情页的，不存在从详情页返回列表页，重新渲染列表页的情况，重渲染带来的另一个副作用是滚动位置丢失了。而且商品较多时，第一次渲染的时间较长，滚动体验不好
2. 我来观麦的第一个需求就是给bshop添加详情页。在开启商品详情页后为了减少列表页的render，想到给详情页赋予浮层的特点，类似于popup、dialog等模态框，这样便可以列表页和详情页同时存在了。难点在于将详情页做成浮层形式时，让其保留页面的前进后退刷新的能力，这里用到了浏览器堆栈管理。
3. 虚拟列表的加入当然是为了改善滚动和加载体验啦

再就是官网，原先的旧官网是用nodejs+ejs+mysql写的，后来改用Gatsby.js写前端页面，gitlab作为后台管理页面，效果也还不错，期间还做了一个chrome 插件方便运营更新，熟悉了建站的流程等等

还有webpack、nodejs脚本、bug排查、错误监控什么的就不说了，最后就是每天都要使用的git，学到不少骚操作。周三下午茶也很好吃，哈哈

观麦前端团队是个很棒的团队，身处其中很舒服，每个人的特长都得到发挥，很幸运与观麦同行，感谢🙏