负责企业级工业数据可视化平台的前端架构设计与核心模块开发，聚焦设备监控、能源分析重场景落地，衔接数据/产品/研发团队，主导技术方案选型与性能优化，确保业务价值与技术可行性

• 主导工业设备实时监控可视化模块设计，基于D3.js处理时序数据结构化展示、Three.js构建3D设备模型映射实时状态，引入WebGL纹理贴图优化模型加载速度（从3.2s降至1.1s）；同步设计自适应布局引擎，支持PC/大屏多分辨率适配，上线后客户设备故障排查时间降低40%
• 解决能源消耗分析系统大规模数据（单场景超10万点）渲染卡顿问题，采用D3数据分层策略（时间窗口聚合+空间区域划分）结合Web Worker异步计算，将渲染帧率从24fps提升至60fps；封装20+通用可视化组件库，减少重复开发工作量35%
• 推动交互体验升级，引入React Use Gesture实现双指缩放/拖拽旋转手势，结合Three.js OrbitControls优化3D场景流畅度；设计力导向图与桑基图动态切换功能，通过D3 transition API实现平滑过渡，用户交互体验评分从4.2分（满分5）提升至4.7分
• 搭建可视化测试监控体系，用Puppeteer模拟10+用户操作场景做自动化回归测试（覆盖90%核心功能）；接入Sentry监控组件运行时错误，解决Canvas渲染异常/WebGL上下文丢失问题，系统稳定性从99.1%提升至99.8%

负责金融数据可视化平台前端开发与架构优化，支撑行情走势、风险评估核心场景，主导低代码编辑器技术落地，推动团队技术沉淀提升开发效率

• 主导金融行情可视化模块重构，从jQuery+SVG迁移至Vue3+D3.js组合式API，利用Vue响应式系统优化数据绑定效率，数据更新至视图渲染延迟从150ms降至50ms；设计行情蜡烛图懒加载+数据抽样策略，支持1分钟级K线（1000条数据）流畅渲染（<200ms）
• 核心开发低代码可视化编辑器，用ProSchema定义组件元数据、Ant Design Form实现动态属性配置；基于SortableJS开发组件拖拽与实时预览功能，支持代码导出，上线后非技术人员创建可视化页面时间从2天缩短至2小时
• 解决金融可视化安全合规问题，实现数据脱敏插件（正则+掩码规则）覆盖手机号/身份证号动态隐藏；设计RBAC权限控制模块，限制不同角色图表查看/编辑权限，项目通过等保三级认证
• 沉淀《金融可视化最佳实践手册》涵盖数据预处理/组件设计/性能优化；主导每周技术分享讲解D3高级用法与WebGL金融应用，团队可视化开发效率提升25%

负责电商数据可视化平台前端开发，支撑销售趋势、用户行为场景，参与项目全生命周期管理，积累可视化组件标准化与性能优化经验

• 开发电商销售漏斗可视化模块，基于ECharts实现漏斗图与热力图联动，通过事件监听捕捉点击交互动态更新高亮；优化数据请求逻辑用WebSocket实现实时推送，销售数据更新延迟从5分钟降至10秒，助力运营及时调整策略
• 解决用户行为路径可视化性能问题，针对单用户日均100+事件数据，采用ECharts时间窗口聚合+Canvas替代SVG渲染，路径图渲染时间从3s降至500ms；设计DBSCAN聚类算法自动识别高频路径，提升数据洞察效率
• 封装电商通用图表组件（商品销量TOP10柱状图、地域分布地图），制定props规范与事件接口，团队复用率从30%提升至70%；编写组件文档与示例代码，降低新人上手成本
• 配合产品优化用户留存率分析，将饼图改为漏斗图更直观展示转化流失点，上线后留存率分析准确率提升20%，获产品与运营好评

星阅数字内容平台全链路性能优化与跨端适配项目

• 项目背景：公司核心C端产品“星阅”是聚焦数字杂志与互动绘本的平台，月活超500万，但随着用户增长，首屏加载慢（平均3.2s）、Pad/折叠屏等异形设备适配差（用户投诉率12%）成为留存瓶颈。我的核心职责是作为前端技术负责人，主导全链路性能优化与跨端体验标准化落地。
• 关键难题：① 首屏加载瓶颈：JS Bundle体积高达4.1MB，静态资源（图片/字体）未做针对性压缩；② 跨端适配复杂性：不同设备的视口尺寸、交互逻辑差异大，传统媒体查询无法覆盖折叠屏分屏、Pad手写笔交互等场景；③ 性能监控缺失：缺乏构建时+运行时的全流程性能追踪工具，问题定位效率低。
• 核心行动：1. 架构拆分：采用Webpack5 Module Federation将应用拆分为“基础框架”“内容渲染”“交互组件”3个独立子应用，共享React、Redux等公共依赖，主Bundle体积降至1.8MB；2. 加载优化：集成自动化图片格式转换工具（支持WebP/AVIF自适应），结合Intersection Observer实现懒加载，字体采用WOFF2格式并延迟加载；3. 跨端方案：基于Taro3+React Native构建多端适配层，设计“弹性布局+设备特征检测”策略（识别折叠屏分屏状态、Pad手写笔压感），覆盖95%以上设备的交互与视口适配；4. 监控体系：搭建Lighthouse CI构建时审计流程，用Sentry捕获运行时加载错误，定位慢资源节点并优化。
• 项目成果：首屏加载时间降至1.5s（提升53%），跨端适配成本降低40%（从“一端一码”改为一次编码多端运行），用户留存率从35%提升至53%；主导的“模块联邦+Taro3跨端”方案被纳入公司前端架构规范，成为后续ToC产品的标准技术栈。

星析ToB数据可视化平台配置化开发体系搭建项目

• 项目背景：公司为金融/零售企业提供ToB数据可视化平台“星析”，但原有模式依赖硬编码实现定制化需求，开发周期长（平均7天/需求），且大数据量（单页面10万+数据点）下渲染卡顿（帧率24fps）。我的职责是作为高级前端工程师，搭建配置化开发体系并解决大数据渲染性能问题。
• 关键难题：① 定制化效率低：每个客户需求都要重新编写图表组件与数据逻辑，重复劳动占比60%；② 大数据渲染瓶颈：ECharts默认Canvas渲染无法承载10万+数据点，导致页面白屏；③ 组件复用性差：团队组件库缺乏分层规范，不同项目间代码冗余严重。
• 核心行动：1. 配置化框架：基于ProComponents二次开发，设计JSON Schema配置模型（包含图表类型、数据映射、交互逻辑），通过动态渲染引擎将配置转化为页面，将硬编码占比从60%降至20%；2. 大数据优化：采用ECharts WebGL渲染器替代Canvas，结合虚拟滚动技术仅渲染可视区域数据，渲染帧率提升至60fps，解决了10万+数据点的白屏问题；3. 工具链规范：用Storybook搭建组件文档系统，定义“原子组件-复合组件-业务组件”分层架构，强制要求组件接入单元测试与文档，提升复用率。
• 项目成果：定制化开发周期缩短至2天/需求（效率提升71%），大数据页面渲染无白屏，用户满意度从4.2分（满分5分）升至4.8分；团队开发效率提升50%，组件复用率从30%升至75%；该配置化方案成为公司ToB前端项目的标准开发模式，支撑了后续10+金融客户的快速交付。

• 因痛心于年轻人对历史的疏离，我在B站创立「古人脱口秀」栏目，用职场梗解构历史事件（如《雍正皇帝的KPI保卫战》）。通过设计「颠覆认知-史料佐证-现代共鸣」三幕剧本模板，单期视频最高收获1.7万条弹幕互动。
• 两年间栏目播放量突破180万，作品被多地中学选为教学素材。这段经历磨砺出将学术内容转化为大众语言的能力，也让我理解到真实用户反馈才是创作者的指南针。