shinedong@blog — bash
01 / STRENGTHS

个人优势

在工程与产品的交汇点持续深耕,将技术能力转化为可量化的业务价值。

01

微前端架构落地

基于 Module Federation 与 QianKun 进行微前端改造,实现子应用独立部署与动态加载,多团队并行开发效率提升约 30%,主应用首屏加载体积降低 40%。

Module FederationQianKun微前端独立部署
02

工程化构建优化

通过 Vite / Webpack 进行代码拆分、依赖分包与按需加载,将构建时间从 4 分钟缩短至 1 分钟,首屏加载时间下降 50%,有效解决白屏问题。

ViteWebpack代码分割按需加载
03

Electron 桌面端开发

基于 Electron 构建跨平台桌面应用,主进程实现 HTTP/HTTPS CONNECT 隧道代理,通过 IPC 与渲染进程通信,代理转发延迟控制在 50ms 以内,支持动态规则热加载。

ElectronIPC代理隧道Windows/macOS
04

跨端统一开发

通过 uniApp 实现一套代码多端发布(H5 / 小程序 / App),消除各端重复开发成本,迭代周期缩短约 40%,保障多端功能一致性。

uniApp小程序H5多端发布
05

AI 辅助开发提效

深度应用 Cursor / Claude Code 辅助大规模项目重构,通过「滑动窗口 + 摘要 + Memory + RAG」策略管理长上下文,单会话支持 200+ 轮稳定对话,Token 消耗降低 60%。

Claude CodeCursorRAG长上下文管理
06

组件化体系建设

针对后台管理系统界面不一致、维护成本高的问题,抽取通用业务组件与布局组件形成可复用组件库,新页面开发效率提升 50%,代码复用率从 20% 提升至 65%。

组件库代码复用设计规范可维护性
02 / 03

工作经历

从医疗信息化到 AI 工程,三段经历,一条持续向架构与工程效率深入的主线。

03
2024.09 — 2026.02
● NOW

元聚变(上海)科技股份有限公司

高级前端开发工程师2024.09 — 2026.02

负责 BossAI 代理浏览器核心架构开发与 AI 插件工程化体系建设,主导多模型接入、Agent Pipeline 搭建及广告后台前端架构设计。

  • —负责 BossAI 代理浏览器(Electron + React)核心架构开发,实现本地代理转发、多标签生命周期管理、请求拦截等底层能力。
  • —主导 AI 插件工程化体系建设,完成多模型接入、Prompt 编排、上下文记忆与流式渲染,基于 LangGraph 搭建可扩展 Agent Pipeline,实现多 Agent 协作、工具调用及容错恢复。
  • —负责聚有量广告后台前端架构设计与业务研发,优化工程化流程,提升项目迭代效率与可维护性。
ElectronVue3ReactPiniaZustandElementPlusLangGraphTypeScriptNode.jsPythonViteSqlitePostgreSQL
02
2022.11 — 2024.05

上海安赛瑞实业有限公司

中级前端开发工程师2022.11 — 2024.05

负责前端团队招聘、人才梯队建设及研发管理,统筹多项目资源与研发流程。

  • —带领4人前端团队交付ERP供应链系统、品牌官网及微信小程序项目,推动团队协作与交付效率提升。
  • —协调产品、设计、后端、测试等团队推动项目落地,并持续引入前沿技术与工程实践,推动团队技术升级与研发效率提升。
Vue2/3AxiosElement UINode.jsTypeScriptWebpackViteEcharts
01
2020.04 — 2022.09

上海蓝生健康科技有限公司

初级前端开发工程师2020.04 — 2022.09

负责门诊医生站系统开发,从患者预约挂号、签到候诊、医生诊断、检查检验、缴费取药、办理住院等全流程业务模块的功能设计与开发,支撑医院日常诊疗及药品管理业务。

  • —负责医院数据字典管理体系建设,基于 Vuex + localStorage 实现字典数据持久化与统一转换,保障多业务模块字段展示的一致性与准确性。
  • —负责 HIS 系统门诊医生站、药房仓库等5个核心业务模块的功能设计与开发,支撑医院日常诊疗及药品管理业务。
  • —负责 Lodop 打印能力二次封装,支持门诊、住院等单据套打、续打等业务场景,统一打印调用流程,提升业务系统打印效率与稳定性。
Vue2Vue RouterVuexElement UIAxiosTypeScriptWebpackQiankunEcharts

项目经历

代表性项目精选,涵盖架构设计、AI 工程和开源实践。

01 / 10

供应链管理系统

前端开发工程师

2022.11 — 2024.05

综合的供应链业务流程管理平台,协调和优化从原材料采购到产品交付的全部流程,覆盖采购、仓储、物流、销售等核心业务模块。

  • 请求优化:实现基于 Axios cancelToken 的重复请求拦截机制,减少不必要的网络请求;开发基于 spark-MD5 的大文件分片上传方案,结合 Web Worker 异步计算哈希,支持断点续传与秒传。
  • 工程优化:使用 Node.js 脚本从打包产物中提取外部域名并注入 DNS 预解析标签,优化首屏加载速度;通过自定义指令实现页面及按钮级权限控制;对第三方插件打补丁修复兼容性问题。
  • 可视化大屏:基于 SSE 实现服务端实时数据推送,利用浏览器自动重连机制保障连接稳定性,实现秒级数据更新;通过 Node.js BFF 聚合多业务系统数据,结合 ECharts 渐进式渲染实现 10 万级数据流畅展示。
Vue2VuexVue RouterAxiosWebpackElement UIVxeTableEChartsSassNode.js

智慧医疗管理系统

前端开发工程师

2020.04 — 2022.09

面向医院全业务流程的综合管理信息系统,覆盖人流、物流、财流的自动化管理,支撑门诊、药房、住院等多科室日常运营。

  • 微前端架构:参与基于 qiankun 的微前端改造,将医院管理系统拆分为多个独立子应用,各子应用运行于沙箱环境,实现独立开发、测试与部署。
  • 延迟渲染优化:实现 defer 逐帧渲染方法,优化可视化大屏的加载体验,将 LCP 从 4.5s 降低至 1s 以内。
  • 虚拟滚动:通过动态更新 tbody 的 transform: translateY() 实现行懒加载与平滑滚动,仅渲染可视区域数据,显著提升大数据量表格渲染性能。
Vue2VuexVue RouterAxiosElement UITypeScriptSassqiankunEChartsLodop

个人技术博客系统

独立开发者

2026.07 — 至今

你现在正在访问的这个站点。基于 Next.js 15 + Prisma + PostgreSQL 搭建,集成 AI 对话、Three.js 动效、Markdown 编辑器等特性。

  • Three.js 粒子动画首屏,60fps 流畅渲染
  • 集成 Claude API 实现 AI 对话助手,支持流式输出
  • Docker 一键部署,Nginx 反代,Lighthouse 评分 95+
Next.js 15PrismaPostgreSQLThree.jsFramer MotionClaude API

AI个性化英语学习平台

精选

主设计者 & 核心开发

2026.08 — 2026.09

基于LangGraph Agent + Hybrid RAG 的个性化英语学习平台,具备知识库检索、意图路由、语音交互和学习数据闭环的AI 英语学习系统。

  • Hybrid RAG 检索系统:融合BM25关键词检索与 BGE-M3向量检索,通过 BGE Reranker 二次重排,使 Recall@3相较纯向量检索提升15%左右
  • LangGraph Agent 多任务编排:使用LangGraph构建有向图工作流,实现意图识别(WORD_LOOKUP/EXERCISE/TRANSLATE等)、条件路由、工具调用的完整Agent闭环
  • Agent Event SSE流式架构:设计分层事件流(intent/retrieval_result/rerank_result/token/tts_complete),前端可实时渲染检索溯源、LLM生成过程和语音输出,提升用户交互体验
  • RAG 幻觉控制策略:词典事实(词义、音标、搭配)强制来自ECDICT知识库,LLM仅负责解释和生成例句,通过Prompt约束实现'不得编造词典信息'
Vue3TypeScriptVitePiniaPythonLangGraphBGE-M3BM25ChromaRedis

浏览器AI助手(Chrome浏览器插件)

全栈开发者

2025.11 — 2026.02

基于 Chrome Manifest V3 规范开发的企业级 AI 助手浏览器扩展,集成多场景智能交互入口,为用户提供沉浸式AI对话体验,支持文生图、图生图、视频总结,网页总结等AI智能处理。

  • 多入口交互体系:实现悬浮按钮、右键菜单、划词工具栏四种独立交互入口,覆盖全场景用户需求。
  • 多媒体 AI 处理:支持文生图,图生图持续对话、视频内容总结,网页内容总结,网页截图,划词工具等功能。
  • 构建多模态 AI Agent Workflow:基于 LangGraph 搭建多模态 AI Orchestration 系统,通过 Stateful Workflow 编排 Prompt Pipeline、Conditional Routing 与 Tool Calling,实现复杂 AI 创作任务自动化执行。
Vue3TypeScriptVitePiniaChrome Manifest V3PythonFastAPILangGraphPostgreSQL

联系我 · Let's Connect.

aceternity logo
微信号
xiaoyaohull
手机号
15255454702
邮箱
3101570493@qq.com
GitHub
https://github.com/Shiner-D
esc
F1
F2
F3
F4
F5
F6
F7
F8
F8
F10
F11
F12
~`
!1
@2
#3
$4
%5
^6
&7
*8
(9
)0
—_
+ =
delete
tab
Q
W
E
R
T
Y
U
I
O
P
{[
}]
|\
caps lock
A
S
D
F
G
H
J
K
L
:;
"'
return
shift
Z
X
C
V
B
N
M
<,
>.
?/
shift
fn
control
option
command
command
option