个人简历 - CosmicCard

北京幂律科技有限公司

⚡ 高级前端工程师 📅 2023.10 - 至今 🏷️ React + TypeScript + Ant Design

为企业提供智能合同管理与法律服务解决方案，支持多租户定制化交付（https://powerlaw.ai/）

工作内容

主导合同管理系统（CLM）的前端架构设计与开发，为多家合作企业提供定制化的合同全生命周期管理方案
基于 React + TypeScript + Ant Design 搭建可配置化前端框架，支持多租户场景下的 UI 与业务逻辑定制
设计并实现 RBAC 权限管理系统，包括角色管理、权限树配置、按钮级权限控制
开发合同模板编辑器、合同审批流程引擎（基于 ReactFlow 的可视化流程设计器）、电子签章集成模块
封装通用业务组件库（高级表格、动态表单、文件预览等），提升团队开发效率约 40%
推动前端工程化建设：引入 Monorepo 管理多项目、统一代码规范、建设组件文档

核心业绩

支撑 10+ 家企业客户定制化交付系统稳定服务 5000+ 用户组件复用率 70%+ 交付周期缩短 30%

项目难点与解决方案

每家合作企业对合同管理的需求差异很大，包括字段定制、审批流程不同、UI 风格定制等。如果为每家企业维护一套代码，维护成本将随客户增长指数级上升。

设计了一套配置驱动的前端架构，将业务逻辑拆分为「基础框架 + 配置层 + 插件层」三层结构
基础框架：包含通用的页面布局、路由系统、权限控制、HTTP 封装等
配置层：通过 JSON Schema 描述表单字段、列表列定义、审批节点等，运行时动态渲染
插件层：为特殊定制需求提供插件注册机制，在不修改主框架的前提下注入自定义逻辑

新客户接入从平均 3 周缩短至 3-5 天，90% 的需求通过配置即可完成

不同企业的合同审批流程差异大（串行/并行审批、条件分支、加签/转签），需要一个可视化工具让业务人员自行配置，而不依赖开发。

基于 ReactFlow 实现自定义流程设计器
定义了审批节点、条件节点、抄送节点、通知节点等自定义节点类型
实现拖拽添加、连线、节点配置弹窗等交互，支持 Undo/Redo 操作
设计了流程 JSON 的序列化/反序列化协议，前后端通过统一的数据结构通信
增加流程校验逻辑：检测孤立节点、循环依赖、缺少必要配置等异常情况

业务人员可自主完成审批流程配置，流程变更需求响应时间从 2 天降至 10 分钟

权限节点数量大（200+），且需要支持无限层级嵌套。在权限配置弹窗中全量渲染 Checkbox 树时，勾选/取消操作存在明显卡顿。

将权限树的勾选逻辑从受控模式改为批量计算模式，一次性计算所有受影响节点状态，避免多次 setState
使用 useMemo 缓存权限节点映射表，避免每次渲染都遍历整棵树
对深层嵌套的组节点使用 React.memo 进行渲染优化

勾选响应时间从 200ms+ 降至 16ms 以内，用户体验流畅无感知

成都优卡信息科技有限公司

⚡ 前端开发工程师 📅 2019.08 - 2023.06 🏷️ Vue 2/3 + Element Plus + Vuex

专业的金融贷款中介 CRM 管理系统「融享客」（saas.youxinsign.com），官网：yoclc.com

工作内容

负责获客平台（H5 + PC 管理后台）的前端开发与维护
设计并开发 PaaS 低代码平台，通过拖拽配置快速生成业务页面，减少重复开发
实现可视化审批流程引擎，用户可自主配置审批节点与流转规则，并应用到实际业务中
实现 CRM 客户管理系统，包括客户线索分配、跟进记录、数据漏斗分析看板
开发 H5 落地页搭建工具，支持运营团队通过可视化配置快速生成营销页面
负责移动端 H5 页面的开发与适配，兼容微信/支付宝内置浏览器环境

核心业绩

落地页转化率提升 25% 日均进件 200+ 单首屏加载 1.5s 以内

项目难点与解决方案

贷款进件流程包含 5-8 步表单，每步有复杂的联动校验。用户中途离开后再回来，之前填写的数据全部丢失，导致大量用户流失。

设计了分步表单状态管理器：以 Vuex Module 管理每一步的表单数据
每步表单在 beforeRouteLeave 时自动将当前数据序列化存入 localStorage（敏感字段加密）
用户再次进入时，从 localStorage 恢复数据并定位到上次离开的步骤
同时将进度同步到后端，支持跨设备续填

表单完成率从 42% 提升至 68%，显著降低了用户流失

运营每周需要上线 10+ 个营销落地页，依赖开发手动切图排版，效率低且经常出错。

基于 Vue + vuedraggable 实现拖拽式页面搭建，预置 15+ 种组件
每个组件暴露统一的 props schema，右侧属性面板动态渲染配置项
实现实时预览（iframe + postMessage）和二维码预览
搭建结果以 JSON 存储，发布时由 Node 服务端渲染为静态 HTML 并部署到 CDN

落地页上线周期从 2-3 天缩短至 2 小时，运营可完全自主操作

成都碰她网络科技有限公司

⚡ 前端开发工程师 📅 2018.03 - 2019.07 🏷️ Vue 2 + Nuxt.js + Vuex + vue-grid-layout + WebSocket

从事数字资产交易平台开发的区块链科技公司。

工作内容

参与虚拟货币交易平台的前端开发，处理高频 WebSocket 推送数据
开发行情 K 线图模块（集成 TradingView），支持多交易对实时行情展示与技术指标分析
实现币币交易、法币交易（OTC）、合约交易等核心交易页面
开发用户中心模块：实名认证、资产管理、充提币流程、安全设置（Google 验证器）
使用 Nuxt.js 实现官网与活动页的 SSR 渲染，优化 SEO 效果与首屏性能
完成国际化（i18n）适配，支持中文、英文等多语言切换
基于 SCSS 开发多套网站主题，支持用户自定义主题配置切换

核心业绩

独立完成币币交易、个人中心等 核心模块 开发支持 2 种语言国际化切换实现 多套主题 自由切换

项目难点与解决方案

交易页面同时订阅了多个 WebSocket 频道，高峰期每秒推送 100+ 条消息。每条消息都触发 Vue 的响应式更新，导致页面严重卡顿。

数据分层：将 WebSocket 接收层与 Vue 响应式层解耦，原始数据先存入普通 JS 对象
合并更新：使用 requestAnimationFrame 将同一帧内的消息合并为一次 state 更新
差量更新：订单簿深度数据采用增量策略，本地维护完整深度，避免全量替换
虚拟滚动：对最新成交列表只渲染可视区域内的 DOM 节点

页面帧率从平均 15fps 提升至稳定 55-60fps，交易操作响应时间 < 50ms

TradingView Charting Library 是闭源商业库，文档有限，且默认 UI 风格与品牌不统一。需要实现自定义主题、自定义指标、多交易对切换时的数据流管理。

封装 KLineChart 组件，通过 datafeed 接口对接后端历史 K 线 API 和 WebSocket 实时推送
实现自定义 datafeed：getBars 对接 REST API，subscribeBars 对接 WebSocket
交易对切换时：先 unsubscribe → 清除图表 → resolveSymbol → 重新加载，避免数据串流
通过 overrides 和 custom_css_url 实现深色/浅色主题切换

K 线图加载时间 < 1200ms，切换交易对无闪烁无数据错位

成都小钉科技有限公司

⚡ Web 前端工程师 📅 2017.07 - 2018.01 🏷️ Vue 2 + Webpack + jQuery + Sass

智能家装平台「神锯子家」，包含找设计、找施工及材料商城，以及后台管理系统。

工作内容

根据 vue-cli 脚手架改写搭建项目目录结构，利用 Webpack 实现组件化、模块化开发
使用 Sass 预编译语言编写样式，加快开发速度
使用 jQuery 进行页面动态效果开发（轮播图、放大镜、吸顶效果等），Ajax 与后端交互
使用 art-template 模板引擎与 Ajax 获取到的数据进行页面渲染

核心业绩

独立完成平台 前端开发 与维护实现多个 交互动效 提升用户体验

音乐播放器（个人项目）

⚡ 独立开发 📅 业余时间 🏷️ Vue 2 + Vuex + Node.js

仿照 QQ 音乐移动端开发的音乐播放器应用，通过 Node.js 搭建数据转发服务获取 QQ 音乐接口数据，供个人本地使用，深入学习 HTML5 Audio API 及移动端交互体验。

项目内容

基于 Vue 2 + Vuex 搭建移动端 SPA，还原 QQ 音乐的核心 UI 与交互体验
使用 Node.js 搭建后端代理服务，转发 QQ 音乐 API 接口，解决跨域与接口鉴权问题
基于 HTML5 Audio API 封装音频播放器组件，支持播放/暂停、上一曲/下一曲、进度拖拽、音量调节
实现歌词滚动同步显示，基于时间戳解析 LRC 歌词格式并高亮当前播放行
开发推荐歌单、歌手列表、排行榜、搜索等核心页面模块
使用 Vuex 统一管理播放状态（播放列表、播放模式、当前曲目），支持顺序播放、随机播放、单曲循环
采用 better-scroll 实现移动端丝滑滚动与歌手列表字母索引快速跳转

技术亮点

完整音频播放器 Audio API Node 数据转发 代理层 歌词同步 LRC 解析 移动端适配 flexible

项目难点与解决方案

HTML5 Audio 在移动端浏览器中存在诸多兼容性问题：iOS 禁止自动播放、部分安卓机型 canplay 事件不触发、切换歌曲时偶发播放中断等。

封装统一的 Player 类，内部管理 Audio 实例的生命周期，对外暴露 Promise 化的 play/pause/seek 方法
通过监听 canplay、timeupdate、ended、error 等事件，构建完整的播放状态机
针对 iOS 自动播放限制，在首次用户交互时触发静默 play() 解锁 Audio 上下文
切歌时先 pause → 重置 src → load → play，确保音频资源正确释放与加载

播放器在 iOS Safari、微信浏览器、各主流安卓浏览器中均可稳定运行

QQ 音乐接口有 Referer 校验和签名机制，前端直接请求会被拦截，需要服务端代理转发并伪装请求头。

使用 Express 搭建本地代理服务，通过 axios 在服务端转发请求并设置合规的 Referer 和 Origin 头
对热门接口（歌单列表、排行榜）增加内存缓存层，减少重复请求，提升响应速度
统一封装错误处理中间件，对接口异常返回友好的降级提示

本地代理稳定可靠，接口响应时间 < 200ms，缓存命中后 < 10ms

康维

专业技能

工作经历

北京幂律科技有限公司

成都优卡信息科技有限公司

成都碰她网络科技有限公司

成都小钉科技有限公司

音乐播放器（个人项目）

教育背景

成都理工大学

自我评价