一个页面从输入url到页面加载完成究竟经历了些什么
本人经参考谢希仁著《计算机网络(第 5版)》、《HTTP权威指南》和网络上关于浏览器渲染原理的介绍,结合自己理解,整理出以下结论,如有不正确或者不完善之处欢迎指正:
当用户在浏览器的地址栏输入要找的页面的url后,如输入http://www.tsinghua.edu.cn/chn/yxsz/index.html,具体发生了以下步骤:
1、浏览器向DNS服务器请求解析www.tsinghua.edu.cn的IP地址;
具体来说:
浏览器调用解析程序,并成为DNS服务器的一个客户,把待解析域名放在DNS请求报文中,以UDP用户数据报方式发给本地域名服务器,(使用UDP是为了减少开销)。本地域名服务器在查找域名后,把对应的IP地址放在响应报文中返回。如果本地域名服务器无法查找到对应域名,那么该域名服务器就成为DNS中的另一个客户,并向其他域名服务器发出查询请求。这种过程直到找到能够回答该请求的域名服务器为止。
2、DNS解析出清华大学服务器对应的IP地址为166.111.4.100并将查询结果告诉浏览器;
3、浏览器采用三次握手与服务器建立TCP连接(在服务器端IP地址是166.111.4.100,端口是80);
4、浏览器发出HTTP请求报文;
5、服务器发送HTTP响应报文;
无论请求报文和响应报文都分为三部分:起始行、头部、主体部分。请求报文的起始行说明了要做些什么,响应报文的起始行则说明发生了什么。首部字段向请求或者响应报文中添加一些附加信息,他们是一些名/值对的列表。主体部分可选,它是HTTP真正要传输的内容。
服务器在响应报文的主体部分携带了HTML代码,用于浏览器进行页面渲染。
6、释放TCP连接;
7、浏览器依据服务器传来的响应报文(主体部分)数据从上到下解析HTML代码,在<head>部分获取到CSS,然后后开始渲染页面;
如果link标签引入的外部样式表放在<body>底部,由于从上到下解析,一开始不会显示元素样式,直到解析到link部分的CSS才会重新渲染页面;
如果网速较慢,html代码加载完成后而css还没加载完的话,这会导致页面没有样式而难以阅读,所以不推荐这种方式。
8、当浏览器在HTML代码中发现对一些资源的引用时(如<img>标签引用了一张图片),浏览器向服务器发出异步请求获取这些资源。此时浏览器不会等到资源下载完,而是继续渲染后面的代码;
9、服务器返回浏览器需要的资源,浏览器回过头来重新渲染该部分代码;
10、当浏览器发现包含JavaScript代码的<script>标签时,立即执行它;如果JavaScript脚本命令改变前面的布局或者样式,浏览器不得不重新渲染这部分代码;
11、</html>页面渲染完毕。
一个页面从输入url到页面加载完成究竟经历了些什么的更多相关文章
- 一个页面从输入url到页面加载显示完成,中间都经历了什么
第一种解释: 一般会经历以下几个过程: 1.首先,在浏览器地址栏中输入url 2.浏览器先查看浏览器缓存-系统缓存-路由器缓存,如果缓存中有,会直接在屏幕中显示页面内容.若没有,则跳到第三步操作. 3 ...
- 一个页面从输入URL到页面加载完成发生了...待细化
一个页面从输入URL到页面加载完成发生了... 1.查找浏览器缓存 2.寻址:DNS解析 查找该域名对应的IP地址, 如果需要重定向(301),则再次发起请求 3. 进行HTTP协议会话 4.客户端发 ...
- 一个页面从输入URL到页面加载显示完成,这个过程都发生了什么?
对于网址栏的URL不同的操作方式有不同的加载资源.获取数据的方式,下面的详细过程针对"在地址栏输入URL,按enter(回车)键加载资源"此种操作方式做解析,其它的方式的过程大同小 ...
- 一个页面从输入URL到页面加载显示完成的详细过程
下面以访问baidu页面来做一个过程分析 输入 URL:http://www.baidu.com DNS 域名解析 计算机无法识别域名,计算机与计算机之间要想进行通信,必须通过ip地址用来定位该计算机 ...
- 一个页面从输入URL 到页面加载显示完成的过程中都发生了什么
前端面试/笔试必考问题,越详细越好 先简单得讲: 浏览器根据请求的URL交给DNS域名解析,找到真实IP,向服务器发起请求: 服务器交给后台处理完成后返回数据,浏览器接收文件(HTML.JS.CSS. ...
- 8.一个页面从输入 URL 到页面加载显示完成,这个过程中都发生了什么?
注:这题胜在区分度高,知识点覆盖广,再不懂的人,也能答出几句, 而高手可以根据自己擅长的领域自由发挥,从URL规范.HTTP协议.DNS.CDN.数据库查询. 到浏览器流式解析.CSS规则构建.lay ...
- 一个页面从输入URL 到页面加载显示完成,这个过程中都发生了什么?
1.当发送一个URL请求时,浏览器会开启一个线程来处理这个请求,同时在远程DNS服务器上启动一个DNS查询,解析获取网址的IP地址:2.浏览器与远程Web服务器通过TCP三次握手协商来建立一个TCP/ ...
- 一个网页从输入URL到页面加载完成的过程中都发生了什么事情?
这是一个前端的经典面试题,很多大公司面试时都会被问及,涉及的面也是非常多. 一般会经历以下几个过程: 1.首先,在浏览器地址栏中输入url 2.浏览器先查看浏览器缓存-系统缓存-路由器缓存,如果缓存中 ...
- 一个页面从输入 URL 到页面加载显示完成,这个过程中都发生了什么?
分为4个步骤: 1) 当发送一个 URL 请求时,不管这个 URL 是 Web 页面的 URL 还是 Web 页面上每个资源的 URL,浏览器都会开启一个线程来处理这个请求,同时在远程 DNS 服务 ...
随机推荐
- ASP.NET Core中的Controller
ASP.NET CORE出现之前我们实现的Controller,MVC都继承自Controller基类,WebApi的话继承自ApiController.现在ASP.NET CORE把MVC跟WebA ...
- 安卓动画(Animation使用)
安卓的Animation视图动画的使用非常简单,并且对象适用于一般控件. 具体使用步骤如下. Button/TextView/EditText/ImageView/Bitmap ..... obj ...
- ThinkPHP3.2.3发送微信模板消息
一.开通模板消息功能 所有服务号都可以在功能->添加功能插件处看到申请模板消息功能的入口,但只有认证后的服务号才可以申请模板消息的使用权限并获得该权限:需要选择公众账号服务所处的2个行业,每月可 ...
- Linux C++ 网络编程学习系列(7)——mbedtls编译使用
mbedtls编译使用 环境: Ubuntu18.04 编译器:gcc或clang 编译选项: 静态编译使用 1. mbedtls源码 下载地址: https://github.com/ARMmbed ...
- git如何清除远程 __pycahce__ 文件
第一步,清除已经存在的缓存文件 >> git rm -r -f --cached */__pycache__ rm 'common/__pycache__/__init__.cpython ...
- ES5和ES6基本介绍与面向对象的基本思想
ES6和ES5基本介绍 let const 关键词定义变量 let 定义变量 特点: let 定义的变量,不会进行预解析 let 定义的变量,与 forEach() 中的变量类似 每次执行都会 ...
- SQL Server 2005 sa登录失败。已成功与服务器建立连接 但是在登录过程中发生错误。 provider 共享内存提供程序 error 0 管道的另一端上无任何进程。
SQL Server 2005 Express版 用户 'sa' 登录失败.该用户与可信 SQL Server 连接无关联.提示错误:已成功与服务器建立连接 但是在登录过程中发生错误. provide ...
- Python-元组tuple、列表list、字典dict
1.元组tuple(1)元组是有序列表,有不可见的下标,下标从0开始(2)元组的数据是相对固定的,数据不能增删改,他的一个重要用途是保存固定的.安全要求高的数据(3)元组用小括号()括起来,空元组定义 ...
- 带你五分钟了解python的函数式编程与闭包
前言 文的文字及图片来源于网络,仅供学习.交流使用,不具有任何商业用途,版权归原作者所有,如有问题请及时联系我们以作处理. 作者:梁唐 PS:如有需要Python学习资料的小伙伴可以加点击下方链接自行 ...
- 爬取腾讯网的热点新闻文章 并进行词频统计(Python爬虫+词频统计)
前言 文的文字及图片来源于网络,仅供学习.交流使用,不具有任何商业用途,版权归原作者所有,如有问题请及时联系我们以作处理. 作者:一棵程序树 PS:如有需要Python学习资料的小伙伴可以加点击下方链 ...