具备4年以上企业级前端开发经验,主要技术栈为 React,熟练掌握 React Hooks、Redux / Redux Toolkit、React Query 等状态管理方案,熟练使用 TypeScript 进行类型约束与工程化开发。同时熟练掌握 Vue 2/3 技术栈,具备 Vuex、Pinia、Vue Router 及 Element UI、Element Plus、avue2 等组件库的实际项目经验,可灵活切换双框架开发。
熟练运用 Webpack、Vite 等构建工具,掌握代码分割、Tree Shaking、懒加载等性能优化手段;熟练使用 PostCSS、Babel 进行转换与兼容性处理;熟练使用 ESLint 进行代码规范管控。
熟悉微前端架构,有 Qiankun / Single-SPA 实际落地经验,具备跨应用通信、样式隔离与资源共享的解决能力。熟悉 UniApp、React Native 及原生小程序等跨端开发方案,具备 Electron 桌面客户端打包与信创/国产系统(统信 UOS)适配经验,具备移动端与 PC 端响应式适配经验。
具备 DCIM 领域动环监控系统的前端开发经验,参与过机房基础设施管理平台建设,涵盖电力、温湿度、UPS、空调、门禁等动力环境监控模块的界面开发与实时数据展示;熟练使用 WebSocket 实现设备状态实时推送、告警联动与阈值预警,具备大屏可视化驾驶舱的设计与实现能力。
具备丰富的数据可视化开发经验,熟练使用 ECharts 实现多维度图表、2.5D 伪三维机房平面图及 ECharts-GL 三维场景;具备 Three.js 三维可视化开发能力,包括机房三维建模展示、设备点位标注、UV 贴图、法线贴图、着色器特效、射线拾取及 WebGL 上下文管理等,有大型组件 Mixin 拆分重构经验。
熟悉 HTTP/HTTPS、TCP、WebSocket 等网络协议,具备 WebSocket 实时通信与复杂并发告警系统的调试经验;具备 iframe 嵌套架构 postMessage 通信方案的设计与落地经验;具备文件断点续传、分片上传、双 Token 认证等复杂业务场景的独立开发能力。擅长公共组件封装与业务组件库建设,能独立负责从架构设计到项目交付的完整前端开发工作。
项目名称:动环3.0
技术栈: Vue 2 · Element-UI · ECharts · Avue · WebSocket · iframe postMessage · Meta2D · Three.js · Axios
项目描述:
面向工业/楼宇场景的 IoT 设备实时监控与配置平台。系统分为两端:
前台(em-web):设备状态实时展示、2.5D/3D 可视化大屏、数据分析报表
后台(manage):设备管理、视图布局配置、报表配置、系统管理
两端通过 iframe + postMessage 深度联调,实现后台"所见即所得"的前台视图配置预览。
核心工作:
① 前后台 iframe 联调架构
设计并实现 PING/PONG 握手 → INIT_CONFIG 配置下发 → IFRAME_READY 回调的完整通信协议
后台通过 iframe 嵌入前台,支持实时预览布局配置效果(控制顶部栏/左侧菜单显隐、网点切换、配置会话管理)
前台嵌入后台报表页面,实现跨 iframe 自动登录、CSS 主题变量同步注入
② 实时数据与 WebSocket
封装 WebSocketClient(心跳检测 + 断线重连),管理多网点连接状态
实现配置模式与正常模式下 WebSocket 的初始化、刷新、网点切换完整生命周期
③ 2.5D 可视化元件库
基于 Meta2D 构建独立元件库工程(em-pallet),打包产物同步供前后台引用
实现设备拓扑图可视化配置与动态状态渲染
④ 3D 场景展示
集成 Three.js(swzn-three 组件),实现三维设备场景展示
规范 dispose 销毁生命周期,防止内存泄漏
⑤ 报表系统(后台 manage)
开发多类型数据报表(平均风速、环境监测等),支持条件筛选、分页、导出
报表详情页支持测点数据多维度展示