项目经验

欧恒宇亚马逊电商ERP系统 2023.06-至今

项目介绍：企业选品管理、产品计算、禁品警告、ASIN记录

技术选型：vue3-elementPlus-admin、pinia、vite、typescript

技术描述：

1. 基于vue3-elementPlus-admin框架重构设计，删除不必要功能。
2. 基于winscp和nginx进行项目部署。

金山街道综合网格治理系统 2022.10-2023.01

项目介绍：以百度地图GIS绘制和Echarts数据可视化形成的街道管理系统，社区管理员通过地图标注任务点进行监视、派发任务，以及任务数量、状态统计观察。

技术选型：Vue2、elementui、Echarts 、百度地图API、EasyPlayer.js。

项目亮点：

1. 针对请求过多导致的⻚面卡顿和请求资源浪费增加服务器负担，如列表获取最新数据按钮和输入框输入获取关键字节点，这
   些问题都做了防抖函数处理且封装成自定义指令。
2. 百度地图点聚合过多导致的地图拖拽卡顿，在低性能的计算机愈加明显，后续通过MarkerClusterer以优化渲染方法，至少提
   高50%的性能。
3. 项目庞大导致的项目启动慢，通过hard-source-webpack-plugin插件进行冷启动缓存化，原启动时间一分钟到一分钟半，优化后
   平均启动时间40秒。

技术描述：

1. 基于vue-json-excel再封装组件完成报表导出功能(excel)。
2. 完善全局自定义指令功能：权限级按钮、模块，按钮防抖、输入请求防抖。
3. 通过插件式结合JSX开发命令式组件：自定义Toast消息。
4. 百度地图API平面地图绘制、开发点面线聚合绘制工具且数据保存渲染，引入MarkerClusterer优化点聚面带来的⻚面性能问题。
5. Echarts 可视化模块，重复性模块工厂模式封装。
6. 使用 EasyPlayer.js接入h.265格式视频播放推流，实现部门单位监控实时播放。
7. 针对项目预编译启动进行架构优化，节省了半分钟的启动时间。
8. 文件切片上传开发，实现上传断点续点缓存。

福州仓山区街道综合网格治理微信小程序 2022.10-2023.01

项目介绍：根据福州金山街道政府需求开发的便⺠服务小程序，设计多个角色逻辑权限控制：居⺠问题上报、管理人员问题处理或者派发。

技术选型：Uni-App、Vue2、UView。

技术描述：

1. 接入微信地图功能。
2. 实现订阅消息接口接入，相关业务操作后不同角色收到微信消息通知。
3. 用户体验优化：实现分包处理对首屏加载优化和包大小限制问题。
4. 根据外部扫码（单位码）传入的参数，识别跳转到单位信息。开发程序扫码功能。
5. 对系统代码进行合规检查减少业务重复代码，增强可维护性。
6. 列表元素较多而导致的⻚面性能明显下降，通过虚拟列表方案优化⻚面性能并封装组件全局共用。
   

龙腾五链运司机APP 2021.05-2022.12

项目介绍：面对网络货运业务而设计的移动端 APP ，功能面向承运人司机提供选单和装卸货操作，为货主方提供货物资源管理。目前已在华为、OPPO 应用市场 (Android 平台)，App Store（IOS ）上架，用户使用量达到数千人。

技术选型：Uni-App、Vue2、UView、百度地图API。

技术描述：

1. 负责项目基础架构构建，便于衍生多套同业务App项目。
2. 百度地图API实现地图渲染和运输轨迹绘画。
3. 用户体验优化：实现分包懒加载首屏加载优化、骨架屏、空状态，实现列表虚拟滚动优化列表⻚面性能，通过H5+原生方法api 对证件图片进行压缩处理且封装化，优化上传性能。
4. 阅读第三方 SDK 文档嵌入：交通运输部网络货运定位上报 SDK2.0；APP 保活防后台杀死 SDK（Android、IOS）。
5. 对系统代码进行合规检查减少业务重复代码，增强可维护性。
6. 解决Android和ios相关兼容性问题。

业绩:
对于Uni-App生态进行了从0-1的探索，基于Uni-App开发及打包Android和Ios应用进行了研究，为公司今后的APP业务打造了基础，同时也完成了本项目的交付上线，用户使用量达到数千人。也负责了后续的应用完善和性能优化，提升用户访问度和留存度。

厦门泰呈铝业官网 2022.10-2022.11

项目介绍：为厦门泰呈铝业有限公司需求而开发的前台官方网站。

网站地址 泰呈铝业(https://www.taichengly.com/html/index.html)

技术选型：jQuery、Swiper7、Animate.css、Nginx、WinScp。

技术描述：

1. 基于swiper7和animate.css，实现⻚面UI动效。
2. 媒体资源压缩，减少项目体积。
3. 完善PC端和移动端的响应式布局处理、国际化功能。
4. 服务器、ssl证书购买，结合nginx和winscp完成项目部署。
5. 完善基本的SEO优化规范，确保提高网站的曝光率。

港务海运网站 2022.07-2022.10

项目介绍：为厦门港务海运有限公司需求而开发的前台官方网站。

网站地址 港务海运(http://www.xmpmarine.com/)

技术选型：jQuery、Swiper7、Animate.css、Echarts、KindEditor.js。

技术描述：

1. 基于swiper7和animate.css，实现⻚面UI动效。
2. 通过媒体查询和Rem布局为不同设备分辨率实现响应式布局。
3. 结合Echarts和DavaV.GeoAtlas实现多种地图布局（中国地图、省份地图）。
4. 后台维护模块构建KindEditor富文本插件，便于客户针对网站内容自行维护修改。

测查查微信小程序 2020.05-2020.07

技术选型：原生微信小程序

技术描述：

1. 微信一键登录获取手机号开发。
2. 微信支付功能开发。