为什么 AI 流式输出会让前端「永久转圈」：LangGraph + WebSocket 排障复盘
LangGraph + WebSocket 流式输出导致前端永久转圈的排障复盘：断连兜底、终态帧与流式开关三件事缺一不可。
4 min read→
Available for opportunities · 2026
Hi, I'm Waylon.Frontend Engineer.
// 用代码塑造像素，用组件沉淀效率。专注于现代 Web、数据可视化与跨端开发的工程师。
SCROLL
01 / About
关于我
// who.am.i2025.09 — 2026.04
前端开发工程师 · 广东同航科技
主导智能化运管平台 Web 端与移动端开发，基于 Vue3 + TypeScript 完成多子模块搭建，引入 Kotlin Compose 重构 APP 端使代码量减少约 30%。
Vue3TypeScriptKotlin ComposeVite
2022.04 — 2025.01
前端开发工程师 · 广东亿迅科技
负责后台系统、微信小程序、H5、APP 多端开发，深度参与疫情防控指挥平台、大数据能力底座等重点项目，主导星网服务保障子系统架构设计。
Vue3EChartsqiankununi-app
2018.09 — 2022.06
计算机科学与技术 · 华南农业大学（双一流）
本科 · 数学与信息学院 / 软件学院。获国家励志奖学金（2019）、优秀学生干部（2019）。
双一流全日制本科广州
// Tech Stack
0+yr
Experience
0+
Projects Shipped
0+
Team Shared
0%
Code Reuse ↑
// Bio
4 年+ 前端开发经验，兼具移动端（Android / Kotlin Compose）开发能力。熟悉 Vue3 生态、微前端、数据可视化及工程化建设，有政务、物联网领域复杂项目落地经验。注重代码质量与团队效率，乐于技术分享与规范落地。
02 / Works
作品集
// independent · in progress · pastFEATURED · AI AGENT · WebONLINE→
AI 写作搭子 — Chapter Zero
为长篇小说作者打造的 AI 协作写作智能体（创作 IDE）。以 RAG 检索 + 多智能体对话 + 逐字流式为核心，把「查资料 → 理大纲 → 写章节 → 做校验 → 维护一致性」的割裂流程，升级为「AI 搭子陪你边写边检索、边写边校验、边写边吐」的沉浸式创作。
v1.0.0 · 2026-07-23FEATURED · AI TOOL · WebONLINE→
AI 视频搭子 — film_partners
为泛化视频爱好者打造的 AI 吐槽协作工具。自动抓取视频弹幕，通过双 AI 智能体生成趣味摘要，并转化为毒舌语音对话。目标：把「看视频+读弹幕+找槽点」的体验，升级为「AI 搭子陪你边看边吐」的沉浸式互动。
v1.0.0 · 2026-0603 / Lab
技术博客
// thoughts in markdownDocker Compose 热更新必现 502：排障与回滚实践
单机 Docker Compose 热更新必现 502 的根因（Nginx upstream 不重解析）与 Cloudflare IPv6 偶发失败的排障、回滚实践。
5 min read→
前端长连接管理实战：指数退避重连、心跳与跨路由保活
前端原生 WebSocket 的健壮性实践：指数退避重连、心跳、看门狗、跨路由保活与前后端契约翻译层。
4 min read→
多模型 Key 管理与路由：统一 resolve 与 Fernet 加密
多 LLM Key 与多模型路由的统一 resolve + ModelFactory 设计，以及用 Fernet 加密密钥、掩码返回的密钥安全实践。
3 min read→
长文本 RAG 的几个反直觉设计
长文本 RAG 的几个反直觉设计：按场景切片、不设相似度硬阈值、强约束直查 DB、embedding 维度锁死与本地 FAISS。
4 min read→
本地 FAISS 还是托管向量库：小说 RAG 的向量库选型与边界
小说 RAG 向量库选型：为什么从 Chroma 迁回 FAISS，工程化落地要点，以及何时该换 Qdrant / pgvector 的边界。
5 min read→
SQLAlchemy + JSONB 的两个经典坑：缓存被覆盖与修改不落库
SQLAlchemy 的 JSONB 列「原地改不落库、整覆盖抹字段」两个经典坑，以及 MutableDict + 字段级 merge 的修复。
3 min read→
ECharts 地理可视化：从地图接入到 10+ 图表复用
在一次内部分享会上沉淀的 ECharts 地理可视化实践——如何结合高德地图、OpenLayers 实现疫情风险三维可视化，以及用配置化参数让 10 余种图表快速复用。
2 min read→
qiankun 微前端落地：大数据能力底座的模块化改造
基于 qiankun 对大数据能力底座进行微前端改造，实现各模块独立开发、测试与部署，支撑团队并行开发的全过程。
2 min read→
Jetpack Compose 重构实战：代码量减少 30% 的迁移之路
从传统 View 体系迁移到 Jetpack Compose 的实战经验——MVVM 架构、模块化拆分、动态域名 Retrofit 客户端，以及代码复用率提升 40% 的关键决策。
2 min read→
Vue3 组件封装哲学：从 RTSP 播放器到通用表单
在多个项目中沉淀的 Vue3 组件封装实践——RTSP 播放器自动重连、ActionOverflow 权限按钮、动态表单配置化生成，以及拖拽上传等通用组件的设计思路。
2 min read→
前端性能优化复盘：虚拟滚动让渲染快 40%
疫情防控指挥平台中大数据量列表的性能优化实践——虚拟滚动穿梭框、动态表单配置化、OpenLayers + ECharts 三维可视化的性能策略。
2 min read→
AI 辅助开发提效：从提示词优化到团队工具落地
如何用 AI 进行功能设计、提示词优化，沉淀可复用智能体及模板，指导团队使用 AI 代码编辑器及 WorkBuddy 等工具，缩短重复编码时间约 25%。
2 min read→
04 / Tools