前端指南
站点
基础知识
- 计算机基础
- 网络通信-HTTP/1.1, HTTP/2, HTTP/3
- 数据结构与算法
- 设计模式
- 安全
- 前端基础
- HTML
- CSS
- JavaScript
- ECMAScript 新特性 (ES6~ES2023）
- this 与作用域
- 继承
- 事件机制
- 异步编程
- 模块化
- 函数式编程
- TypeScript
- 基础
- 进阶
- 浏览器
- WebAPI
- 多进程架构
- 渲染机制
框架原理
- React
- Vue
- 组件库
- Ant Design Mobile, Ant Design
- vant, element-ui
- umi
路由
- hash, history
- vue-router
- react-router
状态管理/数据流方案
仅仅有 UI 的组件化还不够，还需要整合状态管理/data-flow 数据流方案，才能完成项目应用。
参见 state-management
- vuex, pinia
- redux
- @reduxjs/toolkit, dva
- valtio
- xState
应用开发
- Hybrid 通信原理
- 移动端常见兼容性问题
- 常见解决方案（响应式，滚动加载，虚拟滚动等）
前端工程化
- 工程搭建（环境配置、脚手架）
- 版本控制（Git 工作流、版本管理规范、代码提交规范，CHANGELOG, Gitlab）
- 代码质量（代码管理、编码规范、静态代码检查、接口规范、代码质量平台）
- 通用性/基础建设（构建工具、脚手架、SDK、基础库、组件库、工具类库等框架设计）
- 测试保障（自动化测试：单元测试、集成测试、E2E 端到端测试，测试覆盖率，测试报告，质量巡检）
- CI/CD 流程设计（代码检查、测试、打包、部署，依赖检测、自动构建，持续集成、持续交付/持续部署、Jenkins, Docker）
- APM 应用性能管理（性能、异常、白屏、API 请求 和资源的监控）
- 埋点系统（数据埋点采集、统计上报、SPM 超级位置模型、用户行为分析）
- 灰度发布系统（发布计划、灰度策略、放量策略、灰度监控）
- 资源保障（防劫持、资源加载容灾方案）
- 工程质量优化（webpack 构建优化、体积优化）
- 前端性能优化（加载链路优化、加载体积优化、感官体验优化）
构建工具
- gulp, webpack, babel, rollup
- esbuild(go), swc(rust)
- vite, bun(zig), rspack(rust), turbopack(rust)
- father
前端微服务
- 基座、路由与生命周期
- 隔离 sandbox
- 应用通信
- qiankun
管理知识
- 思维模型
- 结构化思维
- 四象限法 - 时间管理
- PDCA 循环
- GROW 法
- SMART 原则 - 目标管理
- STAR 分析法 - 关键事件
- 5W2H 分析法
- SWOT 分析法 - 企业战略制定
- WBS 任务分解法
- 团队管理
- 项目管理
最佳实践
- 请求封装
- 跨域请求
- 浏览器兼容性
- 异步并发控制
- Hybrid 通信及原理
- 上拉刷新/滚动加载下一页
- 虚拟滚动
- 防止双次点击
- HTTP 缓存配置
其他
- 权限管理，国际化，SSR, 低代码，动画，Node 框架
- 图形，容器，K8S, 编辑器，Serverless
- Blog
- 低代码：通用表单设计、通用布局设计、通用页面设计、JSON Schema 协议设计等