1、性能优化:首屏白屏时间过长，增加loading状态动画，减少用户焦虑。 2、封装热更新组件，使得用户在局部刷新时，页面的信息不会丢失,以及对 app 版本更新进行控制 3、在头部添加立即执行函数根据页面的宽度动态计算font-size，实现页面的多端适配 4、使用 webpack 对该项目图片、js、css 等文件进行打包压缩。 5、安卓、IOS 等各个系统版本之间的相互兼容,代码高可用

1、配置脚手架，启动命令，proxy劫持 2、路由权限，路由守卫，规则的适配 3、封装上传下载表格导出等公共组件 4、css优化使用less变量抽离项目公共部分样式统一管理

1、自定义底部样式，适配iphoneX以上机型底部小黑条的安全区域 2、性能优化：将首页的小图标用iconfont替换，减少图片请求次数，使得首页的加载速度提升25% 3、使用 input 组件的 cursor-spacing 属性解决项目中输入框被键盘遮挡问题 4、小程序首页打开速度比较慢，使用分包技术大幅优化项目容积,整项目使用组件化模式 解决方法： 将小程序进行分包技术处理，将首先需要加载的内容放在主包，其他包进行按需加载，大大提升小程序首屏的加载速度，整体加载提升30% 5、只能客服模块中，在网络不佳的时候，原生API会出现断连情况，导致不能够及时的进行通讯，影响用户体验 解决方案： WebSocket通讯模块，采用心跳重连的方案防止连接意外断开 废油app（集油汇AppStore上架） 使用技术： uniapp 项目职责： 1、性能优化:首屏白屏时间过长，增加loading状态动画，减少用户焦虑。 2、封装热更新组件，使得用户在局部刷新时，页面的信息不会丢失,以及对 app 版本更新进行控制 3、在头部添加立即执行函数根据页面的宽度动态计算font-size，实现页面的多端适配 4、使用 webpack 对该项目图片、js、css 等文件进行打包压缩。 5、安卓、IOS 等各个系统版本之间的相互兼容,代码高可用 数据可视化大屏 Vue2 Echarts vuex axios websocket 技术实现： 1、Echarts可视化图表展示，以图表形式对数据进行展示，强化数据分析与直观性，并使用 wesocket 技术实时获取后台信息，做到动态刷新图表信息的功能。 2、大屏适配是需要将原有的px单位弃用，改用计算出的rem为单位，将整个计算公式封装成为公共函数，在各组件中可以更方便的使用，为整个开发进度提高了效率。 3、在大屏布局中采用了Grid布局，对于样式的编写代码减少了很多，提高了代码的简洁度和后期维护的效率。 4、自定义图表： 根据UI设计图对Echarts图表进行修改和二次封装，只需要传入固定模版的数据即可渲染成所需要的图表，并可自定义颜色（例如柱状图、雷达图、折线图等）。 5、DataV大数据的渲染： 通过多家第三方提供数据，进行数据筛选、切割和重新组装，运用到不同大屏显示，实现大屏切换模块时不同组件的数据渲染。 张海铭 - 前端工程师 男 *：15545689799 *：zhm15545689799@163.com 工作经验：2年 现居：北京 专业技能 1、2 年前端开发经验、主要使用Vue框架进行开发，并有React项目开发经验，共开发过 10+ 项目 2、常用组件库：Antdesign、ElementUI、VantUI、uview、iview、bootstrap 3、具有uniapp跨端开发经验、*小程序、大屏可视化开发经验 4、熟练使用Git进行版本控制 5、对前端性能优化有所实践、封装多套组件服务于公司内部 6、阅读英⽂⽂档⽆障碍，善于外⽹翻阅资料，解决问题 工作经历 慧生活信息技术有限公司（2023-11-今） 比邻无线(北京)科技有限责任公司 web前端开发 （2022.09-2023.07） 1、负责公司产品前端开发和功能逻辑实现 (h5 端、小程序，管理后台等)； 2、负责项目的维护，包括增加新功能、修改问题及相关优化; 3、对所开发的组件与调用方法,进行二次封装;提高工作开发效率； 4、对移动端与pc端页面通过标准校验，兼容各主流浏览器与*浏览器 上海鸿冠信息科技股份有限公司 前端工程师 （2021.05-2022.07） 项目经验 商业信息管理云平台 使用技术: vue2 Axios gzip ElementUI Less 项目职责： 1、配置脚手架，启动命令，proxy劫持 2、路由权限，路由守卫，规则的适配 3、封装上传下载表格导出等公共组件 4、css优化使用less变量抽离项目公共部分样式统一管理 IOP营销管理(PC) 使用技术： vue2 Vue-router Vuex Axios ElementUI Less 项目职责： 1、产品目录中进行渲染数据的时候导致用户操作卡顿，采用虚拟列表进行处理 2、封装上传文件模块，并对大文件进行分片上传，断点续传 通过获取文件大小，判断是否切片，通过Blob.prototype.slice进行文件切片，这样从原本的大文件，变成多个小的文件切片；使用new FormData储存文件数据，利用webpack-worker开起worker后台线程使用spark-md5进行全量加密,传到服务端做比较，实现秒传 3、因部分数据较为敏感，开发水印功能，很好地解决公司信息安全问题，也能够很好地进行问题溯源 4、目录结构优化、图片压缩、CDN 加速、CSS 分层、Promise 解决打印流程回调地狱问题 5、借助 webpack-bundle-analyzer 插件分析项目中各模块大小，结合组件按需加载、删除冗余代码、接入共享包等手段进行优化，使包体积减少 25%。 6、项目启动时间过长： 优化方案： 项⽬从webpack迁移到Vite，提升开发时的启动和编译速度。项目启动时间由原来200s缩减为25s 新版运营平台项目 使用技术： vue3.0 arco ts 项目职责： 1、使用 @dragstart、@drop、@dragover 实现动态拖动组件功能；使用融云第三方实现即时通讯功能； 2、儿童量表上传模块中需要一次性展示多张用户上传的原图，方便用户进行勾选预览，图片太大会导致打开较慢，影响上传速度。 优化方案∶ 图片列表采用缩略图，同时预加载原图，这样在大图模式下查看时就可以直接从缓存中获取图片 效果︰ 大图模式由原先1~2S的加载渲染时间优化为基本秒开，提高了查阅效率。 3、处理api 调试、处理全局数据管理、处理不同测试环境项目打包 4、封装文件下载模块，使用 post 请求进行文件下载，统一处理请求异常，减少 window.open 的滥用 5、抽离项目基础模块和通用组件作为新项目的框架，并编写cli工具自动生成新项目 6、首屏优化：出现加载时间长，对用户体验不佳，使用webpack-bundle-analyzer对包进行分析，并进行了如下的加载优化： 打包时对打包的文件进行压缩 webpack配置externals使库文件采用CDN加载。路由懒加载、组件库按需加载 开启gzip压缩 伊利现代智慧健康谷（*小程序） 使用技术： uniapp uview 项目职责： 1、自定义底部样式，适配iphoneX以上机型底部小黑条的安全区域 2、性能优化：将首页的小图标用iconfont替换，减少图片请求次数，使得首页的加载速度提升25% 3、使用 input 组件的 cursor-spacing 属性解决项目中输入框被键盘遮挡问题 4、小程序首页打开速度比较慢，使用分包技术大幅优化项目容积,整项目使用组件化模式 解决方法： 将小程序进行分包技术处理，将首先需要加载的内容放在主包，其他包进行按需加载，大大提升小程序首屏的加载速度，整体加载提升30% 5、只能客服模块中，在网络不佳的时候，原生API会出现断连情况，导致不能够及时的进行通讯，影响用户体验