从输入URL到页面加载完成的过程中都发生了什么事情?(待补充)

来源:互联网 发布:ios11数据用量在哪里 编辑:程序博客网 时间:2024/04/29 16:27
DNS解析,定位Server,检查Default HTTP Port,TCP Three-way  handshakes,HTTP Request,HTML Tokenization and DOM Tree building,CSSOM  building and JavaScript execution,最后是Render Tree building, layouts  calling and style recaluculatinghttp://igoro.com/archive/what-really-happens-when-you-navigate-to-a-url/http://fex.baidu.com/blog/2014/05/what-happen/
  1. 输入地址
  2. 浏览器查找域名的 IP 地址这一步包括 DNS 具体的查找过程,包括:浏览器缓存->系统缓存->路由器缓存...
  3. 浏览器向 web 服务器发送一个 HTTP 请求
  4. 服务器的永久重定向响应(从 http://example.comhttp://www.example.com
  5. 浏览器跟踪重定向地址
  6. 服务器处理请求
  7. 服务器返回一个 HTTP 响应
  8. 浏览器显示 HTML
  9. 浏览器发送请求获取嵌入在 HTML 中的资源(如图片、音频、视频、CSSJS等等)
  10. 浏览器发送异步请求
浏览器渲染过程:解析html构建dom树->构建render树->布局render树->绘制render树。
浏览器解析渲染页面原理画个图解释清晰一点:首先,开源浏览器一般以8k每块下载html页面。然后解析页面生成DOM树,遇到css标签或JS脚本标签就新起线程去下载他们,并继续构建DOM。下载完后解析CSS为CSS规则树,浏览器结合CSS规则树和DOM树生成Render Tree。注意:构建CSS Object Model(CSSOM)会阻塞JavaScript的执行。JavaScript的执行也会阻塞DOM的构建。JavaScript下载后可以通过DOM API修改DOM,通过CSSOM API修改样式作用域Render Tree。每次修改会造成Render Tree的重新布局和重绘。只要修改DOM或修改了元素的形状或大小,就会触发Reflow,单纯修改元素的颜色只需Repaint一下(调用操作系统Native GUI的API绘制)。
注:IP地址与网址的区别:IP地址是每一台电脑唯一的地址,而要访问这台电脑就要输入对方的IP地址,如:192.168.1.1 如这台电脑上面摆放上一个网站,那么,我们就要访问这台电脑的IP地址了..但想一想,世界上有成千台电脑呢?那么我们如何去记得这么多IP地址呢?这个问题就由网址来为你解决了.我们的网址如: http://www.baidu.com 这个网址就绑定了一个对应的IP地址,所以,我们当访问这个网址的时候,实际上就访问了这台电脑的IP地址了.不信?按照我以下介绍给你的操作看看吧。
0 0