技术能力

1、熟悉使用HMLT、CSS，包括HTML5、CSS3特性，熟悉DOM与BOM使用，理解W3C标准
2、熟悉使用JavaScript、Ajax开发技术。熟悉ES6+语法，掌握闭包原理及原型链继承机制
3、熟练掌握React及相关技术栈进行项目开发
4、熟练掌握React Native进行项目开发
5、熟悉使用TypeScript开发
6、熟悉使用Redux状态管理
7、熟练使用git版本管理工具
8、掌握使用Vue3、AntDesign、UmiJS进行开发
9、了解HTTP协议相关知识
10、了解webpack构建相关，了解charles等工具使用

项目经验

一、列表页用户体验优化项目
【项目背景】：
随着功能迭代和资源量的上升，列表页性能下降明显，其中用户可操作耗时95线在7s左右。华客调研：2秒内是优质的体验，三秒内客人可以忍受，超过三秒体验较差，是亟待优化的。

【项目目标】：
在保持预订CR不下降的基础上，列表页用户可操作耗时95线由7s提升到3s内

【项目成员】：
3名前端 + 3名后端 + 1名测试
个人职责：前端开发&前端技术负责人

【优化详情】
1、前期在进行性能瓶颈分析时，在各个层级建立更细粒度的埋点，并构建多维度及多渠道的性能监控与预警
2、改采用分页的交互方式，来减少首屏传输的报文量，提升传输速度
3、报文精简，对于一些冗余或未使用的字段进行前后端联合下线处理，以减少报文大小，缩短传输耗时
4、在前置页面，前端进行预请求处理，利用空闲时间，提前准备好数据，命中缓存的，可达到秒开效果，未完全命中缓存的，也可以复用请求，有效缩短请求耗时

【项目成果】：
1、用户可操作耗时95线最终降低到2.7s
2、首屏缓存命中率维持在60%以上
3、列表页到详情页的CR转化显著提升
4、该项目获得公司2021技术杰出贡献提名奖

二、前端性能优化项目
【项目背景】
APP首页、列表页、订单详情页详等预订流程核心页面的加载比较慢，影响用户体验。另外其它端对于性能监控看哪些数据没有统一定义，性能对比APP差距较大(业务涉及H5、小程序等多个渠道)。其中APP主要技术栈是React Native

【技术方案】
1、制定统一性能数据标准，建立统一性能监控
2、接入lazyRequire，实现路由维度的文件按需加载
3、js模块采用get属性的方式赋值，调整文件引用方式，以实现按需加载
4、对一些大文件按路由进行懒加载，以减少业务js加载的耗时
5、优化冗余代码，缩小包的size，减少首次加载包的耗时
6、采用渐进式方式渲染页面，来提升首屏渲染速度
7、通过数据透传的方式，优先直接展示首屏数据，其它内容实时查询，
8、首屏接口动静分离，优先保证首屏内容展示，减少loading等待时长
9、减少重复渲染，提升页面渲染速度及交互速度
10、使用GraphQL，合并请求，减少页面抖动，提升用户体验

【优化效果】
预订主流程页面整体秒开率从60%提升到90%以上

团队情况