从输入URL到浏览器显示页面发生了什么?
不同浏览器的工作方式不完全一样,大体上,浏览器的核心是浏览器引擎,目前市场占有率最高的几种浏览器几乎都使用了不同的浏览器引擎:IE使用的是Trident、Firefox使用的是Gecko、Safari和Chrome使用的是Webkit。不同的浏览器引擎对W3C的规范支持不尽相同。下面讲诉浏览器从输入URL地址开始到页面完全可用的大致过程。
1.连接到URL所在服务器
用户在地址栏中输入一个URL,并单击GO按钮要求浏览器打开该URL后,浏览器做的第一件事情是寻找该URL所在服务器,通过向DNS服务器查询,浏览器可以获得该URL所在网站的IP地址。然后,浏览器向该地址发起连接请求,建立到服务器的连接。
2.获取页面对应的HTML文档
当连接建立后,浏览器向服务器发送HTTP请求,请求URL对应的HTML文档。不管请求的URL是一个静态的HTML文件,还是一个动态脚本(ASPX、PHP或JSP),服务器返回给浏览器的一定是HTML文档。该HTML文档就是浏览器需要呈现的页面
3.解析文档并获取所需要的资源
浏览器在获取HTML文档后会对文档进行解析,目的是知道该页面需要哪些资源以及生成DOM树。生成DOM树的工作与下载页面上需要的其它资源同时进行。大致来说,浏览器会逐行分析HTML文档,一旦发现一个标签,就会根据标签的要求分配对指定资源的下载。当DOM树生成后,DOMContentLoaded事件被触发。
首先,理论上浏览器并行下载页面需要的所有资源会带来最好的性能体验,但由于服务器要保证对尽可能多的用户的支持,因此HTTP/1.1规定了每个客户端只能与每个服务器建立2个连接。
其次,并非所有的元件都可以被并行下载。一般情况下,页面中包含两类需要被执行的JavaScript脚本,一类是直接用<script>标签标识的内嵌的JS语句;另一类则是引用外部的JS文件
4.页面上的JS文件与CSS文件
5.Onload事件
当HTML文档解析完成,生成了DOM树,所有页面需要的资源文件都已经成功下载和执行后,浏览器会发出Onload事件并回调HTML文档中的onload函数。
(转载地址:https://www.cnblogs.com/jasonteststudy/p/4001630.html)
更加详细内容:
深入浅出经典面试题:从浏览器中输入URL到页面加载发生了什么
https://www.cnblogs.com/confach/p/10050013.html
参考阅读:
https://blog.csdn.net/jeffleo/article/details/77151646
一个 TCP 连接上面能发多少个 HTTP 请求