nodejs笔记1：浏览器基础
1、浏览器工作原理
浏览器的组成
- 人机交互部分(UI）
- 网络请求部分(Socket)
当打开一个网址的时候浏览器需要向服务器发起一个请求，然后把服务器响应的数据展示出来。所以浏览器一定具有发起网络请求的功能，同时也具有一个接收服务器返回数据的功能。一定具有这两个功能，这个就是网络请求部分——Socket
- JavaScript引擎部分（解析执行JavaScript）
- 渲染引擎部分（渲染HTML、CSS等).
渲染网页，浏览器渲染html、css。html、css是由浏览器渲染引擎来执行的。渲染引擎就是来渲染html和css，即释执行css和HTML
- 数据存储部分(cookie、HTML5中的本地存储LocalStorage、SessionStorage)
主流渲染引擎（了解）
渲染引擎又叫排版引擎或浏览器内核。
主流的渲染引擎:
- Chrome浏览器：Blink引擎（WebKit的一个分支）。
- Safari浏览器：MebKit引擎，windows版本2008年3月18日推出正式版，但苹果已于2012年7月25日停止开发windows版的Safani。=>最新版的苹果Safari浏览器是没有Windows版
- FireFox浏览器：Gecko引擎。
- Opera浏览器：Blink引擎(早期版使用Presto引擎）。
- Internet Explorer浏览器：Trident引擎。
- Microsoft Edge浏览器：EdgeHTML引擎（Trident的一个分支)。
双核浏览器就意味着它有两个不同的渲染引擎内核，为什么要有两个不同的渲染引擎内核呢？
所以如果360浏览器假如它有两个内核，一个是IE内核，另一个是别的内核比如火狐内核、Chrome内核，当你要登录一些企业内网，必须要使用IE的时候，就把这个360浏览器切换成IE的内核，这个时候就可以使用一些企业的内网系统（部分内网仅支持IE）。
如果要访问外网时，再把它切换成Chrome的内核，相对来说浏览器速度会快一些，这就是所谓的双核浏览器。双核浏览器内核指的就是浏览器的渲染引擎或者排版引擎，就是浏览器执行HTML、CSS。
工作原理
-
解析HTML构建Dom树(Document Object Model，文档对象模型)，DOM是W3C组织推荐的处理可扩展置标语言的标准编程接口。 -
构建渲染树，渲染树并不等同于Dom树，因为像’head’标签或’display: none'这样的元素就没有必要放到渲染树中了，但是它们在Dom树中。 - 对渲染树进行
布局，定位坐标和大小、确定是否换行、确定position、overflow、z-index等等，这个过程叫"layout”或"reflow"。
4.绘制渲染树，调用操作系统底层API进行绘图操作。
展示渲染过程的方法
浏览器访问网站过程
- 在浏览器地址栏中输入网址
-
浏览器通过用户在地址栏中输入的URL构建HTTP请求报文。GET , HTTP/1.1
image.png
-
浏览器发起DNS解析请求，将域名转换为IP地址
image.png
- 浏览器将请求报文发送给服务器。
- 服务器接收请求报文，并解析。
-
服务器处理用户请求，并将处理结果封装成HTTP响应报文。
image.png
- 服务器将HTTP响应报文发送给浏览器。
- 浏览器接收服务器响应的HTTP报文，并解析。
- 浏览器解析HTML页面并展示，在解析HTML页面时遇到新的资源需要再次发起请求。
- 最终浏览器展示出了页面。
请求报文：
第一部分是请求行，包括请求方法、请求路径以及请求的http协议；
第二部分叫做请求报文头；注意空行；
最后部分是请求报文体。
响应报文：
第一部分是响应行，包括服务器请求的http协议以及服务器返还的http状态码；
第二部分是http响应报文头；注意空行；
最后部分是响应报文体。
2、web开发本质
(1)请求，客户端发起请求。
(2)处理，服务器处理请求。
(3)响应，服务器将处理结果发送给客户端
要做什么事都不是自己做，都交给服务器来做，Web要做就是向服务器发起不同的请求，服务器就知道要做不同的处理，处理完毕以后把结果再反馈回来。
客户端处理响应
服务器响应完毕后，客户端继续处理，其中：
- 浏览器:解析服务器返回的数据。
- ios、 Android客户端：解析服务器返回的数据，并且通过ios或Android的UI技术实现界面的展示功能
C/S & B/S
开发软件的两种的架构：
- C/S(Client/Server):客户端服务器
- B/S( Browser/Server ):浏览器服务器
同一套系统，既有BS架构模式，也有CS架构模式，基于用户需求。
- BS的好处是部署、维护方便，缺点是用户体验稍差。
- CS的好处是用户体验好，和服务器连接稳定，缺点是需要为客户独立开发终端，升级也得连客户端一起升级，部署工作量大。
