技术手记

前端与全栈工程实践，涵盖流式处理、实时通信、状态管理、架构设计等硬核技术分享

利用 @ffmpeg/ffmpeg 的 WebAssembly 版本，在浏览器中直接将图片序列合成为 MP4 视频。覆盖 FFmpeg WASM 初始化、图片写入虚拟文件系统、H.264 编码参数控制、进度回调、前端 vs 后端方案对比，以及

实现大文件分片上传与断点续传系统：SparkMD5 计算文件指纹实现秒传，5MB 分片并发上传，刷新页面后自动恢复未完成的上传。包含完整 TypeScript 代码、API 接口规范（prepare/chunk/merge/cancel）、进

构建 AIGC 前端任务队列系统：涵盖任务状态机（pending/running/progress/completed/failed/canceled）、WebSocket 实时进度推送、并发控制、localStorage 持久化、失败重试与取消。支持图片生成、视频生成

构建通用的 AI 模型参数控制面板：以 TypeScript 配置表驱动，动态渲染 LLM、文生图、文生视频三类模型的差异化参数。涵盖 temperature、TopP、采样步数、CFG、帧率，以及参数联动、互斥校验、非法输入拦截和 localStorag

X(Twitter)的 Community Notes 证明了众包事实核查的可行性。本文将这个模式从前端架构到可信度评分算法完整实现，可直接用于社区内容审核系统。

对话越来越长，LLM 的 Token 窗口却有限。用 gpt-tokenizer 精确计算 Token 数，实现倒序截断、保留最新消息的上下文管理方案。附带 Token 计算原理和滑窗策略对比。