姚智斌

项目经验

• 智能语音开发平台

  • 项目描述:

    智能应用产品开发平台,最大程度降低对话式人工智能系统的开发门槛,使无编程开发经验的用户也能快速开发出智能应用产品。 提供一套包含项目列表,作品列表,剧情,变量,监听,生成,语音合成,词组,管理界面,统计分析等页面的集中式后台系统

  • 技术栈:

    Vue3、Element plus、TypeScrip、Vite、Pinia、Echarts

  • 主要工作:

    1. 优化首屏页面性能,通过动态加载,代码分割,预加载,gzip,骨架屏等方式,整体性能提升79% 2.6s -> 0.5s

    2. AI助手开发、前端实现大模型界面、通过SSE通信,处理流式数据,完成历史对话、对话流程、敏感内容处理、预制角色功能开发

    3. 组件开发,封装修改作品表单,多功能表格,文本插入字符,剧情列表排序等组件,提升开发效率

    4. 计算md5实现作品zip大文件导入

    5. 使用了Husky、Prettier、EsLint对代码进行预检,以及commit信息检测

    6. 参与CI/CD搭建,编写yml脚本,10分钟内自动发布到测试环境

• AI数字人创作平台

  • 项目描述:

    公司用于数字人的创作平台，通过整合AI大模型与多媒体处理能力，实现文本一键生成数字人视频、真 人形象1:1克隆、零剪辑快速输出等功能。平台支持用户上传素材后自动化生成虚拟主播、营销视频等内容，广泛使用对话剧情配置意图实现多轮对话与语音测试服务

  • 主要工作:

    1. 系统首次打开经常性的比较慢，针对这个问题反馈并给出建议，并基于Webpack进行优化，采用Webpack 分包、组件懒加载、静态资源优化、精简依赖等方式，lighthouse评分从31分优化到68分，首次内容渲染 时间减少70.6%,FCP时间从3.4s减少至1s左右
    2. 剧本数据大屏开发，虚拟列表处理大量数据，scale方案适配，并封装Echarts组件
    3. 优化webpack打包速度，采用缓存，抽离，拆分，loader,plugin等手段，速度提升70.97%
    4. 前端页面操作，结合阿里/minimax/gpt,实现在剧情点中自动生成剧情，辅助作品编写，提效约55%

• 自建性能监控系统

  • 项目描述:

    一个自研的企业级前端监控平台，提供实时性能监控、错误追踪、用户行为分析等功能。服务于公司产 品，覆盖PC、H5、小程序等多端应用，帮助研发团队快速定位并解决线上问题，将前端应用的故障发现时间从小 时级降低到分钟级

  • 技术栈:

    Koa.js、Node.js、PM2、MySQL、ClickHouse、RabbitMQ、React、Vue、TypeScript、WebSocket

  • 主要工作:

    1. 性能与异常监控体系搭建
    • 搭建性能监测体系，涵盖FCP、FP、FMP、TT1、LCP等多个关键性能指标。
    • 实现了对白屏、页面崩溃、JS异常、HTTP异常等多种常见错误场景的实时监控。
    2. 性能优化与插件化改造
    • 采用了JS Snippets实现异步加载+预收集，并实现IOC,完成了插件化和SDK体积改造，将SDK首包体积从 180kb减少到65kb。
    • 采用各种优化手段，如代码分包、缓存策略优化、图像合并、首屏渲染优化及SSR,性能平均指标提升48%, QPS提升32%。
    3. 平台兼容性与数据上报
    • 支持跨平台的数据上报功能，包括Web、小程序、Hippy、Weex、React Native、Flutter等多个平台。
    • 支持无打点首屏测速、资源测速、API测速等功能，同时具备白名单机制和离线日志能力。
    

  • 项目成果:

    • 自建的监控系统已经接入超过60%的业务线，在180多个项目中运行使用，其中120多个项目的性能评分达到 了或超过了85分
    • 在工作日晚间峰值时，处理QPS可达20万以上，每日平均处理数据量超过10亿条

• 企业级后台管理系统

  • 项目描述:

    一款服务于企业内部的多角色权限管理系统，涵盖用户管理、权限控制、数据看板、工单流程等模块，支持千人级并发访问，日均PV 10W+。

  • 核心功能:

    • RBAC 权限管理：动态路由、按钮级权限控制，支持多角色（管理员、员工、访客）。
    • 数据可视化：通过 Echarts 实现实时数据大屏，支持自定义图表与数据导出。
    • 工单系统：基于流程引擎的工单流转，集成邮件/钉钉通知。
    • 性能优化：首屏加载时间从 3.2s 降至 1.1s（Lighthouse 评分 92+）。

  • 主要工作:

    1. 基于 Vue3 Composition API + Pinia 实现状态管理，封装高阶组件（如表单校验、动态表格）复用率达 80%。
    2. 基于 Vite 搭建项目脚手架，实现按需加载、代码分割、静态资源优化等。
    3. 使用 Web Worker 优化大数据量 Excel 导出性能，耗时减少 65%。
    4. 采用 Echarts 实现数据可视化，支持自定义图表与数据导出。
    5. 基于 Flowable 实现工单流程，支持邮件/钉钉通知。
    6. 实现 WebSocket 实时消息推送，配合 Sentry 监控前端异常，错误捕获率提升 90%。

  • 项目成果:

    • 项目上线后，用户规模达到 1000+，用户反馈满意度 95%。
    • 项目代码提交量达到 1000+，代码质量稳定，代码评审通过率 90%。

• 组件库的搭建与二次封装

  • 项目描述:

    公共组件开发，包含 pc 移动 二次确认弹框 选人组件 选角色组件 意见上传附件，侧边 栏等

  • 技术栈:

    vue elementUI rem flex 懒加载 webpack 自制 loader

  • 工作内容:

    调研多项目热更新打包方式 核心开发 自定义 Loader 修改 ElementUI 源码

  • 项目业绩:

    成功在项目中推行公共组件，极大节省人力成本，支持跨域与后台交互， 实现项目解耦，可以动态发布

• 移动商城微信小程序和微信公众号

  • 项目描述:

    本项目中主要是电商的相关业务，使用 uni-app，和 vue 语法快速搭建页面 和实现交互效果，具有商品管理、 商品查询、购物管理、订单管理、物流查看、支付等模块。

  • 工作内容:

    主要负责订单管理,商品等模块的代码编写

  • 项目业绩:

    • 通过封装业务组件、基础组件、UI 组件三部分,极大地提高了开发效率
    • 基于 Promise 封装了 axios，实现了参数属性自定义化
    • 基于 Vuex 封装了购物车、收藏、订单等模块的状态管理
    • 通过 less 负责 css 的样式编写,提取公共样式,采用了BEM(block__element--modifier)规范化命名