前言
- 之前写过一篇两年半，50W的offer，三本，普通前端如何打好自己的牌被喷的哦哦叫，其实是真的，很多人都想让我整理一个面试复习大纲，
我自己也想整理归总一下，看过的很多优秀文章（大部分都看过移动端的看的较少，书籍），所以它来了，因为努力所以看的见，文章比较长，注意头发，希望对你们有所帮助 - 思维导图太大，就不放出来了，截图是一个阉割版的，链接在文末。
es5/6/7/...
- 【译】理解 Javascript 执行上下文和执行栈
- JavaScript中的这些骚操作，你都知道吗？
- JS 高级之手写一个Promise,Generator,async和 await【近 1W字】
- JS 原生面经从初级到高级【近1.5W字】
- JS开发必须知道的41个技巧【持续更新】
- 「中高级前端面试」JavaScript手写代码无敌秘籍
- JavaScript 工具函数大全（新）
- 这应该是你见过的最全前端下载总结
- 【建议👍】再来40道this面试题酸爽继续(1.2w字用手整理)
- ES9已经来了 Are you ready?
- 💦【何不三连】做完这48道题彻底弄懂JS继承(1.7w字含辛整理-返璞归真)
- ES6 完全使用手册
- JavaScript专题系列20篇正式完结！
- 正则表达式不要背
- 前端大文件上传
- 2万字 | 前端基础拾遗90问
- 9k字 | Promise/async/Generator实现原理解析
- 🎉喜大普奔，ES2019登场
- Axios 如何取消重复请求？
- 这些高阶的函数技术，你掌握了么
- 你不知道的 Proxy
- JavaScript 那些写出来会被同事揍的骚操作
- 书到用时方恨少，一大波JS开发工具函数来了
- 这些一行 JS 实现功能的代码，让你看起来像一个前端专家
- 【干货】js 数组详细操作方法及解析合集
- [js基础-面试官想知道你有多理解call,apply,bind？[不看后悔系列]](https://juejin.cn/post/684490...
- 最详尽的 JS 原型与原型链终极详解，没有「可能是」。（一）
- JavaScript深入之作用域链
- 深入理解 JavaScript Event Loop
- 一次弄懂Event Loop（彻底解决此类面试问题）
- 浏览器与Node的事件循环(Event Loop)有何区别?
- 从event loop规范探究javaScript异步及浏览器更新渲染时机
- JavaScript 函数式编程到底是个啥
- JavaScript 性能利器 —— Web Worker
- ES6、ES7、ES8特性一锅炖(ES6、ES7、ES8学习指南)
- 1.5万字概括ES6全部特性(已更新ES2020)
- 25个你不得不知道的数组reduce高级用法
- 当 async/await 遇上 forEach
- BAT前端经典面试问题：史上最最最详细的手写Promise教程
- 100 行代码实现 Promises/A+ 规范
- 详解JS原型链与继承 JavaScript
css
- css加载会造成阻塞吗
- CSS设置居中的方案总结-超全
- rem布局解析
- 彻底搞懂CSS层叠上下文、层叠等级、层叠顺序、z-index
- CSS 实现多行文本“展开收起”
- 不可思议，纯 css 都能图片滚动
- Web开发者需要知道的CSS Tricks
- 十几个CSS高级常见技巧汇总（虚线框、三角形、优惠券卡券、滚动条、多行溢出...）
- 字节跳动最爱考的前端面试题：CSS 基础
- 一种巧妙的使用 CSS 制作波浪效果的思路
- 灵活运用CSS开发技巧
- 45个值得收藏的 CSS 形状
- 9个很棒的CSS边框技巧
- 详解 CSS 七种三栏布局技巧
- 【图片版】GRID，一起来学习CSS网格布局吧！
- CSS 的预处理程序（Sass、LESS、Stylus 等）分别都有哪些优缺点？
- 浏览器将rem转成px时有精度误差怎么办？
ts
- 这些高阶ts内置泛型帮助类型，你用过几个
- Vue3.0之前你必须知道的TypeScript实战技巧
- 一份不可多得的 TS 学习指南（1.8W字）
- TypeScript安利指南
- TS 常见问题整理（60多个，持续更新ing）
- Typescript+Vue大型后台管理系统实战
- TypeScript 中高级应用与最佳实践
- 三万字长文）类型即正义：TypeScript 从入门到实践系列，正式完结！
- TypeScript - 一种思维方式
- Vue3 跟着尤雨溪学 TypeScript 之 Ref 类型从零实现
- 让人眼前一亮的 10 大 TS 项目
- 三千字讲清TypeScript与React的实战技巧
- 总结TypeScript在项目开发中的应用实践体会
- TS 常见问题整理（60多个，持续更新ing）
- 可能是你需要的 React + TypeScript 50 条规范和经验
vue2/3
- Vue3自定义指令-10个常见的实用指令，带详细讲解，快拿去收藏！！！
- Vue3 究竟好在哪里？（和 React Hook 的详细对比）
- Vue 项目性能优化 — 实践指南（网上最全 / 详细）
- Vue 开发必须知道的 36 个技巧【近1W字】
- Vue3.0 新特性以及使用经验总结
- 阮一峰推荐】学习 vue3 源码的利器
- Vue3 的响应式和以前有什么区别，Proxy 无敌？
- Vue3.0 前的 TypeScript 最佳入门实践
- 抄笔记：尤雨溪在Vue3.0 Beta直播里聊到了这些…
- Vue最全知识点，面试必备（基础到进阶，覆盖vue3.0，持续更新整理，欢迎补充讨论
- 简单通俗的理解Vue3.0中的Proxy
- Vue3 DOM Diff 核心算法解析
- 深入了解 Vue3 响应式原理
- Webpack5 基础 & Vue3 项目搭建
- Vue.js 升级踩坑小记
- [[Vue官方教程笔记]- 尤雨溪手写mini-vue](https://juejin.cn/post/691189...
- Vue 3.0 自定义指令的这些知识你掌握了么？
- Vue 应用性能优化指南
- 性能优化之组件懒加载: Vue Lazy Component 介绍
- VirtualDOM与diff(Vue实现)
- 聊聊 Vue.js 组件间通信
- Vuex 源码解析
- 聊聊Vue.js的template编译
- 在vue项目中 如何定义全局变量 全局函数
- [Vue的钩子函数[路由导航守卫、keep-alive、生命周期钩子]](https://juejin.cn/post/684490...
- Vue 组件间通信六种方式（完整版）
- 详解vue的diff算法
- 面试官: 实现双向绑定Proxy比defineproperty优劣如何?
- 虚拟 DOM 到底是什么？(长文建议收藏)
- 生命周期
react
- 将 React 应用优化到 60fps
- 如何提高你的 React 应用的性能
- 如何评价React的新功能Time Slice 和Suspense？
- 浅入浅出图解domDIff
- 你真的理解setState吗？
- React 中的高阶组件及其应用场景
- [[译] 如何写出更好的 React 代码？](https://juejin.cn/post/684490...
- setState 之后发生了什么 —— 浅谈 React 中的 Transaction
- React 同构实践与思考
- Immutable 详解及 React 中实践
- 十五分钟读懂React 17 | 🏆 技术专题第六期征文
- React v17.0 RC版本发布：无新特性（译）
- React Hooks 最佳实践
- 这可能是最通俗的 React Fiber(时间分片) 打开方式
- React 开发必须知道的 34 个技巧【近1W字】
- 精读《useEffect 完全指南》
- 一起学习造轮子（三）：从零开始写一个React-Redux
- React 中的五种组件形式
- [[实战] 为了学好 React Hooks, 我抄了 Vue Composition API, 真香](https://juejin.cn/post/684490...
- 1w字 | 从零开始的React服务端渲染
- React Hooks 性能优化的正确姿势
- 手把手带你用85行代码实现一个React.js（详细讲解）
- React 源码剖析系列 － 生命周期的管理艺术
- React Hooks 详解 【近 1W 字】+ 项目实战
- React SSR 详解【近 1W 字】+ 2个项目实战
- 分析React.createRef和React.useRef
node
- 一个开箱即用，功能完善的 Express 项目
- 《大前端进阶 Node.js》系列 P6必备脚手架/CI构建能力
- 基于nodeJS从0到1实现一个CMS全栈项目（上）
- 浏览器与Node的事件循环(Event Loop)有何区别?
- 零基础实现node+express个性化聊天室
- 深入理解 Node.js 进程与线程
浏览器
- Chrome DevTools中的这些骚操作，你都知道吗？
- 面试官: 你了解前端路由吗?
- 在浏览器中使用 ECMAScript Modules
- 前端开发的你应该知道的浏览器知识
- (1.6w字)浏览器灵魂之问，请问你能接得住几个？
- 反直觉！浏览器到底是如何下载资源的
- 傻傻分不清之 Cookie、Session、Token、JWT
网络
- 设计一个无懈可击的浏览器缓存方案：关于思路，细节，ServiceWorker，以及HTTP/2
- 关于三次握手与四次挥手面试官想考我们什么
- 面试带你飞：这是一份全面的 计算机网络基础 总结攻略
- 前端性能优化总结
- 前端性能优化 24 条建议（2020）
- （建议精读）HTTP灵魂之问，巩固你的 HTTP 知识体系
- 17K star 仓库，关于网络相关的前端面试题 90% 都有答案
- 前端词典】进阶必备的网络基础（上）
- 浅谈 HTTP/2 Server Push
- 怎样把网站升级到http/2
- 从实践出发理解HTTP2
- 大部分流量皆已使用新协定QUIC和HTTP/3
- Google、Facebook等均开始支持的HTTP3到底是个什么鬼？
- 五千多字，图文并茂详解HTTP报文格式、请求响应头、cookie以及HTTPS加密方式
- 看图学HTTPS
性能优化
- 移动spa商城优化记（一）---首屏优化篇
- 前端黑科技：美团网页首帧优化实践
- 项目不知道如何做性能优化？不妨试一下代码分割
- 揭秘 Vue.js 九个性能优化技巧
- 前端性能优化之加载技术
- 当面试官问你如何进行性能优化时，你该这么回答
- 还在看那些老掉牙的性能优化文章么？这些最新性能指标了解下
- 网站性能优化实战——从12.67s到1.06s的故事
- 聊一聊前端性能优化
- 工作中如何进行前端性能优化(21种优化+7种定位方式)
- CSS性能优化的8个技巧
- 重构 - 改善代码的各方面问题
- 前端优秀实践不完全指南
- 滚动视差？CSS 不在话下
工程化/架构/设计模式
- 不好意思！耽误你的十分钟，让MVVM原理还给你
- 让虚拟DOM和DOM-diff不再成为你的绊脚石
- 发布订阅模式，在工作中它的能量超乎你的想象
- webpack4-用之初体验，一起敲它十一遍
- Webpack5 上手测评
- Webpack5 新特性业务落地实战
- webpack教程：如何从头开始设置 webpack 5
- Webpack 5模块联邦引发微前端的革命？
- 玩转 webpack，使你的打包速度提升 90%
- 万字长文：关于sourcemap，这篇文章就够了
- 做了一夜动画，让大家十分钟搞懂Webpack
- 「吐血整理」再来一打Webpack面试题
- webpack4 的30个步骤打造优化到极致的 react 开发环境，如约而至
- webpack详解
- webpack打包原理 ? 看完这篇你就懂了 !
- 备战2021：vite工程化实践，建议收藏
- Vite 原理浅析
- 面向未来的前端构建工具-vite
- 一个基于vue3+vite+ts的完整项目
- 尤雨溪 3 天 10 更的 Vite 究竟有什么魔力？
- Rollup打包工具的使用（超详细，超基础，附代码截图超简单）
- 一文带你快速上手Rollup
- 携手Rollup与TS造轮子
- 无用代码去哪了？项目减重之 rollup 的 Tree-shaking
- 从0到1教你搭建前端团队的组件系统（高级进阶必备）
- Rollup 之插件机制浅析
- 大型项目前端架构浅谈（8000字原创）
- 以前端架构师身份，从零开始搞事搞事搞事
- 分享阿里前端p7架构图谱
- 有赞权限系统
- 每日优鲜供应链前端团队微前端改造
- 分享狼叔关于《大前端工程化的实践与思考》
- 深入浅出 Babel 上篇：架构和原理 + 实战
- 在前端业务场景下的设计模式
- 工作效率upup，一起来实现一个Node.js-CLI开发工具吧
- 关于现代包管理器的深度思考——为什么现在我更推荐 pnpm 而不是 npm/yarn?
- npm 删除依赖包_npm 依赖管理中被忽略的那些细节
- 绝了，没想到一个 source map 居然涉及到那么多知识盲区
- 前端模块化详解(完整版)
- 三年 Git 使用心得 & 常见问题整
- 体积减少80%！释放webpack tree-shaking的真正潜力
flutter/rn/Electron
- 分享这半年的 Electron 应用开发和优化经验
- Flutter 开发踩坑记录（干货总结
- Flutter 面试知识点集锦
- Flutter完整开发实战详解(一、Dart语言和Flutter基础) | 掘金技术征文
- 国内大厂在移动端跨平台的框架接入分析
- React Native 性能优化指南【全网最全，值得收藏】
- 🎯【深入解析】跨端框架的核心技术到底是什么？
- Flutter VS React Native VS Native，谁才是性能之王
- React Native App应用架构设计
- React Native 原理与实践
- React Native学习资源汇总
- 云音乐 React Native 优化实践之拆包与预热
- 为什么国内的uniapp一直没人讨论呢？
- React Native 持续部署实践— push 代码构建出新版的 Growth
- 如何利用 Electron 开发一个桌面 APP
- 想要试试Electron ，不如看看这篇爬坑总结
- 用 Electron 和 React 撸了个功能超全 + 颜值极高的音乐客户端
- Android 性能优化最佳实践
- Android Webview H5 秒开方案实现
- 近两万字小程序攻略发布了
- Flutter 手势原理
- Electron桌面端所见即所得-Electron练习生
- 写给前端工程师的Flutter教程
面试经验
- 必须要会的 50 个 React 面试题
- 30 道 Vue 面试题，内含详细讲解（涵盖入门到精通，自测 Vue 掌握程度）
- 2020最新：100道有答案的前端面试题（上）
- 世界顶级公司的前端面试都问些什么
- 前端面试考点多？看这些文章就够了（2019年6月更新版）
- 面试官(6): 写过『通用前端组件』吗?
- 【1 月最新】前端 100 问：能搞懂 80% 的请把简历给我
- 霖呆呆的中大厂面试记录及2年前端薪资对比(附赠学习方法)
- 阿里前端攻城狮们写了一份前端面试题答案，请查收
- 前端，社招，面淘宝，指南
- 聊聊前端面试
- 最全的手写JS面试题
- 最全的 Vue 面试题+详解答案
- 10种跨域解决方案（附终极大招）
- 字节跳动最爱考的前端面试题：JavaScript 基础
- 跳槽人速来，面经&资源分享
- 字节跳动今日头条前端面经（4轮技术面+hr面）
- 看完跳槽少说涨 5 K，前端面试从准备到谈薪完全指南（近万字精华）
- 四月前端知识集锦（每月不可错过的文章集锦）
- 几道高级前端面试题解析
- 前端笔试题面试题记录（上）
安全
- 前端安全系列（一）：如何防止XSS攻击？
- 前端安全系列之二：如何防止CSRF攻击？
- 8大前端安全问题（上）
- 《大前端进阶 安全》系列 HTTPS详解（通俗易懂）
- 前端安全问题汇总（实战）
- 当我们在谈论前端加密时，我们在谈些什么
- 15 张精美动图全面讲解 CORS
- 【面试篇】寒冬求职之你必须要懂的Web安全
开源项目
- 《吐血整理》系列 大厂前端组件库工具集合（PC端、移动端、JS、CSS等）
- 这些神仙代码库值得每一个前端开发者收藏
- 9个项目助你在2020年成为前端大神！
- 提高前端开发者效率的11个必备的网站
- 这些开源项目，让你轻松应对十大工作场景
- 前端进阶必备，github 优质资源整理分享！
部署/监控
- 谁说前端不需要懂-Nginx反向代理与负载均衡
- 【你应该了解的】详尽&全面的前端部署（从零起步，前端上线不用愁）
- 前端工程师不可不知的Nginx知识
- 去大厂，你就应该了解前端监控和埋点!
- 前端一键自动部署工具🛠
- 浅谈前端线上部署与运维
- Docker+Nginx+Jenkins实现前端自动化部署
- 一步一步搭建前端监控系统：如何记录用户行为？
- 要进大厂？前端灰度发布必须要知道
- 实战笔记：Jenkins打造强大的前端自动化工作流
- 前端必备 Nginx 配置
- 前端的Nginx知识梳理
团队规则
- ESLint里的规则教会我，无规矩 不编程
- 团队 React 代码规范制定
- 前端团队代码评审 CheckList 清单
- 有赞前端质量保障体系
- 如何保障前端项目的代码质量
- 在Typescript项目中，如何优雅的使用ESLint和Prettier
算法
杂谈
- 精读《为什么专家不再关心技术细节》
- 关于前端学习路线的一些建议（内含经典自测题）
- 还在迷茫于前端如何入门和进阶？万字指南让你不再迷茫！
- 我如何零基础转行成为一个自信的前端
- 技术栈：小菜前端的技术栈是如何规划和演进的
- 今天聊：2~4 年前端走出离职困境与舒适区
- 关于裸辞，关于前端面试
- 你累死累活做业务，绩效还不怎么样，我只能帮你到这了……
- 致2021届前端同学的一封信|砥砺前行，未来可期！
- 解密初、中、高级程序员的进化之路（前端）
- 你必须『收藏』的Github技巧
- 一个草根前端人的焦虑
- 从破解某设计网站谈前端水印(详细教程)
- 看看这些被同事喷的JS代码风格你写过多少
- Web 前端修仙指南：从小白到全栈
- 如何成为公司独当一面的工程师
- 神三元在抖音架构组的八个月，他经历了什么？
- 聊一聊加班严重时要如何自我提升
书籍推荐
css
- css世界
- css揭秘
- 深入解析CSS
js
- 红宝书系列
- 你不知道的js上中下
- js重难点实例精讲
- 深入理解es6
- js编程思想：从es5到es9
- js忍者秘籍（第二版）
- js编程精解（原书第二版）
- jsDOM编程艺术（第二版）
- js框架设计
ts
- 官方文档
- 深入理解ts
- TypeScript实战指南
框架
vue
- vue.js快跑
- vue.js前端开发技术
react
- 深入理解react-Router
- 深入浅出React和Redux
- React+Redux前端开发实战
- react进阶之路
工程化/架构
- 前端函数式演进
- Web性能实战
- 前端架构：从入门到微前端
- 大型网站技术架构
- webpack实战：入门与调优
- web前端测试与集成
node
- node10实战
- node权威指南
- Koa与Node.js开发实战
数据结构与算法
- js数据结构与算法
- 剑指offer
- 算法图解
- 大话数据结构
网络
- 图解HTTP
- 图解TCP,UDP
- HTTP/2 in Action中文版
可视化
- SVG动画
- 快学熟用D3
设计模式
- js设计模式与实战开发实践
面向未来
- PWA实战
- 深入浅出Serverless
混合APP
- Flutter 技术入门与实战
安全
- 白帽子讲web安全（纪念版）
- XSS跨站脚本攻击刨析与防御
- Web前端贺客技术揭秘
**粗体** _斜体_ [链接](http://example.com) `代码` - 列表 > 引用。你还可以使用@来通知其他用户。