Browser

重绘与回流 重绘与回流是浏览器渲染的时候进行的操作，当页面内容发生改变的时候，就会触发重绘或者回流 重绘 当渲染树中的一些元素需要更新属性，而这些属性只是影响元素的外观，风格，而不会影响布局的，比如background-color，则就叫称为重绘Repaint，重绘不一定触发回流。 回流 当渲染树中

浏览器事件 常用浏览器事件与DOM事件，包括鼠标事件、键盘事件、框架/对象事件、表单事件、剪贴板事件、打印事件、拖动事件、多媒体事件、动画事件、过渡事件。 浏览器事件 加载相关 onbeforeunload: 该事件在即将离开页面（刷新或关闭）时触发。 onload: 文档加载完成后触发。 onun

浏览器窗口间通信 浏览器多个标签页窗口间通信，主要是指的同源的多个页面间的通信，主要方法有本地存储通信、 通信、 通信。 本地存储通信 通过浏览器对于同源页面本地存储是共享的策略实现通信，主要可以使用 、`cookie indexDB sessionStroage MDN window.open s

浏览器页面呈现过程 从输入链接到浏览器呈现页面的过程中，浏览器所经历的过程。 DNS解析 首先浏览器将输入的链接进行DNS解析，也就是将域名转换为IP地址的过程，得到了服务器具体的IP地址，才可以进行TCP链接以及数据的传输。 具体DNS解析的过程，浏览器首先检查自身的DNS缓存是否对于此域名有IP

浏览器本地存储方案 浏览器本地存储方案可以分为三个方面，分别为Cookie、Web Storage、IndexedDB。 Cookie 由于HTTP协议是无状态的，一旦数据交换完毕，此次链接就会关闭，再次交换数据就需要重新连接，意味着服务器无法从链接上跟踪会话。假如A与B同时购买了一件商品，不进行会

浏览器渲染与内核 浏览器内核可以分成两部分：渲染引擎与JS引擎。最开始渲染引擎与JS引擎并没有明确的区分，但随着JS引擎越来越独立，内核就越来越倾向于只指渲染引擎。 渲染过程 不同浏览器内核的渲染方式不同，但整体流程基本一致： 自上而下，首先解析HTML标签，生成DOM Tree。 在解析到<

HTTP协议概述 HTTP超文本传输协议，基于TCP/IP通信协议传输数据。 特点 HTTP是无连接的：无连接的含义是限制每次连接只处理一个请求。服务器处理完客户的请求，并收到客户的应答后，即断开连接，采用这种方式可以节省传输时间。 HTTP是媒体独立的：只要客户端和服务器知道如何处理的数据内容，任

HTTPS加密传输过程 HTTPS全称Hyper Text Transfer Protocol over SecureSocket Layer，是以安全为目标的HTTP通道，在HTTP的基础上通过传输加密和身份认证保证了传输过程的安全性。HTTPS在HTTP的基础下加入SSL层，HTTPS的安全基础

HTTP协议发展历程 超文本传输协议是一个用于传输超文本文档的应用层协议，它是为 浏览器与 服务器之间的通信而设计的， 协议到目前为止全部的版本可以分为 、`HTTP 1.0 HTTP 1.1 HTTP 2.0 HTTP 3.0 HTTP 1.1 HTTP 2.0 HTTP 3.0`版本。 HTTP

Window对象 window作为全局变量，代表了脚本正在运行的窗口，将属性与方法暴露给JavaScript。 Window对象属性 closed: 表示所引用的窗口是否关闭。 console: 提供了向浏览器控制台输出日志信息的方法。 crypto: 此对象允许网页访问某些加密相关服务。 cust

Location对象 Location对象表示其链接到的对象的位置URL，所做的修改反映在与之相关的对象上。Document和Window对象都有这样一个链接到Location，分别通过document.location和window.location访问。 属性 location.href: 包含

Node对象 Node是一个接口，各种类型的DOM API对象会从这个接口继承，其允许我们使用相似的方式对待这些不同类型的对象。 属性 Node.prototype.baseURI: 只读，返回一个表示base URL的DOMString，不同语言中的base URL的概念都不一样，在HTML中ba

Navigator对象 Navigator对象表示用户代理的状态和标识，其允许脚本查询它和注册自己进行一些活动，可以使用只读的window.navigator属性取得实例化的navigator对象的引用。 属性 navigator.connection: 只读，提供一个Network Informa

Element对象 Element是一个通用性非常强的基类，所有Document对象下的对象都继承自它，这个对象描述了所有相同种类的元素所普遍具有的方法和属性，一些接口继承自Element并且增加了一些额外功能的接口描述了具体的行为，例如HTMLElement接口是所有HTML元素的基本接口，而SV

IntersectionObserver对象 IntersectionObserver对象，从属于Intersection Observer API，提供了一种异步观察目标元素与其祖先元素或顶级文档视窗viewport交叉状态的方法，祖先元素与视窗viewport被称为根root，也就是说Inter

Event对象 Event对象表示在DOM中出现的事件，在DOM中有许多不同类型的事件，其主要使用基于Event对象作为主接口的二次接口，Event对象本身包含适用于所有事件的属性和方法。 描述 事件有很多类型，一些事件是由用户触发的，例如鼠标或键盘事件，而其他事件常由API生成，例如指示动画已经完

Object对象 Object对象是JavaScript中两个顶层对象之一，提供方法供直接调用以及原型链继承调用。 Object.assign Object.assign()方法用于将所有可枚举属性的值从一个或多个源对象复制到目标对象。它将返回目标对象，本文认为只有引用类型才有浅拷贝与深拷贝的概念，

HTMLElement对象 任何HTML元素都继承于HTMLElement对象，一些元素直接实现这个接口，而另一些元素通过多层继承来实现它。 属性 从其父元素Element继承属性，并从DocumentAndElementEventHandlers、ElementCSSInlineStyle、Glo

MutationObserver对象 MutationObserver (W3C DOM4)对象提供了监视对DOM树所做更改的能力，其被设计为旧的Mutation Events功能的替代品(该功能是DOM3 Events规范的一部分)。 描述 Mutation Observer用来监视DOM变动，D

History对象 History对象允许操作浏览器的曾经在标签页或者框架里访问的会话历史记录。 属性 history.length: 只读，返回一个整数，该整数表示会话历史中元素的数目，包括当前加载的页，例如在一个新的选项卡加载的一个页面中，这个属性返回1。 history.scrollResto