工作经历
字节跳动 - 前端开发 (2020.11 ~ 至今)
负责客服系统前端开发,包括智能客服,表单SDK,数据看板,知识库,客服系统以及管理页面的开发;老代码重构,Vue2向React技术栈迁移；页面性能优化；稳定性治理
开思汽配 - Node中台开发 (2019.05 ~ 2020.09)
使用Hapi,Joi,Mongodb编写Nodejs中间层,聚合其他诸如会员,优惠券,促销,物流, 商品信息,订单,支付等微服务接口,为Android和IOS电商app提供BFF接口.
深信服 - 前端开发 (2017.12 ~ 2019.05)
使⽤Webpack + Vue编写私有云后台管理系统,包括虚拟机开机关闭,克隆,迁移等操作;虚拟机的磁盘,内存的分配和管理; 展示虚拟机乃至集群的运行状态如CPU使用率,内存占用率;以及其他的一些管理页面
项目经历
工单详情重构（字节跳动）
项目介绍：对客服系统最核心的工单详情模块进行重构,使用React重写Vue2代码
成果亮点：
- 在两个半月的时间内,梳理出20多个业务接口,提交1.6万行代码,上线后无生产事故。代码清晰,拓展性高,后续相关需求迭代从按周估时降低至按天级别
- 基于React Query实现接口缓存,自动拉取,失败重试,乐观修改,部分替代全局Store,简化代码的同时提升了用户体验
- 使用ErrorBoundary捕获异常并上报,在灰度阶段通过监控上报提前排查出非法的p标签嵌套导致富文本编辑报错崩溃
- 对接富文本编辑器团队,实现Mention插件,将付费的富文本编辑器完全替换成公司内部富文本编辑器
- 移动端适配,针对公司内部组建库的Cascader,Date Picker对移动端交互不友好的问题,快速实现了Cascader和Date Picker组件,实现了PC Mobile一套代码,废弃了移动端项目
性能优化专项（字节跳动）
项目介绍：对页面性能进行监控和优化
成果亮点：
- 使用react router data loader api,让由路由来管理接口请求,而不是在组件生命周期中发起接口请求,避免瀑布流
- 通过webpack bundle analyzer进行打包分析,对富文本编辑器,复杂业务弹窗等进行拆包；按路由进行拆包
- 包替换,使用lodash-es替换lodash；clsx替换classnames；date-fns替换moment；生产环境preact替代react；
- 对全局Layout中存在的笨重模块进行延迟加载
- 在组件树的内层挂载更多Suspense,实现细腻度的骨架屏
- 插入dns-prefetch link加快第三方域名解析,使用webpackPrefetch提前加载模块
- 实现页面75%分位的加载耗时从4.5s降低至3.5s
稳定性治理（字节跳动）
项目介绍：配置监控告警规则,搭建unit test和e2e,编写测试用例
成果亮点：
- 使用react-testing-library搭建unit test,编写组件的单元测试用例,实现80%代码覆盖率,配置merge代码的单元测试增量卡点
- 配置webpack插桩,统计e2e覆盖率,配置merge代码的e2e测试增量卡点；使用cypress编写了60条e2e测试用例,覆盖核心业务场景；测试用例98%成功率稳定运行；
- 配置业务接口的监控告警规则,接口异常拉群和电话通知
- 监控线上JS报错,上传sourcemap到监控平台,方便排查问题
技术博客（个人）
项目介绍：使用Next,MDX,contentlayer,sandpack,tailwind搭建了自己的技术博客
成果亮点：
- 通过server component和SSR实现站点的SEO,Performance评分满分
- 使用MDX语法进行编写,通过markdown parser解析AST实现目录功能（Table of content）
- 通过tailwind编写样式,通过css variable实现明暗主题
- 通过rehype-pretty-code实现代码高亮
- 通过rehype-mathjax实现latex数学公式展示
- 通过sandpack实现交互式demo
专业技能
- 熟悉React生态,使用过react-query, react-use, zustand, formik, framer-motion, radix-primitive, headlessui 进行需求开发
- 熟悉Next.js生态,使用过contentlayer,mdx,sandpack搭建博客
- 熟悉Vue2开发,使用过Vue router, Vuex进行需求开发
- 熟悉tailwindcss使用和自定义配置,搭建过自己的design system,写过较大型的Dashboard页面
- 熟悉Jest, React testing library, Cypress, Playwright等单元测试和e2e测试工具,熟悉测试用例编写,配置过测试覆盖率卡点
- 对计算机图形学有一定的了解,写过多线程的光线跟踪渲染器,写过shader特效,使用three.js写过较复杂动效
- 有一定算法基础,刷过100道leetcode,在知乎写了十几篇刷题博客。较好的英文阅读能力,twitter比较活跃
教育经历
- 武汉理工大学 软件工程硕士 (2014 ~ 2017)
- 武汉理工大学 软件工程学士 (2010 ~ 2014)