负责企业级数据可视化平台的前端架构设计与核心模块开发，聚焦复杂数据场景下的可视化交互落地与性能优化，支撑金融、零售等行业客户的定制化数据展示需求

• 主导设计基于D3.js+WebGL的混合渲染架构，解决10万+数据点场景下的渲染卡顿问题——通过分层策略将静态背景（如网格、坐标轴）用WebGL GPU加速渲染，动态交互元素（如数据点 hover 效果）由D3.js处理，同时引入数据抽样算法（LTTB）降低渲染负载，最终实现60fps稳定帧率，支持10万+数据点实时 pan/zoom 交互，客户项目交付周期缩短25%
• 为核心金融客户定制实时行情可视化看板，基于ECharts扩展机制整合WebSocket实时数据流——针对多指标（股价、成交量、换手率）联动时的性能瓶颈，采用“数据压缩+防抖触发”策略：仅传输指标变化量而非全量数据，且联动请求延迟500ms以上才执行，最终看板响应时间从500ms降至100ms，支持12个指标同步联动无卡顿，客户续约率提升30%
• 开发拖拽式可视化配置工具，基于Vue3组合式API+SVG技术实现组件自由拼接——为平衡配置灵活性与易用性，设计“schema驱动”配置模型，预定义22个行业通用图表组件（如金融K线、零售热力图）及配套交互规则，用户通过拖拽即可生成看板，配置时间从1小时缩短至10分钟内，该工具成为公司标准化交付工具，覆盖80%中小客户项目
• 优化移动端可视化页面性能，针对iPhone 12及以上机型内存限制，用Canvas替代DOM渲染核心图表，结合Web Worker后台处理数据聚合——通过对象池复用Canvas绘制上下文，分块加载10万+数据点（每块5000点），最终移动端首屏加载时间从3s降至1.2s，内存占用减少35%，iOS端崩溃率从8%降至1.5%

参与企业可视化平台的基础功能迭代与客户项目交付，聚焦数据可视化的落地实现与客户需求转化，积累零售、制造等行业可视化场景经验

• 负责零售客户销售趋势看板开发，用ECharts+D3.js实现多维度数据交叉展示（时间×地区×品类）——通过ECharts的option链式调用封装钻取、联动功能，支持点击地区下钻至城市粒度，同时更新品类占比饼图，帮助客户快速定位华东地区Q3家电品类销售额下滑原因，项目验收评分9.5/10（满分10）
• 用TypeScript封装通用图表组件库，包含折线图、柱状图、热力图等15个组件——定义统一的props接口（如data、options、onClick）和事件回调（onDataChange、onHover），解决之前组件复用性差（仅30%）的问题，团队开发同类功能的时间从2天缩短至半天，组件复用率提升至80%
• 解决低版本浏览器兼容性问题：针对IE11下SVG渲染错位、D3.js的d3-scale模块报错，采用Babel转译+core-js polyfill，同时自定义兼容层函数重写d3-scale的linearScale方法，将兼容性问题频率从每周10次降至每月1次，客户投诉率下降70%

协助完成可视化项目的基础开发与测试，学习数据可视化技术与行业场景应用，逐步承担小型项目的可视化模块开发

• 参与教育客户学生成绩可视化项目，用D3.js实现成绩分布直方图与进步曲线——通过d3-scaleLinear定义分数区间，d3-axisBottom生成x轴，结合requestAnimationFrame优化时间轴滚动流畅度，解决滚动时卡顿问题，项目按时交付，客户反馈“图表清晰呈现学生进步趋势”，成为部门教育行业标杆案例
• 协助优化可视化页面响应式设计：用Bootstrap栅格系统+媒体查询，调整ECharts图表的大小与布局——针对移动端屏幕小问题，设置768px断点，将图表宽度设为100%并缩小字体，确保移动端可视性，最终PC端与移动端显示一致性达98%，解决了之前移动端图表溢出的问题
• 编写可视化模块单元测试：用Jest+Vue Test Utils覆盖D3.js数据绑定、ECharts配置更新等核心功能——设计边界值测试（如空数据、极端值）与异常场景测试（如数据格式错误），测试覆盖率从60%提升至85%，后续迭代中此类功能bug率下降30%

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

• 项目背景：公司核心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+金融客户的快速交付。

支教时发现乡村小学因缺乏实验器材，科学课多停留在课本讲解。返校后联合实验室开发出百元级科学实验背包，内含20个基础实验器材。为确保可持续运营，设计配套视频课程与城乡结对系统，并培训132名大学生担任远程助教。项目覆盖9省47所学校后，学生科学兴趣评分提升35%。这段经历教会我用产品思维解决社会问题，当看到孩子们用自制望远镜发现土星光环时，我理解了教育的真谛是点燃可能性。