你好，我是被删（贝珊），或许你曾读过我的一些文章，或许你还未曾听说过我，我先简单介绍下自己。
我大学毕业去了华为，后转入腾讯，前后加入了企鹅电竞、微信支付和腾讯文档等多个业务团队，现如今在腾讯文档 Alloyteam 团队，负责核心模块的项目架构、技术方案设计等研发工作。
我特别喜欢分享，也常常会对自身工作进行阶段性思考和总结，并通过文字的形式沉淀下来。去年收到一个赞赏，对方给我打赏的同时，附了一段话：
“抱歉只有这点钱，今年没有找到工作，但是很喜欢您的文章。”
很感谢，很感动，却又很难过。最近几年，前端领域的变化可谓翻天覆地，我们从最简单开始写页面，到如今的工程化、服务端、客户端等领域，也都渐渐出现了前端开发的踪影。很多前端开发在认真埋头干活，再抬头的时候却发现自己所了解的前端，早已变了样。
不仅如此，又由于业务简单、工作内容局限等问题，很多前端开发即使把所有前端开发技术中的知识点都学习一遍，最终依然会因为工作繁忙、实践的缺失等情况只停留于“看过”的层面，工作陷入困境。
如何破局，快速进阶？
这些年来，我面试过各式各样的应届生和社招人员，最大的感受是：准备充分的应届生在面试过程中反而表现更好。
原因也很好理解，大多数公司对应届生的要求是基础不差、能干好学，即使缺乏项目实践经验，影响也不会很大。
但对于工作 1~3 年的前端开发，不仅要可以熟练使用各种前端框架、工具库，还要知其原理，能够举一反三。
但就我面试的大多数人来说，在被问及框架和工具的实现原理、在怎样的场景下该如何选择等问题时，大都缺乏自身的理解与想法。
这也是职场人普遍面临的常态：他们在日常工作中更倾向于解决问题，却很少去深度思考，比如问题“为什么”会产生。
但试想，对于一些工具的使用，大多数应届生都可以通过官方文档或百度来快速学习，如果我们还只关注完成工作内容本身，那么几年后，我们的竞争优势在哪里？
因此，我想从过来人的角度，给初中级前端同学提供两个建议。
1. 掌握前端核心专业知识，深入了解常见解决方案
打好基础，打好基础，打好基础！没有基础，进阶毫无可能。
我之前碰到过的一个例子很能说明这个问题。有一天，某个团队突然接到不少用户反馈小程序很卡很慢，其中，刚进团队的一个小伙二话不说，直接拿出常见的前端性能优化套装，一项项地比对，测试各种机型的首屏耗时、页面渲染和交互响应速度，等等，但却没有发现重点原因。
当他咨询自己的导师时，却发现导师打开了小程序开发工具一顿分析操作，不到半小时就定位了卡顿问题并解决了。
原来由于双线程的设计，小程序在setData的时候，如果过于频繁且数据量较大，就会造成卡顿，而这些问题都可以通过小程序开发工具提供的体验评分功能来发现。
你看，如果没有深入了解过小程序本身的设计原理，对它的认知只停留在前端 Web 开发中，就压根不会想到是小程序本身设计导致的性能问题。
掌握前端核心专业知识，你才能胸有成竹，快速分析定位问题，并结合项目本身给出解决方案。
2. 跳出技术执行，靠近业务搞项目
纵然我们具备完善的前端专业知识体系，如果无法应用和落地到项目中，那就是空口白话。
特别是想要进阶中高级前端开发时，足够的项目经验，独立完成技术选型、项目设计和管理等能力，以及推动方案落地和执行，就是重点了。
比如，小李接手了一个快速上线 H5 活动页面配置平台的任务，他对活动页面和自定义配置都有较丰富的开发经验，因此花一天时间就给出了这个平台的技术方案。
老板也觉得不错，然后追了一句：需要给你多少人力，可以在两周内上线这个平台？小李愣了，他平时都只关注技术，很少关注项目上线的过程是怎样的，一时有点进退两难。
最后小李决定尝试一下。但开发期间由于团队分工不明确、协作不顺畅、代码风格不一致、Bug 较多等问题，导致项目多次返工，在全员加班的情况下，依然延期了一周才上线。所以，我们在日常开发过程中，也不能只局限于专业知识，也得学会如何管理和搭建项目。
现阶段中、高级的前端开发，项目设计和管理经验更是必不可少。所以要想进阶，你得知道如何从 0 开始搭建前端项目、如何进行技术调研和选型、如何提升项目中各个阶段的开发效率，以及如何通过项目复盘而不断优化自身的项目管理经验。
课程设计
为了让你快速掌握前端核心专业知识和项目经验，我在设计课程时，主要围这两大块来讲的。
专业知识篇：核心基础。HTML、CSS、JavaScript 和浏览器作为前端最最最最核心的基础，看似简单，但很多前端开发对它们的理解不够深入。在这里，我会带你重新梳理其中的关键点，比如 JavaScript 代码是如何被执行的，比如网络请求的过程，以及浏览器页面的加载和渲染流程是怎样的，这个过程中浏览器内部是如何协作完成的，等等。
这些内容对于帮你夯实前端开发的语言和技能，以及深入理解其中的设计、机制和原理，非常有帮助。
专业知识篇：能力进阶。在掌握了核心基础内容后，我会带你了解前端开发中经常用到的工具和框架，并深入讲解它们的实现原理。同时，我还会介绍一些实用的开发技巧和思维，帮助你提升开发效率、编写出更具可读性和维护性的代码。
最后，我还会用一个实战项目来让你实学实用前面的开发技巧。这样你才会融会贯通，在开发时事半功倍，更重要的是，你在未来遇到业务问题时想到更优解。
项目经验篇：技术方案选型。这部分我会介绍一些前端项目中经常遇到的技术方案，比如应用状态管理、路由管理、监控体系搭建等。沉淀了足够的技术方案进行对比，你更能结合自身项目找到最优解。
其次，我还会教你如何进行前端技术调研，让你具备独立设计方案并落地实现的能力，从而帮助团队解决现有问题，更好地体现自身价值。
项目经验篇：项目设计与管理。当你作为一个项目的 Owner 去推动项目从搭建到上线时，你还需要了解如何进行前端项目的设计、搭建、开发，以及保证项目顺利上线。同时，我还会介绍在大型的项目中、多人的协作中，存在的一些问题和解决方案。掌握了这些解决方案和技能之后，你可以提升自己在项目中的 Owner 意识和重要性。
整个体系顺下来，我针对前端开发者的痛点问题，梳理了必备的基础知识和技术方案，以及工作中需要掌握的技能和思考方式，希望我的经验能够为你成为前端高手助力。
讲师寄语
互联网时代，不管是生活还是工作都在飞速发展。如果将计算机领域比作一棵树，那么前端开发则是处于树的尖端，与外界（用户）的距离最近，也最容易受到外界的影响而发生变化。
未来的很长一段时间内，前端领域依然会不断地进行技术更新和知识迭代。为了适应这样频繁的变化，我们需要在不断学习的过程中，编织出自己的知识网络体系，牢牢抓住核心，才能无畏狂风暴雨，站在顶端尽情展示前端技术的魅力，展现个人能力。
希望在未来，我们都可以成为更好的自己，加油！
在正式进入课程之前，我先结合前端面试考察，以关键知识点和问题的方式帮你厘清前端需要掌握的知识体系，这样你在学习的过程中就可以有个完整的知识框架。
这篇课前导读的主要目的在于给你梳理知识体系，所以不会提供面试问题的具体答案和详细内容描述。你可以通过学习后续课时来找出答案，也可以针对提到的知识点和问题去进行深入学习和发散，或者是在留言区进行提问和交流，从而补齐自己缺失的知识和技能。
首先，我们来看前端面试过程中核心基础的知识领域，包括三大块内容：
前端三件套 HTML/CSS/JavaScript；
与 JavaScript 运行环境相关的浏览器和 Node.js；
前端开发通用领域、网络、安全、算法和计算机通用知识。
下面，我们就开始逐一梳理核心知识点吧！
HTML 与 CSS
对于 HTML，面试官很多时候会考察 DOM 元素相关的问题，包括 DOM 操作、事件冒泡/委托、虚拟 DOM 设计等内容。
因此，关于 HTML 的内容更多是结合浏览器机制一起考察。
其中，DOM 操作与性能问题、事件委托以及浏览器中对<script>和<style>标签的处理过程，我将在01讲中进行讲解，其中也会稍微提到虚拟 DOM 的内容。但对于虚拟 DOM 设计存在的问题和各个框架是怎样进行优化的，我将在“17 | Angular/React/Vue 三大前端框架的设计特色”中介绍。
接下来是 CSS，对于 CSS 的熟练程度会因人而异，面试官在面试 1~3 年经验的前端岗位候选人时会更多倾向于考察对页面布局原理的掌握，包括盒子模型、文档流、浮动布局等，以及常见页面布局的技巧，包括传统布局、Flex 布局和 Grid 布局。
同时，页面布局涉及浏览器的渲染过程，因此同样需要注意一些性能问题。
有些时候，面试官也会通过让候选人编码实现某些样式/元素的方式，来考察对 CSS 的掌握程度，其中页面布局（居中、对齐等）便是比较常见的考察点。
对于页面布局原理和常见页面布局的技巧，我将在 02 课时中介绍，而关于浏览器的布局过程则会在 08 课时中结合浏览器结构和运行机制一起介绍。
从上述的面试点可以看出，HTML 与 CSS 的知识基本上围绕着设计原理和运行机制来考察，而对于具体的使用方式都很少会问到。所以 HTML/CSS 的核心知识点不算多，我们课程中前面两讲基本上都有大致概括。
JavaScript
关于 HTML 和 CSS 的知识，并不是所有团队都会使用到。比如有些公司区分了重构岗位和前端岗位，其中重构岗位则专门负责页面样式的开发和调整，而前端岗位则主要负责逻辑实现。但前端开发不管去到哪，JavaScript 永远都是开发工作中的核心。
对于 JavaScript，面试官常常会考察 JavaScript 语言的设计（如原型继承、单线程），以及 JavaScript 的运行过程（比如作用域和闭包、执行上下文与this、Event Loop 等）。这些内容主要是为了考察候选人对JavaScript 语言本身特点的理解，通常来说可能会包括这些内容。
关于 JavaScript 语言的设计及其运行过程，我将在课程的第 3 ~ 5 讲中分别进行介绍，你也可以从中思考出这些题目的答案。
除此之外，很多时候面试官会以写代码的形式来对 JavaScript 中一些知识点进行考察，例如：
手写代码实现
call/apply/bind。JavaScript 中
0.1+0.2为什么等于0.30000000000000004，如何通过代码解决这个问题？
除此之外，现在越来越多的团队也会使用 ES6/ES7 相关的语法，常见的包括箭头函数、Promise/async/await、class等。ES6/ES7 基本上都是语法糖，最终在浏览器中运行的很多时候都是最终编译为 ES5 的代码，因此面试官也常常会考察这些语法糖设计的原因，以及具体的实现，包括：
手写代码实现
Promise；为什么要使用
async、await；怎样让 ES6/ES7 代码可以跑在各个浏览器中（考察 Babel 与 polyfill）；
介绍下
Set和Map数据结构；Javascript 是怎么实现
let和const作用域的。
编码过程的思考很重要，这也是为什么大多团队都会设置笔试题环节的原因。再者，对于开发来说，最终工作内容大部分依赖代码实现，因此编码风格、编码思路都会被列为考察点之一。
我们知道，现在的 JavaScript 基本都会运行在 JavaScript 引擎中，大多数时候都在两个环境下运行：浏览器和 Node.js。因此，对于这两个前端开发常常接触到的领域，同样也是面试官比较倾向的考察点。
浏览器相关
浏览器作为直接与用户交互的媒介，也作为前端开发必不可少的开发工具，其中的运行原理基本上都需要掌握。通常来说，面试官会从一个叫“在浏览器地址栏里输入 URL，按下回车键，会发生什么？”中进行考察，首先会经过下面“网络相关”部分提到的 HTTP 请求过程，可能还会涉及以下内容。
关于浏览器的结构和运行机制，我将在 08 课时进行讲解。其中涉及网络请求和 HTTP 相关的部分内容，则会在第 7 ~ 8 讲中介绍，同时我会带你了解浏览器的架构、线程和进程间的协作。在学习完这几讲的内容之后，你也可以整合其中的各个流程，梳理出根据自身理解而调整的最终流程和步骤。
Node.js 相关
Node.js 和浏览器除了全局对象不一致以外，它们的 Event Loop 机制也有所区别。
很多时候，我们会使用 Node.js 去做一些脚本工程或是服务端接入层等工作。由于大部分前端的工作主要围绕网页、小程序、客户端这些内容，需要深度使用 Node.js 的场景较少，因此我们不会这个课程中过多地介绍它，你也可以通过《Node.js 应用开发实战》专栏来进行深入地学习。
网络相关
不管是网页、小程序，还是依赖 JavaScript 移植到客户端进行的原生应用开发（比如 React Native、Weex、Electron 等），我们基本上都离不开与服务端的通信。因此，我们还需要掌握网络相关的专业知识。
很多面试官都喜欢问“一个完整的 HTTP 请求过程”这个问题。通过这样一个问题，面试官可以了解到候选人对网络请求过程到浏览器渲染过程的掌握情况，其中网络相关的知识点会涉及以下知识点。
这些内容我会在“ 06 | 一个网络请求是怎么进行的”中围绕核心内容进行介绍。
其次，网络请求存在各式各样的情况，比如使用缓存、建立 Websocket、短轮询与长轮询、获取用户登录状态等，这些内容都会直接与 HTTP 协议相关。因此，HTTP 协议相关的知识点也经常会被考察到，包括以下知识点。
其中，HTTP 消息体结构属于很基础的内容，我们的课程中并不会大范围介绍，在 07 课时中，主要围绕场景的 HTTP 协议应用场景来让你更好地理解 HTTP 协议相关内容。
除此之外，关于网络请求的性能优化也常常会被关注到。一般来说，网络请求的优化方案可能涉及缓存的使用、减少资源大小（分片、压缩、懒加载、预加载）、减少每个环节的耗时（DNS 查询、使用 CDN）、使用 HTTP/2 等各种应用场景，这些内容我将在第 21 ~ 22 讲中进行介绍。
安全相关
Web 安全是所有系统设计中都会关注的问题，对于前端开发来说，我们也需要时刻考虑是否存在安全风险。一般来说，常见的安全问题包括前端安全和其他 Web 安全。
其中，XSS 和 CSRF 是前端最容易遇到的问题，也是我们在开发过程中都要考虑的风险。我们不仅需要了解它们的攻击手段，更要掌握对其防范方案，这些分别在“ 07 | HTTP 协议和前端开发有什么关系”和“ 10 | 掌握前端框架模板引擎的实现原理”中进行介绍。学习了这些内容以后，或许你也会知道如何使用前端框架可以避免 XSS 漏洞。而当你在学习“ 11 | 为什么说小程序比较特殊”之后，也能明白为什么在小程序中不存在 XSS 和 CSRF 安全风险。
除了与前端密切相关的 XSS 和 CSRF 以外，如果你对其他 Web 安全相关的知识也感兴趣，可以继续学习《Web 安全攻防之道》专栏，或者推荐阅读《白帽子讲 Web 安全》一书。
算法与数据结构
大公司会考察算法基础，很多同学在准备找工作的时候也经常会去 Leetcode 上刷题。对于前端来说，大多数工作中都不会涉及算法相关，但在一些场景下我们可以使用它们设计出更好的数据结构和计算方式。
在面试过程中，容易被面试官考察到的内容包括这些内容。
很多人会觉得，对前端开发来说，算法好像并不那么重要，实际上大多数的日常开发中也用不到。但如果你关注较大型的前端应用领域，你就会发现它们的确会用到一些算法和数据结构。比如 VSCode 中对于文本缓冲区的性能优化过程中，重构了数据结构，其中就有用到红黑树。
合适的数据结构能从根本上大规模提升应用的性能，不管是前端开发也好，还是后台开发、大数据开发等，软件设计很多都是相通的。这部分的内容我们课程中也基本上不会涉及，因此建议你购买《重学数据结构与算法》专栏继续学习，或是去Leetcode平台学习和研究。
计算机通用知识
除了算法和数据结构以外，计算机通用知识同样在前端开发的日常工作中接触不多。这些内容其实是开发必备的基础，不管是打算发展成为大前端也好、全栈开发也好，还是只希望涉及纯前端的开发内容，我们都需要理解和掌握。比如计算机资源和编程与设计模式。
这些内容你可以作为自身前端知识体系的补充进行学习。提醒一下，我们在日常工作中，可以更多地关注其他配合方（客户端、后台等）的实现和能力，除了可以更好地配合和理解他们的工作外，还可以提升自己对编程和语言设计、通用技术方案的理解。
很多时候，前端由于门槛较低，很多的前端开发都不是计算机专业出身。我们对于计算机基础、网络基础、算法和数据结构等内容掌握很少，更多时候是这些知识的缺乏阻碍了我们在程序员这一职业的发展，这也是为什么很多前端开发苦恼自己到达天花板，想着转型全栈或者后台就能走得更远。
总结
今天，我主要结合面试角度，梳理了前端专业领域相关知识，这些知识常见于应届生或者工作年限较短（1 ~ 3 年）的前端开发在面试过程中会被考察到。
其中计算机基础、网络基础、算法和数据结构等内容与前端岗位的关联性并不大，属于通用的开发工程师素养，这些内容在我们课程中会较少体现。除此之外的其他内容，我们会在“专业知识篇：核心基础”中，围绕核心知识点进行详细介绍。
对于已有较多工作经历（3 ~ 5 年）的前端来说，更多时候会被考察到项目经验和解决方案的设计，我会在下一篇文章中进行介绍。
最后，我也帮你整理了本讲内容的知识体系，便于你复习保存。
除了上面提到的这些内容，你觉得前端专业的知识体系还包括哪些？可以在留言区说说你的想法。
上一讲中，我介绍了前端专业知识框架。专业知识作为前端开发的敲门砖，可以帮你快速地解决开发过程中遇到的技术问题。但如果想要独立承担起项目当中的某一块工作内容，还需要掌握前端项目开发过程中遇到的问题及相应的解决方案。所以今天，我将带你厘清项目经验中需要掌握的知识和技能。
如今，前端开发涉及的项目包括：
传统的 Web 开发，包括管理端、H5\小程序、可视化、游戏等；
Node.js 开发，包括服务端接入层、构建工具、云服务等；
终端开发，包括 React Native、Flutter、Electron 等项目。
不管是怎样的项目，开发过程中涉及的系统设计、方案调研、技术选型、性能优化、效能提升这些都是相通的。比如这是怎样的一个项目？它遇到了什么问题、存在着怎样的瓶颈？又需要怎么去解决？这些问题便是我在这个课程中主要进行介绍并希望你掌握的内容。
下面，我们来一起研究项目开发过程中常见的一些问题吧！
前端在面试过程中项目经验相关的知识点，主要包括：
前端常见的框架和工具库；
Node.js 和服务端；
前端性能优化；
前端工程化；
前端监控搭建；
开发效率提升。
前端框架与工具库
首先我们来看看前端框架，不管你开发管理端、PC Web、H5，还是现在比较流行的小程序，总会面临要使用某一个框架来开发。
大多数的框架都有完备的文档和社区资源，怎么使用一些框架和工具在这些文档里都可以找到，但更重要的是你要知道各个框架的区别、掌握框架设计和实现原理，这样便于技术选型和借鉴解决方案。
因此，以下关于前端框架的内容，你需要明白。
以上问题，是我们工作中经常会遇到并需要进行思考的问题，我会在第 10 讲和第 17 讲中深入讲解前端框架解决了什么问题、具体的设计和实现原理、三大框架各自的特色。
你也可以在第 11 讲中学习到小程序的设计初衷、它是如何提升用户体验的。除此之外，第 12 讲中将介绍单页应用是什么、前端路由库是怎样设计的，而在第 18 讲中我还会教你如何设计合适的状态管理方案。
很多时候，我们不能局限于解决问题，更应该去思考问题出现的原因，同时还应该去了解下同类问题的解决方案、业界是否有成熟的方案可做参考、这些方案又是否适用于自己的项目中，等等。因此，我会在第 22 讲中带你学习如何进行技术方案选型与对比。
Node.js 与服务端
上一讲，我也简单介绍过 Node.js 模块和 API 相关，而在使用 Node.js 作为服务端的项目中，面试官更倾向于考察相关的方案选型和设计，比如技术选型和应用场景。
如果要对上述问题归类，这些问题会更偏向后台内容。但我想告诉你的是，前端与后台的区别不仅仅是 Node.js 和 C++/Java/Go 这些语言的区别这么简单。有些时候前端接管一些接入层的工作，可以支援和解决后台开发人力不够的问题，很多时候 Node.js 的确可以给团队带来更多的价值，比如开发效率高、上线速度快等。
但如果你想要成为真正的全栈，不妨从最基础的计算机原理、编译原理、数据库设计等开始学起，而不是仅仅从编写运行在浏览器中的 JavaScript 代码变成了写运行在 Node.js 中的 JavaScript 代码这么简单，因为前端和后台的知识体系完全不一样。比如：
前端对于单线程的 Web、浏览器机制、动态语言的缺陷和优势、HTTP 协议、网络请求等掌握得很熟练，深入发展方向可以包括大型页面的性能优化、页面功能模块的抽象与组织、数据与渲染的拆离、前端工程化的规范化与效率提升等；
后台本身更关注计算机资源、多进程、数据库等，需要熟练掌握多并发、队列、进程通信、事务、数据库索引等。
后续我们的课程主要围绕前端相关的知识和技能进行讲解，因此偏向服务端的这些内容涉及不多。
前端性能优化
为了能让用户获得更好的体验，性能优化永远是开发者们的重点任务，和用户交互最密切的前端性能更是会影响用户去留的因素。
在前端领域，性能问题常常同样表现为空间和时间两种，顾名思义：
空间性能问题可同样理解为内存占用、CPU 占用、本地缓存占用过多带来的问题（如卡顿）；
时间性能问题则意味着用户等待时间过长，包括页面加载、渲染、可交互等耗时。
一般来说，我们通常需要在达到性能瓶颈的时候才会针对性地进行性能优化。因此面试官在考察该部分内容的时候，基本上会从通用的性能优化方案出发，再结合候选人的项目经历来针对性考察。比如前端通用性能优化和具体的性能优化方案。
以上都是从面试角度来介绍的一些知识点，但在实际工作中，通常是以某个项目为出发点，从页面启动、请求资源，到解析数据、渲染页面，分析各个过程中哪些阶段的耗时较大，然后针对性地进行优化。比如：
首屏性能提速，涉及技术方案可能包括按需加载/懒加载/预加载、秒看、SSR 直出、客户端容器化、客户端离线化等；
网络请求优化，涉及技术方案可能包括 CDN 优化、缓存优化、使用 HTTP/2、资源压缩（Gzip）、请求优化（合并请求、域名拆分、减少 DNS 查询时间）等。
很多时候，性能优化也是与项目本身紧紧相关，一般来说可以从缓存、资源优化、渲染优化、内存优化、计算/运行提速等角度来进行，这些内容我将在“21 | 前端性能优化与解决方案”中进行介绍。
除此之外，很多时候我们的项目在迭代过程中，性能也会随着产品需求的增加、代码的不断变更而逐渐下降，因此我们也可以考虑怎样可以自动发现性能问题，我会在“20 | 性能分析如何实现自动化”中带你研究这部分内容。
前端工程化
所谓前端工程化，更多情况下是指使用工具自动化地完成一些以前需要开发手动解决的任务，一般来说涉及各式各样的构建/打包工具、脚手架、CI/CD 和流水线的搭建、代码部署及灰度发布等过程的自动化。
如今前端项目大多数都使用了模块化，而如果想要将多个文件的代码打包成最终可按照预期运行的代码，则需要使用到代码构建工具、脚手架等。这部分内容可能会包括前端模块化、 Webpack 和代码编译和构建。
除了构建工具和脚手架相关，如今自动化、流程化的实践也越来越多，包括持续集成和持续部署以及自动化流程。
一些规模较大的项目，通常由多人合作完成。因此，多人协作之间同样需要进行规范化，以及使用工具保证流程按规范执行，包括代码规范和开发流程。
对于以上内容，我会在第 13 讲中带你了解代码构建过程，以及 Webpack 的设计和运行机制；我会在带你认识多人协作项目问题，学习相关的解决方案；还会在第 24 讲中给你进行介绍前端工程化的实现，以及其带来的好处。
如今前端团队规模在不断扩大，团队协作越来越多，如何提升团队协作的效率也是大多数团队需要面临和解决的问题。因此，工程化和自动化是如今前端的一个趋势，相关基础建设也越来越受到重视，相应的解决方案也愈加成熟。
前端监控相关
当我们的应用已经稳定上线，更多时候我们会关注如何及时发现问题、如何快速定位并解决问题，此时会需要依赖前端监控。
前端监控涉及页面的整体访问情况、页面的性能情况、用户问题反馈、监控和告警能力等，常见考察内容包括数据上报和实时监控。
对于大型项目来说，灰度发布几乎是开发必备，而监控和问题定位也需要各式各样的工具来辅助优化。更多的时候，上报的数据需要落盘到服务端、同时还需要定时甚至实时的数据清洗、计算能力，因此我们设计的灰度监控方案、数据上报和可视化方案，都会与我们团队的整体系统架构有关。这些内容我会在“19 | 搭建完善的前端监控体系能给业务排忧解难”中进行详细的介绍。
开发效率提升
大家都不喜欢低效的加班，效能提升的意识在工作中很重要。但实际我们的工作中会有很多烦琐又重复的工作内容，因此面对这些工作的态度是否积极、是否会思考如何去解决这样的问题等都可以作为面试的加分项。
候选人通常可能被问到的问题包括：
做了很多的管理端/H5，有考虑过怎么提升开发效率吗？
你的项目里，有没有哪些工作是可以用工具完成的？
项目中有进行组件和公共库的封装吗？
如何管理这些公共组件/工具的兼容问题？
日常工作中，如何提升自己的工作效率？
很多时候我们会抱怨，自己的工作过于枯燥和简单。但这些简单又重复的工作同样可以当成问题去解决，同时我们也可以多去思考这些问题为什么会出现，是否可以有更好的解决方法去从源头上杜绝。只有这样，我们才可以解放自己，提升工作效率，从而可以花更多的时间关注自己感兴趣的内容。
小结
到此，我帮你梳理了前端岗位的专业知识和项目经验体系。之所以从面试的角度来介绍这些内容，是因为面试过程中考察的点通常便是实际工作中会遇到的问题。这样不仅可以让你有方向地进行知识储备，还能结合自身的实际情况自查、反思可完善的地方。
下一讲，我们就正式进入前端核心基础模块，开始前端进阶体系之旅！在后续的学习过程中，希望你不要只关注于解决眼前的问题，更要思考问题为什么会产生，更希望你能搭建自身的知识体系，建立起自己的技术壁垒。
你觉得前端体系里还有哪些知识？可以在留言区说下你的想法。
彩蛋——前端项目经验体系内容，我帮你整理如下。
