最近看了几个微前端框架的源码（single-spa、qiankun、micro-app），感觉收获良多。所以打算造一个迷你版的轮子，来加深自己对所学知识的了解。
then 方法返回一个新的 promise 实例，为了在 promise 状态发生变化时（resolve / reject 被调用时）再执行 then 里的函数，我们使用一个 callbacks 数组先把传给then的函数暂存起来，等状态改变时再调用。
浏览器（多进程）包含了「Browser进程」（浏览器的主进程）、「第三方插件进程」和「GPU进程」（浏览器渲染进程），其中「GPU进程」（多线程）和Web前端密切相关，包含以下线程：
这次的百度面试挺紧张的，在写算法题的时候脑子都有点空白，还是按照脑海中那点残存的算法技巧才写出来，不至于太尴尬，以及第一次面试百度这种级别的公司，难免出现了一些平常不至于出现的问题或没注意的缺点，在这里分享给大家。
详细资料可以参考： 《前端安全系列之二：如何防止 CSRF 攻击？》 《[ HTTP 趣谈] origin, referer 和 host 区别》
不以解决实际业务痛点的更新都是耍流氓，下面我们来列举一下Vue3之前我们或许会面临的问题
金九银十，又是一波跑路。趁着有空把前端基础和面试相关的知识点都系统的学习一遍，参考一些权威的书籍和优秀的文章，最后加上自己的一些理解，总结出来这篇文章。适合复习和准备面试的同学，其中的知识点包括：
基本上每个项目都需要用到模态框组件，由于在最近的项目中，alert组件和confirm是两套完全不一样的设计，所以我将他们分成了两个组件，本文主要讨论的是confirm组件的实现。 组件结构 <tem
有五种，分别是 State、 Getter、Mutation 、Action、 Module
我们写的代码都是为了一定的需求服务的，但是这些需求并不是一成不变的，当需求变更了，如果我们代码的扩展性很好，我们可能只需要简单的添加或者删除模块就行了，如果扩展性不好，可能所有代码都需要重写，那就是一场灾难了，所以提高代码的扩展性是势在必行的。怎样才算有好的扩展性呢？好的扩展性应该具备以下特征:
Vue在挂载实例前，有相当多的工作是进行模板的编译，将template模板进行编译，解析成AST树，再转换成render函数，而有了render函数后才会进入实例挂载过程。对于事件而言，我们经常使用v-on或者@在模板上绑定事件。因此对事件的第一步处理，就是在编译阶段对事件指令做收集处理。
Observer : 它的作用是给对象的属性添加 getter 和 setter，用于依赖收集和派发更新
记录pinia核心源码阅读笔记，这里跳过hmr(热更新), mapHelpers(class 工具)等工具源码。 剔除的部分vue2.0兼容代码。 当前pinia版本2.0.13
defer 是“渲染完再执行”，async 是“下载完就执行”，defer 如果有多个脚本，会按照在页面中出现的顺序加载，多个async 脚本不能保证加载顺序
异步更新是 Vue 核心实现之一，在整体流程中充当着 watcher 更新的调度者这一角色。大部分 watcher 更新都会经过它的处理，在适当时机让更新有序的执行。而 nextTick 作为异步更新的核心，也是需要学习的重点。
nextTick Vue中的 nextTick涉及到Vue中DOM的异步更新，感觉很有意思，特意了解了一下。其中关于 nextTick的源码涉及到不少知识， nextTick 是 Vue 的一个核心实现，在介绍 Vue 的 nextTick 之前，为了方便大家理解，我先简单介绍一下 JS 的运行机制。
https://juejin.im/post/6862661545592111111
在执行 initGlobalAPI(Vue) 初始化 Vue 全局 API 中，这么定义 Vue.nextTick。
vue-loader会调用@vue/compiler-sfc模块解析SFC源码为一个描述符（Descriptor），然后为每个语言块生成import代码，返回的代码类似下面
指由服务侧完成页面的 HTML 结构拼接的页面处理技术，发送到浏览器，然后为其绑定状态与事件，成为完全可交互页面的过程
很多网站的资源后面都加了版本号，这样做的目的是：每次升级了 JS 或 CSS 文件后，为了防止浏览器进行缓存，强制改变版本号，客户端浏览器就会重新下载新的 JS 或 CSS 文件 ，以保证用户能够及时获得网站的最新更新。
来源：https://juejin.im/post/5d759f706fb9a06afa32adec
Vue.js 是一个渐进式 MVVM 框架，目前被广泛使用，也成为目前前端技术中颇具代表性的一个框架。
SSR(Server-Side Rendering)，在SPA(Single-Page Application)出现之前，网页就是在服务端渲染的。服务器接收到客户端请求后，将数据和模板拼接成完整的页面响应到客户端，客户端将响应结果渲染出来。如果用户需要浏览新的页面，则需要重复这个过程。随着Angular、React和Vue的兴起，SPA开始流行，单页面应用可以在不重载整个页面的情况下，通过ajax和服务器进行交互，高效更新部分页面，这无疑带来了良好的用户体验。然而，对于需要SEO、追求首屏速度的页面，使用SPA是糟糕的。如果我们想使用Vue，又需要考虑到SEO、首屏渲染速度，那该怎么办？好在Vue是支持服务端渲染的，接下来我们主要说的是Vue的服务端渲染。
简单实现一个Vue首屏性能优化组件，现代化浏览器提供了很多新接口，在不考虑IE兼容性的情况下，这些接口可以很大程度上减少编写代码的工作量以及做一些性能优化方面的事情，当然为了考虑IE我们也可以在封装组件的时候为其兜底，本文的首屏性能优化组件主要是使用IntersectionObserver以及requestIdleCallback两个接口。
前言 以前我看到面试贴就直接刷掉的，从不会多看一眼，直到去年 9 月份我开始准备面试时，才发现很多面试经验贴特别有用，看这些帖子（我不敢称之为文章，怕被杠）的过程中对我的复习思维形成影响很大，所以我现在把之前自己好好整理的面试计划分享出来，希望能帮到接下来要找工作的朋友，不喜勿喷哈～
https://juejin.im/post/5d759f706fb9a06afa32adec
现在百度，阿里，腾讯，字节跳动等大厂的面试真题、面经随处可见。甚至还有多家教育机构专门针对这一部分设计了课程，但是中小厂的面经倒是很稀缺。
“ 关注 前端开发社区 ，回复"1"即可加入 前端技术交流群，回复 "2"即可免费领取 500G前端干货！
Vue不是框架（前端框架往往需要解决路由、试图管理、数据持久化等流程），Vue只关注视图层。
发布-订阅模式其实是一种对象间一对多的依赖关系，当一个对象的状态发送改变时，所有依赖于它的对象都将得到状态改变的通知。
主线程的执行过程就是一个tick，而所有的异步结果都是通过 "任务队列" 来调度。消息队列中存放的是一个个 macro task 结束后，都要清空 所有的 micro task。
该方法的参数是 Promise 实例数组, 然后其 then 注册的回调方法是数组中的某一个 Promise 的状态变为 fulfilled 的时候就执行. 因为 Promise 的状态只能改变一次, 那么我们只需要把 Promise.race 中产生的 Promise 对象的 resolve 方法, 注入到数组中的每一个 Promise 实例中的回调函数中即可.
XSS 攻击指的是跨站脚本攻击，是一种代码注入攻击。攻击者通过在网站注入恶意脚本，使之在用户的浏览器上运行，从而盗取用户的信息如 cookie 等。
nextTick 是 vue中重要的性能优化方式，解析实现原理可以有助于我们更好的理解框架。
当时的我年轻气盛，在简历上放了自己的博客地址，而面试官应该是翻了我的博客，好几道面试题都是围绕着我的博文来提问
故事第 1 集：CSS预处理器，你还是只会嵌套么 ？[2] 故事第 2 集：【自适应】px 转 rem，你还在手算么？[3]
如果直接渲染1W行列表，不出意外你的页面就要卡了，比较常见的优化方案就是虚拟滚动，就是只渲染你能看到的视窗中的几十行，然后通过监听滚动来更新这几十个dom
媒体查询由⼀个可选的媒体类型和零个或多个使⽤媒体功能的限制了样式表范围的表达式组成，例如宽度、⾼度和颜⾊。媒体查询，添加⾃CSS3，允许内容的呈现针对⼀个特定范围的输出设备⽽进⾏裁剪，⽽不必改变内容本身，适合web⽹⻚应对不同型号的设备⽽做出对应的响应适配。
搜索查询是使用 key:value 模式构建的，最后是可选的原始搜索。每个 key:value 都是一个 token，可选的原始搜索本身就是一个 token。key:value 对 tokens 被视为 issue 或 event 属性。可选的原始搜索被视为单个 token 并搜索事件标题/消息(title/message)。
（3）让函数的 this 指向这个对象，执行构造函数的代码（为这个新对象添加属性）
详细资料可以参考： 《JavaScript 有几种类型的值？》 《JavaScript 有几种类型的值？能否画一下它们的内存图；》
vue-routervue-router是vuex.js官方的路由管理器，它和vue.js的核心深度集成，让构建但页面应用变得易如反掌<router-link> 组件支持用户在具有路由功能的应用中 (点击) 导航。 通过 to 属性指定目标地址<router-view> 组件是一个 functional 组件，渲染路径匹配到的视图组件。<keep-alive> 组件是一个用来缓存组件router.beforeEachrouter.afterEachto: Route: 即将要进入的目标 路由对象from:
那也就是说null的类型标签也是000，和Object的类型标签一样，所以会被判定为Object。
$nextTick：根据官方文档的解释，它可以在 DOM 更新完毕之后执行一个回调函数，并返回一个 Promise（如果支持的话）
如果是 HTTP 1.0 版本协议，一般情况下，不支持长连接，因此在每次请求发送完毕之后，TCP 连接即会断开，因此一个 TCP 发送一个 HTTP 请求，但是有一种情况可以将一条 TCP 连接保持在活跃状态，那就是通过 Connection 和 Keep-Alive 首部，在请求头带上 Connection: Keep-Alive，并且可以通过 Keep-Alive 通用首部中指定的，用逗号分隔的选项调节 keep-alive 的行为，如果客户端和服务端都支持，那么其实也可以发送多条，不过此方式也有限制，可以关注《HTTP 权威指南》4.5.5 节对于 Keep-Alive 连接的限制和规则。
领取专属 10元无门槛券
手把手带您无忧上云
云服务器
ICP备案
对象存储
腾讯会议
实时音视频
