个人介绍
我是程序员客栈的 peanut张,一名 高级前端开发工程师; 我毕业于 南京金陵科技学院,担任过闪马智能的高级前端工程师; 负责过全时空路口平台,duang客户端,车型智能盒的开发; 熟练使用react,mobx,typescript,原生js,electron; 如果我能帮上您的忙,请点击“立即预约”或“发布需求”!
工作经历
2020-09-01 -2023-08-01上海闪马智能有限公司高级前端工程师
1.完成核心功能的开发,参与技术难题讨论并完成攻坚。 2.带领实习生完成部分功能的开发以及完成实习指标。 3.组织会议就代码规范,技术选型,前后端协作,分享经验等方面展开讨论于总结。 4.开发和维护公司私有的组件库和函数库,定期的发包和优化; 技术的调研、选型和落地。如:electron、qiankun、vite等;
2020-02-25 -2020-08-30上海极豆科技有限公司中级前端工程师
1.驻场保时捷管理公司并完成功能开发。 2.辅助部门经理解决开发中遇到的各种问题,并负责代码维护。 对前端代码做性能测试,性能调优等。
教育经历
2015-09-01 - 2019-07-30金陵科技学院软件工程本科
技能
项目描述:该项目是基于 Electron,React 开发的桌面级应用,通过websocket连接获取中心测产生的异常事件预警,并通过react-motion插件进行动画过渡,实现预警弹出,定时收回,展示详情等功能。 项目技术: react,electron,antd,mobx 项目成绩: 1.该项目有多个窗口:登录窗口,等待窗口,主窗口和详情窗口。一次性加载所有窗口会很耗费性能,所以我采用了分段加载的方式才渲染窗口,即登录窗口渲染时创建等待窗口并隐藏,将渲染进程的html文件注入窗口容器。显著提升了应用加载的速度,提高了用户体验。 2.项目最大的难点在于窗口可移动。因为在无预警时,需要将窗口缩为小图标(类似360小气球),移动时记录最终的位置并固定,当有预警信息时,需要窗口回到右上角并展开列表。我取鼠标的四种状态来记录位置,并通过down事件比对原有位置来区分点击还是移动的方式完成了该需求。 3.因为该应用是内网安装,所以我使用了配置文件来对应用初始化,使用node的fs模块获取文件并用ini插件解析文件内容,在渲染进程中获取配置信息。
项目描述: 该项目是基于 React 开发的车型识别系统,通过api让应用层调度算法识别车型,并将识别结果展示于页面。主要的模块有历史查询,视频采集,相机设置,系统设置,设备信息。目前数千个智能盒分布于全国各大城市。 项目技术: react,react-router,antd,mobx 项目成绩: 1.使用webpack搭建脚手架开发项目,并对webpack的配置加以优化,加入了缓存,启用了多进程编译,分离公共代码,加快了程序启动的速度。 2.历史查询模块的多个页面大同小异,所以我采用了抽离公共组件,通过不同页面的url后缀来读取对应的页面配置。减少了代码的重复,也更利于页面修改,提高了后续维护的效率。 组件和方法方面,抽离所有的公共组件,公共方法,每一个模块对应各自的组件,是的程序模块与模块之间尽量做到低耦合。
项目描述: 该项目是基于 React 开发的路口车辆检测平台,将摄像头流接入算法层进行检测分析,对异常事件进行整合消费。主要的模块有数据运营,路口管理,区域管理,报表中心。 项目技术: react,react-router,react-konva,antd,mobx 项目成绩: 1.项目在开发过程中需要封装一个canvas组件,用于绘制俯视道路图,并能通过传参的方式对道路图进行修改。通过调研选择react-konva这个库,先限定画布的大小,然后通过计算得出每条道路的位置及长度,以group为单位绘制。通过旋转进而组合多个路口。整个组件分为若干个独立模块,限定props格式,易于使用和修改。 2.页面方面,将同一板块的多个相似页面进行组件抽离,通过传入的type决定渲染内容,这样做一是减少了重复代码,二是在后期版本更新迭代时,也能迅速找到修改位置,提高了代码的可为维护性。 3.数据运营模块涉及多个数据可视化,我采用了echarts-react,以多个模块的方式封装成一整个可视化组件。并通过websocket获取实时数据,更新组件数据。 4.canvas组件导出道路俯视图后,在中心测大屏上需要有实时车辆动画。算法层给出实时点位以及横向角,我通过websockt获取车辆的实时点,然后根据横向角来旋转车辆达到动画效果。