05
项目经验
SeeSaw AppFlutter · iOS / Android
消息中心:按四个频道重建消息首页并加上频道 feed,通知卡片按服务端 key 注册并渲染 payload,补齐 16 个缺失的 message key;通知摘要不可用时退回会话行展示。
冷启动:缓存 IM 登录材料,聊天先读本地库渲染、不等连接就绪;消息首页的通知摘要按环境 + 用户缓存,首页 feed 首屏缓存后静默刷新。
与 H5 的桥:把 SSA 2.0 弹层集合(dialog / actionSheet / assetToast / drawer / loading)经 JSBridge 开放给 H5,首帧透传深色主题;邀请与 WhatsApp 邀请链接指向主站域名,注册 universal link / App Links 域名。
分享与增长:邀请海报、Instagram Direct 直拉、Facebook composer 以 scheme 拉起、WhatsApp 邀请页;设计 token 改为 DTCG JSON 并生成 Dart 文件。
热更新:设计 Shorebird 的 dev / prod appid 拆分方案,写发版与 Patch 操作手册。
Flutter/Dart/OpenIM/JSBridge/Shorebird
SeeSaw Web 主站seesaw.fun · pnpm + Turborepo
基座:从 chore(init) 起搭 monorepo —— swagger 自动生成 API client、路由、九语 i18n、设计 token(颜色 / 字体 / 动效 / 阴影)、@seesaw/icons(把 App 的 svg 快照分类、命名后生成 React 组件)、@seesaw/format、实时价格 socket 共享包,共 15 个内部包。
性能:只给可见的话题卡订阅实时价格(单个 observer 收集可见 id,卡片卸载即回收缓存);服务端按 session 凭证按用户预取。
页面:Day7 首页频道(游标分页)、个人主页(本人 / 访客两套视图,关注、拉黑、转账)、邀请与 WhatsApp 邀请落地页(先登录再绑定)、九语分享卡片与 og 元数据、robots / sitemap。
动效:弹层进出场、按钮 loading(纯 CSS 的 300ms 延迟显现,避免闪一下)、路由切换进度条。
React/Next.js/Typescript/Tailwindcss/zustand/react-hook-form/zod
世界杯 2026 活动H5 + Server · 2026-06 ~ 2026-07
场景:猜球活动分小组赛、淘汰赛、终局赛三个阶段,有猜球榜、团长榜(邀请)和按档位发奖,多人并行开发,活动一个接一个,样式和组件不能越堆越乱。
方案:拆成 4 人并行、各自全栈的任务;抽出共享包 ui-activity(通用 shell + 活动专属子树,活动样式按路由懒加载)。后端做成阶段感知的发奖链路:三个榜单、终局榜 Top 200、finals_switch_at 切换、按档位的奖励推送文案、admin 同步端点。
成就:三个阶段共 179 个获奖名额按期发放。
React/Vite/Tailwindcss/react-i18next/Go
BitX 前端重构2025-10 ~ 2026-03 · 从 0 到 1
场景:接手时 Room 等核心模块问题多、高优先级 bug 不断,要接入新的链生态(Morph),旧代码撑不住,决定整体重构。
方案:出 Room 重构方案并重写;定 Auth 方案、接口生成方案(swagger / codegen 生成类型)、WebSocket hooks;对接 Morph 生态,做分链构建、分链合约调用和接口调用配置;搭响应式 Layout、响应式弹窗组件 BXDialog、Tailwind 主题体系,沉淀 jotai 与 react-query + GraphQL 的最佳实践;写 git flow 与 App Web 代码规范。
成就:登录、首页、交易器、创建、排行榜、积分等页面按页迁到新基座。
Next.js/React/Typescript/Tailwindcss/jotai/react-query/GraphQL/WebSocket
06
历史项目
虎牙直播 · 公会中心与公会相关体系2021 ~ 2023 · 核心开发
推动虎牙直播营收重要组成部分——公会体系战略落地,推进公会中心主播佣金托管服务、经纪公司入驻与佣金结算发票线上化,形成主播佣金结算与税收闭环。
佣金托管与结算线上化:先后完成十多个需求迭代,如期交付,无重大缺陷。封装主播签约法务协议弹窗(接入8个项目,完美无缝多端)、佣金相关数据面板(无缝注入旧项目)等公共逻辑为独立组件,所有需求从0到1独立完成、按时交付。
React.js/Vue.js/Webpack/Vite/Typescript
虎牙直播 · 陪练相关体系2021 ~ 2023 · 核心开发
虎牙上分小程序:主导小程序基建(前期脚手架搭建和接口加密解密适配)和业务开发,将“小鹿陪练App核心功能迁移至微信小程序”,上线以来累计用户已接近6万人,充值金额数百万元。
极速下单:对接虎牙ab实验/灰度系统,持续调优极速下单功能,并将过程中提炼的工具数据中台埋点上报代码生成器在团队内部推广。
React.js/React Native/Typescript
卓越集团 · 教学线在线课堂2019 ~ 2021 · 前端组长
场景:改版前课件由服务端渲染成图片再交给客户端展示,同时上课的学生一多,node服务压力大、课件渲染卡顿。
方案:主张采用客户端渲染,分散服务器压力,由客户端通过WebView传递参数给Web应用,Web应用请求接口渲染页面,最后根据设备尺寸按比例缩放内容。
成就:一套代码同时完成Web、Windows、Mac、iPad和Android多端适配,与客户端通过协定的接口(JSBridge)互相通信;解决了服务器CPU和内存占用率奇高的问题;根据不同设备dpr配合scale进行按比例缩放,达成在任意设备/任意窗口尺寸下都能统一显示效果。
React.js/React-router/ant-design
网迅 · 中国电信2019 以前 · 核心开发
广东电信AWIFI可视化系统:省市区地图、柱状图、饼图等多维度可视化统计广东省各市、区awifi的AP总数、上网认证次数、日志数、探针数等数据,自适应设计,最大支持4k分辨率;封装echarts series灵活组合多种可视化图表组件,自定义高德地图(amap)样式并通过自定义marker和info-window在高德地图上绘制散点和信息展示。
电信星礼遇活动:每月固定活动,游戏H5、抢兑/拼团限时/抽奖类线上即时活动;生日特权活动累积参与人数已超过数十万人。
Vue.js/Vuex/Vue-router/gulp/mint-ui/vant-ui/date-fns/axios