网页加载的流程

170 阅读2分钟

网页加载的流程

浏览器是如何加载网页的?

1.当浏览器的地址栏输入网址后敲回车就会请求一次服务器,服务器会返回一个数据包,这个数据包就是要渲染在浏览器页面上显示的网页代码也就是一份html格式的文本文档。

1.1浏览器开始运行解析这份html文本,此时还没有图片和外部引入的js文件,css文件以及字体库资源等需要做网络加载的资源。

1.2解析html文本时遇到img标签的src属性会异步的开始再次发起网络请求服务器,这一次的网络请求和浏览器地址栏输入网址发起的网络请求是相互独立的,彼此之间没有任何关系。这一次发起的网络请求会让服务器的回调函数重新运行,然后服务器返回数据包其中的数据就是图片编码,然后客户端会渲染这张图片。

1.3解析html文本时遇到link标签的href属性会异步的开始再次发起网络请求服务器,服务器返回数据包其中的数据就是CSS编码,然后加载为CSS样式结构体。

1.4解析html文本时遇到一些标签的url属性会异步的开始再次发起网络请求服务器,服务器返回数据包其中的数据就是对应的编码,然后加载。

1.5解析html文本时遇到script的src属性会异步的开始再次发起网络请求服务器,服务器返回数据包其中的数据就是js代码,然后用js引擎去执行js代码。

2.所有资源加载完毕了才会触发window.onload。