25 个开源 Awesome 仓库：按主题学习的专题索引

这套专题起于腾讯新闻前端团队在 2022 年整理的项目清单。原清单有 25 个 GitHub 仓库，本站为每个仓库写了独立文章，并按现在的博客分类重新编排；部分明确允许再利用的固定版本会附完整原文和许可。

专题不是把 25 个仓库一律整篇搬运：明确允许再利用的固定版本会在许可范围内保留原文和许可；许可不明或不允许整篇复制的项目以原创工程梳理为主。每篇文章都标明来源、适用边界和复核方法；目录与链接是时间快照，使用前仍需核对维护状态、依赖和具体许可。

前端：浏览器、框架、交互与工程化

Web 开发黑魔法技术手册：语言机制、框架、Node 与安全实践：把 awesome-blackmagic 的七类资源主题展开为独立技术章节，补充原理、原创示例、现代实践和安全边界。
读 awesome-1kb：1 KB JavaScript 小库的价值与边界：把原目录中的 21 个微型项目链接整理成索引，并用生产构建、运行时、维护和安全边界建立现代依赖选型方法。
前端状态管理实战：从组件状态到服务端缓存：依据跨框架、React、Vue、小程序、Angular 六类资源，讲清 UI 状态、URL 状态、服务端缓存、SSR 和跨标签同步的边界。
读前端源码解析仓库：React、Vue 与微前端的学习路线：把 React render/commit、Fiber、Vue 响应式、Redux/SWR 服务端缓存和微前端边界整理成版本可复核的源码阅读实践。
读 awesome-web-dev-books：按问题建立前端书单：用 JavaScript、HTML/CSS、Node.js 与综合类四条路径安排阅读，不转载书籍文件。
读 fe-awesome-demos：让旧 Demo 成为今天可运行的练习：逐项梳理 14 个基础、CSS、插件、QA、Canvas、框架、构建与设计模式目录，附安全隔离和可验证动画示例。
读 JavaScript 资源大全中文版：从语言到 UI 的生态地图：完整映射原仓库 64 个主题，扩展为现代 JavaScript 工程选型指南，覆盖模块、测试、浏览器 API、媒体交互、供应链与维护。
前端工具生态选型手册：构建、测试、状态与依赖治理：把 awesome-f2e-libs 固定快照中的 25 个分类逐项展开，结合现代官方资料讲清工具边界、场景选择、安全门槛和落地验收。
uni-app 跨端工程实战：平台差异、适配层与发布验证：把官方资源、开源项目、组件、工具、文章和应用案例转成 H5/小程序/App 的架构、兼容和真机验收方法。
前端能力全景图：完整资源归档与现代工程选型实践：保留固定版本 README 全部 453 条链接引用与原始说明，并补充编辑器、上传、图形、微前端等场景的选型与安全方法。
读 JavaScript Guidebook：用规范和实例搭知识图谱：按固定版本 468 篇 Markdown 页面重组 8 个知识域，覆盖语言语义、BOM/DOM、网络、模块、内置对象、面向对象与模式，并给出现代版本核验路线。
前端知识全景图：从浏览器基础到全栈交付的学习路线：完整保留 F2E-Awesome 固定快照的 63 个目录标题，并把它们串成浏览器、前端工程、网络后端、AI 实时交互与上线运维的可验收路径。
Front-End-Develop-Guide 完整学习地图：前端基础到全栈延伸：固定归档版本的完整 README 与 MIT License 已收录，另将 HTML/CSS、JavaScript、生态、算法、Node、扩展、桌面、移动、WebGL 和 V8 整理成可执行学习路线。
JavaScript 算法题库实战指南：从数据结构到边界测试：逐项整理 18 类 JavaScript 算法主题，配套不变量、复杂度、边界测试和 4 个可运行示例。
读小程序雷达：从资源清单升级到技术选型：固定归档 237 条小程序资源，拆解 Radar、Compare、Advisor、Doctor 与跨端工程选型。
读 awesome-webpack-cn：从入门到 Loader/Plugin 的构建地图：从模块图、Loader/Plugin 到缓存、分包、HMR、Source Map 与 Module Federation，建立适用于 Webpack 5 的构建排障和迁移路线。

后端：Node.js 能力与安全

Node.js 后端工程全景：48 类资源的架构与落地指南：沿请求链拆解 Node.js 运行时、HTTP、流、数据库、队列、测试、性能和供应链，并重组上游全部 48 个能力目录。
Node.js 安全工程手册：服务端基线、供应链防护与事件复盘：把 Node.js 安全从扫描器清单落到请求边界、身份授权、上传与 SSRF、依赖发布链、生产日志和可演练的事件处置。

全栈：低代码、知识体系与书目

低代码平台工程指南：从组件协议到安全发布：覆盖上游全部 10 个主题与 71 条资源规模，深入页面 schema、编辑器/运行时、权限、数据连接、版本迁移和平台选型。
低代码系统设计与选型：Schema、编辑器、运行时和安全：从完整平台到 H5、表单和后端工作流，拆解低代码产品形态、Schema 契约、设计器/运行时分层、验证与上线治理。
读 awesome-cs-books：计算机基础书目如何排成学习路线：原始书单目前无法核验；本文据可靠课程与官方资料独立整理计算机科学学习路线，不声称复现上游每一本书。
技术书单怎么读：从书目地图到可验收的工程能力：覆盖 Java、C++、前端、机器学习与计算机基础 15 个领域，建立选书、阅读、实验、复盘和合法图书收录流程。
读 Awesome-Lists：跨前端、服务端与 AI 的资料索引方法：上游已改名为 Awesome-Lists-and-CheatSheets；本文不镜像受限原文，改以原创方法讲清资料分类、证据、更新与安全治理。

工具：开源发现与项目雷达

读 Good++：16 期、45 个开源项目与工程灵感：按原始期次整理前端、低代码、图形、媒体、移动端和服务端项目，并用现代工程标准复核其价值与风险。
读 Awesome-GitHub-Repo：从 AI 到实战项目的开源导航：梳理 AI、信息获取、趣味项目、实战项目、工具、学习资源和大厂开源目录。

核验边界

原始推荐发布于 2022 年，部分仓库已经调整方向。imarvinle/awesome-cs-books 的 README 在本轮核验时无法从常见 raw 路径获取，对应文章只保留已核实的主题级路线，不导入具体电子书或下载地址。涉及第三方图书时，本站优先介绍合法购买、借阅或获得作者授权的入口。

延伸：小型依赖与在线实验

小而专的 npm 包：如何从清单走到可靠依赖：按能力地图浏览，并用维护度、许可、安全和体积做二次筛选。
StackBlitz 打开 GitHub 项目：以 Ant Design Pro 为例：从只读预览到个人副本，逐步启动、修改和分享。

后端专题深读

现代 PHP 后端实践：PDO、会话安全与可靠发布：从 PHP 运行时、参数化数据访问和会话安全，走到文件上传、测试、日志与可回滚发布。
现代 PHP 基础与 Web 安全：从请求到数据访问：把 PHP 语法、分层、SQL 参数化、密码与会话、CSRF、输出编码和安全上传串成一条可落地的请求链路。
PHP 文件读写与 UTF-8：把文本解析成安全 HTML：从受控路径读取文本和 CSV，检查失败/编码/体积边界，区分字节与字符，并安全渲染成 HTML。
PHP 数组与日期时间：数据变换和边界值：把列表/映射的键语义、空值判断、纯变换和时区显式化，避免数组与时间边界造成隐蔽错误。
PHP 表单处理：请求校验、CSRF 与 Post/Redirect/Get：从 GET/POST 区分开始，验证字段类型和范围，保护 Cookie 会话写请求，并用 303 重定向避免重复提交。
PHP 文件上传安全：真实类型、大小预算和私有存储：围绕上传错误码、字节/像素限制、MIME 检查、随机文件名、私有存储与受控下载建立完整防护链。
PHP JSON 音乐目录 CRUD：从文件原型到数据库：沿用音乐列表练习，梳理新增/编辑/删除/查询的校验、锁、原子替换、CSRF 与何时升级为数据库。
PHP 与 AJAX：从旧 JSONP 示例迁移到安全 Fetch API：把旧 JSONP 练习拆成浏览器请求、PHP 参数化查询与安全 DOM 渲染，并明确同源、跨域和请求竞态。
Redis 缓存设计：Key 命名、过期策略、击穿和一致性：从 cache-aside 基线出发，梳理 Key 空间、TTL、失效竞态、热点保护、内存淘汰和可观测性。
后台任务与队列：定时抓取、重试、幂等和失败恢复：用至少一次投递的现实假设，设计任务状态机、租约、重试、死信、幂等键、outbox 与可恢复运维。
事务型 Outbox 与幂等消费：从数据库与消息代理双写故障出发，理解原子写入、租约、重试和死信恢复。
数据库事务与一致性：Prisma 场景下的实战注意事项：辨析事务类型、隔离级别、条件更新、幂等和外部副作用，避免把单条原子更新误当成全链路事务。
数据库索引与查询优化：从慢查询到可解释的性能：用真实查询和 EXPLAIN 建立优化闭环，解释复合/部分索引、稳定分页、统计信息与上线风险。
数据库索引与查询优化中的稳定分页章节：涵盖唯一排序、offset 与 keyset 取舍、跨页重复/遗漏及可复现回归测试。
日志与监控：从 PM2 日志到业务可观测性：用安全事件字段、低基数指标、SLO 告警、存活/就绪探针和故障演练，把进程在线推进到可定位、可恢复。
Node 后端服务整理：NestJS、Prisma、PM2 与可回滚部署：把进程名追溯到真实源码、构建物、环境和监听端口，再建立暂存、健康检查、备份和回滚闭环。
后台权限系统：RBAC、只读访客和接口保护：从角色权限矩阵到对象级授权、只读访客和隐藏资源隔离，建立默认拒绝、逐请求检查和完整负向测试。
接口限流与防爬：登录、图书、评论和上传场景怎么做：按身份、网络和资源成本分层限制登录、评论、下载与上传，兼顾代理可信边界、429 语义和滥用恢复。
后台审计日志：谁在什么时候改了什么：区分应用日志与审计轨迹，设计可归因事件、脱敏 before/after、事务 outbox、权限和保留策略。
NestJS JWT 密钥配置：让认证服务在启动时拒绝弱密钥：从一个真实的 NestJS 后端改动出发，拆解启动期密钥校验、签名与验签配置一致性、密钥强度、轮换和授权边界。
NestJS 邮箱验证码登录：一次性凭证、Redis 限流与邮件投递边界：从用途隔离、短码摘要和并发消费，到多维原子限流、账号枚举与邮件投递失败恢复。
库存账本一致性：用事务、原子扣减与补偿流水守住库存：从个人电商后台的库存代码审阅出发，设计并发安全的库存变更、同事务流水、批量语义、幂等重试和可审计冲正。
NestJS 大文件上传实战：从 413 到安全落盘：拆解 multipart 上传链路中的 413、内存峰值、鉴权、磁盘暂存、文件校验与失败清理。
Python 后端开发入门：从基础语法到可测试的服务：用 JavaScript 开发者熟悉的场景学习 Python：虚拟环境、数据结构、函数、运行时校验、异常和测试。
NestJS WebSocket 实战：鉴权、房间授权与可靠消息：从协议选择、握手认证、逐事件授权到断线恢复和多实例扩容，搭建不把 WebSocket 当成“免鉴权长连接”的服务端设计。
Webhook 接收端实战：原始请求验签、幂等收件箱与可靠处理：从反向代理保留原始请求体开始，构建常数时间 HMAC 验签、持久化收件箱、快速 ACK、幂等 worker、重试与密钥轮换；同时厘清 GitHub 签名不包含时间戳的重放边界。
PostgreSQL 与 Prisma 零停机迁移：兼容发布、分批回填与安全收缩：用 expand-and-contract 拆解线上 schema 变更，覆盖并发索引、约束验证、可恢复批量回填、Prisma migrate deploy、台账基线和代码回滚边界。
Node.js 服务优雅关停与数据库连接池：从 SIGTERM 到请求排空：把进程退出当作有序协议：停止接流量、排空 HTTP 与 WebSocket、完成有限在途任务、释放连接池，并按连接预算配置超时与告警。
Prisma 与 PostgreSQL 连接池容量规划：按 PM2 进程数估算总连接预算，解释连接耗尽、P2024 与 PgBouncer 的调优边界。
Express 登录与权限的生产安全边界：一次源码审阅清单：从一次脱敏源码审阅提炼默认管理员、JWT 密钥回退与 CORS 前缀匹配的风险和生产验收清单。
机车零售后端的库存账本：领域拆分、操作审计与并发一致性：从库存流水、事务锁、批量与扫码操作出发，梳理可审计的零售库存写入边界。
Node.js AI 网关的真流式输出：SSE、背压与安全隔离：从脱敏静态审阅出发，拆解整段缓冲、增量透传、断连取消、SSE 解析、会话隔离与日志边界。
Node.js Streams 实战：背压、pipeline 与大文件处理：用可运行示例讲清 Readable/Writable/Transform、背压传播、取消、HTTP 文件处理与内存边界。

全栈专题深读

让技术文档中的流程图和数据图真正可读：Mermaid 与 ECharts 实战：从语法白名单、按需渲染、尺寸管理、降级和可访问性，构建可维护的文档图表能力。
电子书权限不能只藏按钮：从书架列表到文件下载的服务端授权：把书架、详情、原件、转换产物、缓存和审核放进同一张权限矩阵，逐请求检查授权。
API 网关要保留上游状态码：让权限、限流和故障能被客户端识别：从代理响应、超时和流式转发构建可靠 HTTP 契约，区分业务拒绝与上游故障。
权限系统设计：ADMIN、EDITOR、VIEWER、USER 如何分工：建立角色能力矩阵，再用对象级规则、默认拒绝、立即撤权和负向测试补足菜单权限。
从 PRD 到上线放量：全栈需求交付检查表：把产品目标、接口/数据契约、测试、观测、灰度和复盘连成需求交付闭环。
SSE 与流式接口：从后端输出到前端体验：定义可恢复事件协议、取消传播、代理缓冲、增量渲染和状态收尾，而非只把 token 逐字打印。
全栈灰度发布：让上线从赌博变成可回退流程：以对照指标、小步放量、可逆配置和兼容迁移控制发布风险，定义停止与回退条件。
在线 Demo 系统设计：让文章里的代码真的跑起来：按纯前端、静态隔离、受控 API 与不可信代码执行分级，明确每级的隔离、资源和数据边界。
把本地插件变成博客在线实验室：从私有项目到公开 Demo：将本地插件拆成可公开能力，经过代码、依赖、许可、隐私和性能检查后再独立接入。
前端接入大模型能力的工程清单：比较本地、远程与混合方案，并检查权限、消息协议、取消、资源预算和隐私边界。
嵌入式 AI 插件的公开工程入口：用宿主授权、消息协议、最小写入与可靠降级组织插件能力；模型方案另见前端 AI 工程清单。
全栈功能从 0 到上线：需求拆解、接口、埋点、灰度与复盘：以一次功能迭代为主线串起责任分工、接口联调、数据验证、逐步放量和复盘。
个人服务器治理：让项目位置、服务、日志和备份都可控：建立项目清单、服务映射、权限隔离、可验证备份和逐项目部署回滚流程。
PostgreSQL 备份与恢复演练：从逻辑备份、校验、保留策略到隔离恢复验证，先证明能恢复再谈备份成功。
后台可配置化设计：哪些内容应该进配置中心：用变更频率、责任人、风险和回滚价值筛选配置项，再通过 schema、权限、审计和缓存治理。
电子书在线阅读体验设计：格式、权限、转换、进度和移动端：按格式能力区分直读与转换，并把书架发现、阅读控制、进度同步和失败恢复设计成完整流程。
羽毛球活动平台的全栈拆分：小程序、管理端与 API：从个人项目源码复盘三端职责、活动领域建模、报名名额并发与线上验证边界。
从多端商品浏览到报价清单：一次跨端零售全栈复盘：以个人项目源码为线索，梳理多端页面、购物车持久化与报价草稿，并给出可信价格、幂等和跨端验收的工程边界。
插件式游戏中心的目录与播放边界：一次工程复盘：从可筛选的游戏目录、独立播放视图和双构建目标出发，梳理第三方内容的隔离、消息与移动端验收边界。
浏览器端图像编辑器：把编辑操作组织成 Canvas 渲染流水线：从个人图像编辑源码拆解编辑状态、裁切坐标、变换顺序、导出与大图资源管理。
多绘图库插件工作台：工具适配器、路由状态与草稿自动保存：复盘多种 2D/3D 绘图库的工具适配、URL 选项、嵌入草稿保存和生命周期边界。
库存与报价后台：把批量操作做成可追溯的业务流程：从个人管理台源码观察库存批量出入库、扫码、操作日志与报价列表，并梳理服务端必须承担的业务约束。
写作陪伴插件：编辑增量检测、声音反馈与隐私边界：拆解编辑器文本检测、关键词反馈、TTS 降级、取消回退与资源生命周期，并标明宿主和服务端验收边界。
Express 与 Sequelize 业务 API：权限、报价和库存事务：从一次匿名化的 Express/Sequelize 静态审阅出发，梳理路由中间件、报价可信边界、库存流水和首次管理员引导。
从定制表单到全景预览：跨端互动配置器的端到端设计：依据一份匿名化历史笔记复盘配置、资源预览、平板扫码续接与后台内容管理，并把已知事实和现代设计建议分开。
桌面游戏助手的三条技术链路：约束求解、本地 OCR 与音频样本匹配：复盘有界容器求解、本机 OCR 与音频样本排序，区分当前最佳、已证明最优和仍未校准的真实环境能力。
本机 AI 适配器复盘：浏览器会话、回环隔离与伪流式响应：复盘本机浏览器会话、回环访问、日志与重试边界，说明兼容 stream 参数并不代表实时增量输出。

前端专题深读

CSS 圆角实战：border-radius、椭圆半径与内容裁切：掌握四角简写、椭圆半径和百分比参照，并区分圆角绘制与子元素裁切。
CSS 2D 变换：坐标系、原点、顺序与布局边界：用 translate、rotate、scale 和 skew 理解视觉坐标变换，避免把 transform 当成布局。
CSS 3D 变换：透视、preserve-3d 与可访问交互：厘清透视、3D 空间保留和背面可见性，构建内容仍可读的轻量翻转效果。
Flexbox 布局实战：主轴、弹性尺寸与移动端溢出：从一维轴线和 free space 入手，理解 grow/shrink/basis、换行、对齐和 min-content 溢出。
Canvas 绘字与坐标变换：TextMetrics、基线和状态栈：厘清文字基线、测量宽度、局部变换和设备像素比，写出清晰且不模糊的 Canvas 示例。
Canvas 动画工程实践：requestAnimationFrame、停启与时间步长：用时间戳驱动状态而不是按帧计数，处理后台暂停、减少动态效果和动画销毁。
HTML input 类型选择：语义、原生校验与安全边界：按数据语义选择输入控件，理解原生约束、自动填充、文件上传提示与服务端校验。
CSS 基础与层叠：选择器、优先级和 DevTools 排错：从规则语法到层叠算法，定位声明为何未生效，避免把所有问题归结为选择器权重。
离线缓存迁移：从已淘汰的 AppCache 到 Service Worker：识别 AppCache 遗留配置，按资源类型迁移到 HTTP 缓存、Service Worker 与 Cache API。
DOM 就绪与异步请求：从 jQuery Ajax/JSONP 迁移到 Fetch：区分 DOMContentLoaded 与 load，处理请求失败、取消、竞态和跨域边界。
React Hooks 现代指南：状态、Effect 清理与性能判断：更新旧 Hooks 笔记中的生命周期类比，讲清状态更新、Effect 同步、取消竞态和性能优化。
React Router 迁移实战：v5 到 v8、路由模式与权限边界：从 v5 的 Switch/useHistory 迁到 v6-v8：逐版核对 API、数据模式、嵌套布局、错误边界与生产回退。
响应式 CSS 实战：媒体查询、容器查询与无障碍偏好：从设备宽度清单转向内容驱动布局，覆盖视口、组件容器、打印和减少动态效果。
JavaScript 语言基础：类型、运算符、脚本加载与精度：把早期 JS 入门笔记里的类型、短路、脚本加载和浮点问题放进现代 ECMAScript 与浏览器语境。
JavaScript 内置对象实战：Math、字符串、随机数与字符统计：梳理静态方法与实例方法、随机数边界、字符串替换和 Unicode 字符计数。
JavaScript 原型链实战：对象继承、Unicode 映射与模块边界：从字符映射和对象查找解释原型链，避免全局变量、原型污染与过时兼容代码。
JavaScript 对象设计与 DOM 安全：封装、继承和随机布局：把表格渲染、构造函数、原型复用、浅拷贝和随机位置练习改成安全可维护的实现。
JavaScript 函数与迷你游戏对象模型：this、call、apply 和清理：以网格食物对象为例说明函数值、构造器、随机边界、this 绑定和生命周期。
现代 DOM 节点与列表渲染：选择器、遍历和事件委托：替代旧浏览器节点兼容封装，讲清节点与元素、静态查询、属性操作和安全动态列表。
现代浏览器事件：监听器生命周期、冒泡与安全表格：用 addEventListener、AbortController 和事件委托替代 attachEvent，解释传播与默认行为。
JavaScript 闭包与递归：状态封装、回调和调用栈边界：从词法环境和 this 绑定讲清闭包，再为递归补上终止条件、输入约束与栈深保护。
Vue 3 基础速查：模板、组件通信、响应式与生命周期：把旧 Vue 基础问答改成版本明确的学习路线，涵盖指令、组件、状态、生命周期和安全。
JavaScript 知识地图：按问题组织基础、浏览器与工程化：把零散每日笔记整理成可以持续维护的知识目录，并按实际开发问题建立学习顺序。
DOM 查询与安全更新：选择器、文本节点和事件清理：现代化旧 DOM 速查，解释 querySelector、文本更新、属性设置、节点创建与生命周期清理。
JavaScript 深拷贝与正则校验：数据边界、Unicode 和输入契约：区别浅拷贝和结构化克隆，指出 JSON 克隆限制，并用整串格式校验而非脆弱的复杂正则。
JavaScript 对象与工厂函数：原型共享、属性检查和引用语义：从旧工厂模式示例延伸到 class、原型方法、own property 检查和对象引用的准确语义。
浏览器事件传播与 BOM：捕获、冒泡、History 和页面生命周期：把旧式事件兼容代码升级为标准事件模型，并澄清导航、页面加载和定时器边界。
JavaScript 原型链与包装对象：继承查找和安全扩展：保留原型共享的核心概念，替换非标准 proto 用法并说明原生对象扩展与类型判断风险。
JavaScript 类型转换与调试：从输入值到可靠判断：厘清 Number、parseInt、truthy、NaN 和浏览器调试，避免把隐式转换当成业务校验。
JavaScript 作用域与变量提升：var、let、const 和暂时性死区：用执行上下文、块级作用域和闭包解释变量提升，淘汰“未声明变量会自动全局化”的旧说法。
JavaScript 函数与字符统计：参数、Unicode 和 Map 的正确用法：从函数参数与引用语义出发，安全统计文本字符，并区分码元、码点和用户感知字符。
前端表单校验与密码体验：原生约束、可访问提示和服务端验证：用 HTML 原生约束改善交互，以服务端校验和安全密码策略守住真正的信任边界。
DOM 事件、URL 与安全渲染：从点击处理到可靠导航：用事件委托和 URL API 实现可维护交互，避免把不可信文本或跳转地址直接拼进页面。
前端计时器与布局测量：用 requestAnimationFrame 和 ResizeObserver：区分计时器与渲染帧，正确清理动画和尺寸监听，并避免强迫式倒计时等误导交互。
Vue Router 与状态管理：版本辨析、路由参数和守卫边界：识别 Vue Router 3/4 API 差异，正确组织动态路由、导航守卫和应用状态。
Vue Mixins 迁移到 Composables：复用逻辑与清理副作用：保留旧 mixin 的维护知识，说明命名冲突与钩子合并，并用 composable 建立清晰依赖。
前端错误监控体系：从白屏、接口异常到用户行为回放：把错误采集、白屏检测、版本关联、隐私脱敏与告警处置连成可验证的线上闭环。
中文错别字检测：端侧模型、词典与编辑器位置的工程边界：从模型推理、文本映射、隐私和安全替换边界理解浏览器内校对。
前端性能预算：从 Lighthouse 分数到真实用户体验：用字段数据、实验室测试、资源体积和主线程预算共同管理性能，避免单看 Lighthouse 分数。
浏览器缓存策略：HTTP 缓存、Service Worker 与前端资源版本：按资源可变性和隐私划分缓存层，处理协商验证、Service Worker 更新和旧版本回滚。
WebSocket 实战：连接状态、心跳、重连和消息协议：以有界状态机处理断线、鉴权、心跳、消息确认、顺序与浏览器生命周期。
前端 Agent 流式展示：产品状态机、Fetch 与 SSE 分帧：从传输选择、UTF-8 分片和 SSE 协议解析，到取消、重连、增量渲染与读屏体验，搭建可靠的 Agent 输出链路。
移动端页面生命周期与 bfcache：保存草稿、暂停任务、恢复连接：区分隐藏、冻结、恢复与终止，设计可靠的草稿保存、后台任务暂停和前进后退恢复流程。
跨标签页事件总线设计：消息协议、存储降级与并发控制：按消息广播、持久化、共享执行和互斥锁分别选 API，解决多标签登出、缓存失效与重复后台任务。
前端权限 UI 设计：按钮隐藏、路由守卫与后端校验的边界：用语义化能力控制菜单与交互，同时把对象授权、默认拒绝和审计留在服务端。
IntersectionObserver 实战：曝光、懒加载、目录高亮和无限列表：用明确 root、threshold 和生命周期管理实现可去重的懒加载、阅读目录与无限列表。
Web Worker 实战：把重活从主线程搬出去：以可取消任务、消息协议、可转移对象和容量限制将计算移出主线程。
Three.js 入门：在技术博客中嵌入一个不会空白的 3D 场景：从容器尺寸、相机、加载状态、移动端预算到 GPU 资源释放，搭建稳定的文章内 3D 预览。
前端登录态与 Token 管理：Cookie、BFF、刷新和退出：从登录态架构选择开始，厘清 Cookie、浏览器存储、刷新、401/403、多标签登出与服务端授权边界。
现代 JavaScript 日常手册：数据、异步、模块与 DOM 安全：把零散语法清单整理成日常判断方法：值与引用、数组对象、异步控制、模块边界和安全 DOM 更新。
现代前端面试知识地图：从浏览器原理到工程决策：把旧题库升级成可验证的知识地图：每个问题都从机制、适用边界、失败模式和验证方法作答。
Vue Router 导航守卫实战：路由复用、离开确认与异步竞态：区分 Vue Router 3 的 next 回调与现代返回式守卫，处理动态参数复用、异步加载、未保存离开和导航失败。
React 入门实战：从旧版 CRA 到组件、状态与列表渲染：修正 Create React App 和 ReactDOM 旧入口知识，串起 JSX、组件、状态快照、事件、列表 key 与 Effect 边界。
React 组件与 state：状态归属、更新与表单建模：区分 props、组件状态、共享状态与服务端状态，掌握状态提升、不可变更新和表单建模。
React 条件渲染与列表：key、空状态和组件身份：理解分支渲染、稳定 key 和组件身份，避免 0 泄漏、列表输入错位与状态意外丢失。
React 生命周期迁移：Class、Effect 与清理语义：把 class 挂载/更新/卸载放回外部同步模型，区分 render、事件、副作用清理与错误边界。
React Props 与类型校验：从 PropTypes 迁移到 TypeScript：梳理必填/可选 props、联合类型、默认值、children 与 ref，并纠正 React 19 对 PropTypes 的变化。
HTML 入门：从文档结构到语义、可访问性与浏览器解析：重整旧 HTML 简介，讲清文档树、标签属性、语义结构、链接表单和浏览器错误恢复。
HTML head 元素实战：标题、元数据、资源与脚本加载：更新 title、meta、base、link 与 script 的实际行为，避免旧式 head 示例带来的全站链接和加载陷阱。
CSS 过渡实战：状态变化、性能、事件与减少动态效果：从旧 transition 属性清单升级为可维护的状态过渡，处理 hover 抖动、transitionend 和减少动态效果。
jQuery 入门与遗留项目维护：选择器、事件和安全更新：保留旧笔记的核心知识，修正 ready、DOM 对象和事件写法，并补充安全更新与渐进迁移方法。
React 面试题校正版：Hooks、状态、路由与性能边界：把旧题库中 React Router v5 API、生命周期和优化口号逐条校正，并补上可解释的工程答案。
ahooks 实战指南：useRequest、闭包、SSR 与依赖治理：将旧版 ahooks 3.0 宣传稿更新为当前用法指南，厘清请求取消、闭包、SSR 和版本兼容边界。
HTML 音视频实战：格式回退、字幕、加载与无障碍：从容器与编码、source 回退到字幕和移动端加载，整理浏览器原生媒体的可靠实现边界。
HTML 拖放 API：DataTransfer、文件投放与触屏替代方案：梳理拖放事件、数据边界和文件投放，为触屏与键盘用户提供同等操作路径。
移动端 Web 与响应式布局：从 WAP 时代到内容优先：把 WAP 与 UA 判断旧笔记更新为内容优先布局、响应式图片和跨设备验收。
CSS 动画工程实践：关键帧、性能、取消与减少动态效果：从关键帧、动画生命周期到性能与无障碍偏好，避免动态效果拖垮体验。
JavaScript 数组实战：筛选、转换、排序与不可变更新：按任务选择数组方法，避免误用 reduce、原地排序和浅拷贝造成的状态串改。
JavaScript 字符串实战：Unicode、搜索、替换与安全输出：区分 UTF-16、码点和用户感知字符，并正确处理搜索、格式化、URL 与不可信文本。
JavaScript 对象实战：属性访问、浅拷贝与安全字典：掌握对象属性与拷贝语义，处理动态键、可选值和不可信对象输入。
JavaScript 常见问题排查：类型、异步、闭包与 DOM：把零散高频坑整理成可复现的排查路径，覆盖类型转换、异步请求、事件和安全渲染。
ES2015（常称 ES6）核心特性：作用域、模块、集合与异步：用现代代码理解 ES2015 核心语法，并分清语法糖、浅拷贝和运行时支持。
ES2016–ES2019 新特性：按版本理解数组、对象与异步：按年份梳理 ES2016 到 ES2019 的代表能力，澄清 ES2020 特性和构建兼容边界。
JavaScript 核心概念地图：作用域、原型、this、闭包与 DOM：用现代规范替换预解析口诀，串起值语义、原型、闭包、this 与事件处理。
JavaScript 高频问题：数组回调、变量作用域与跨域边界：修正集合方法与变量提升误区，并用同源策略、CORS 与 JSONP 的真实边界排查跨域问题。
HTML 通用容器与链接：从 body、div、a 到语义化页面：把旧 body/div/a 属性表改成页面结构实践，区分导航链接、操作按钮与纯视觉样式。
HTML 标题、列表与表格：让内容结构可理解：用标题、列表和真正的数据表格表达内容关系，不再依赖旧式 type、align、cellpadding 属性。
HTML 表单扩展元素：datalist、output 与 keygen 的现代边界：讲清 datalist 只是建议、output 不参与表单提交，并纠正已经从标准移除的 keygen。
HTML 表单属性实战：autocomplete、form、约束与提交行为：逐个厘清自动填充、跨位置关联、提交按钮覆盖与原生约束验证，不再照抄过期兼容表。
jQuery 选择器与筛选：把旧页面交互改成可维护结构：重整交集、并集、层级和索引筛选，解释零基序号陷阱，并用语义 HTML 管理菜单与高亮。
jQuery 类名、DOM 生命周期与动画队列：修复重复触发：用幂等 class 状态和有边界的事件管理替代旧式开关灯脚本，正确处理节点清理、动画队列和减少动态效果。
jQuery 筛选、轮播与几何测量：区别 offset、position 和滚动距离：用准确的盒模型和坐标系替代旧式 left/top 口诀，并把城市筛选与轮播改成可访问、可触屏的交互。
jQuery 旧项目维护与迁移地图：ready、事件、Ajax、性能和 jQuery 4：把分散的 jQuery 口诀整理成项目维护清单，区分 DOM ready/load、原生节点与包装集合，并拆分不属于前端的 PHP 内容。
HTML 图片、列表与链接：从旧属性迁移到响应式语义：重整旧图片、图像映射、自定义列表、文本语义、URL、实体与颜色笔记，补上无障碍、移动端和安全边界。
现代 HTML 与 HTML5：文档解析、语义结构和 Web API 边界：纠正过时的 HTML5 版本叙述和文档大纲误区，说明 doctype、字符编码、语义元素、解析恢复与能力检测。
Canvas 2D 路径与形状：从坐标系到可维护绘制：用完整渲染循环讲清 Canvas 上下文、矩形、路径、弧线、贝塞尔曲线、描边/填充和画布重置边界。
Canvas 2D 样式、渐变与图案：管理绘图状态和跨域图片：串起颜色、透明度、线型、渐变、纹理、阴影、save/restore 与跨域画布污染，说明绘图状态如何影响后续命令。
React 知识地图：组件、状态、事件与工程实践：从 JSX 与协调模型出发，厘清函数/类组件、状态快照、事件、表单、引用、代码分割和旧项目迁移边界。
Uni-app 红黑扑克模拟游戏复盘：跨端边界、计时器与牌型 Bug：基于公开源码静态审阅一款红黑扑克模拟游戏，定位首局计时器崩溃、错误同花判断、偏差洗牌、H5 API 跨端失配与固定布局问题。
老前端面试题库仓库复盘：Docsify、Service Worker 与知识维护：逐项盘点公开题库的 25 条索引，区分本地占位与原始外链，再复核 Docsify、Service Worker、移动端和内容质量。
View Transition API 实战：SPA、跨文档导航与渐进增强：区分同文档与跨文档转场，用渐进增强、唯一快照名称和减少动态效果偏好改善导航连续感。
Taro + Zustand 跨端购物清单：本地持久化与报价边界：从真实多端客户端的购物清单实现出发，拆解存储校验、身份键、失败恢复、金额精度与报价提交边界。
React 管理后台登录态复盘：路由守卫、请求竞态与批量表单：从个人管理端源码审阅路由认证、401/403、搜索分页竞态和库存批次表单，厘清客户端体验与服务端授权的边界。
React 管理端库存与报价列表：扫码状态、分页与请求竞态：从扫码历史闭包、搜索分页和敏感字段展示出发，整理管理端异步状态与数据边界的实战检查方法。
Taro 多端客户端状态一致性：登录、收藏、主题与评论：源码级复核 Taro 客户端的会话清理、账号隔离、主题持久化与评论异步竞态，并明确跨端验证边界。
Vite/React 运营管理台复盘：路由权限、图片上传与列表竞态：从一个脱敏的个人运营管理台源码，复盘前端角色门禁、持久化会话不一致、第三方图片凭据与异步状态竞态。
Taro 车型筛选复盘：筛选项与查询参数必须闭环：从多条件车辆目录的真实源码出发，定位 UI 选项与请求参数脱节，并整理筛选计数、输入校验和过期响应的验收方法。
Taro 详情页请求状态机：失败不能永远像加载中：从跨端详情页源码定位无 id、空结果与请求异常卡在加载态的问题，并给出状态建模、重试和乱序响应验收方案。