一、从URL到页面渲染的整个过程
1)处理用户输入
2)开始导航
3)读取响应
4)查找渲染进程
5)确认导航
6)渲染页面

二、每一步做了哪些事情

1)处理用户的输入

浏览器的UI 线程处理用户的输入,判断是跳转过来的还是用户自己的输入。

判断依据是请求报文中referer这个参数,值是NUll,用户自己手动输入。

2)开始导航

用户敲了回车之后,监听用户行为的UI线程告诉network线程去获取网页;同时自己进入loading状态。

network线程如何获取网页资源的呢?

2.1)dns域名解析

2.1.1)什么是dns域名解析?怎么进行的域名解析呢?
因为网络通信是基于tcp/IP的,tcp/ip是基于IP地址的,所以对于域名是无法识别的,人们对于超过10位的IP地址记忆起来又有难度,所以就出现了域名;主机上用户配置了域名对应的子目录,当访问对应的域名时,就可以通过解析访问到对应子目录中的文件。

2.1.2)域名解析:

  每个PC端或者手机端都是一个DNS客户端。

    浏览器将URL中的域名提取出来给DNS客户端;

    dns客户端向DNS服务器发起请求报文,报文中包含URL给的主机名;通过一系列的缓存查询和分布式DNS集群查询;

    dns客户端收到响应报文,里边包含主机名对应的IP地址;

    浏览器获取到IP地址,就可以向IP地址所在的Http服务器发送http请求了。

2.1.3)建立http连接

安全的数据传输必须建立tls连接,经过三次握手完成该项工作。

2.1.4)发起http请求

3)读取响应

当请求响应返回的时候,network 线程会依据 Content-Type 及 MIME Type sniffing 判断响应内容的格式;

常见的有text/html,text/css,text/javascript,image/gif,image/png,等等;

HTML格式文件的处理network线程通知UI线程完成资源获取,UI线程会寻找渲染进程;

其他格式的文件都交给下载管理器来做了,恶意站点和敏感字段的检查也会在该阶段完成。

4)寻找渲染进程,确认导航

network thread 确信浏览器可以导航到请求网页,network thread 会通知 UI thread 数据已经准备好,UI thread 会查找到一个 renderer process 进行网页的渲染。

当 UI 线程发送 URL 请求给 network 线程时,浏览器其实已经知道了将要导航到那个站点。UI thread 会并行的预先查找和启动一个渲染进程,如果一切正常,当 network thread 接收到数据时,渲染进程已经准备就绪了,但是如果遇到重定向,准备好的渲染进程也许就不可用了,这时候就需要重启一个新的渲染进程。

Browser Process 会给 renderer process 发送 IPC 消息来确认导航,一旦 Browser Process 收到 renderer process 的渲染确认消息,导航过程结束,页面加载过程开始。

5)页面渲染

经典的渲染过程

用户在浏览器输入URL或者跳转到一个URL后发生了什么的更多相关文章

  1. 用户在浏览器输入URL回车之后,浏览器都做了什么

    在直接列出执行的步骤之前先来普及几个知识,相信了解完这些知识之后会对前后端的交互有更深入的理解. 1.TCP连接 TCP:Transmission Control Protocol, 传输控制协议,是 ...

  2. 从用户在浏览器输入URL回车之后,浏览器都做了什么

    在直接列出执行的步骤之前先来普及几个知识,相信了解完这些知识之后会对前后端的交互有更深入的理解. 1.TCP连接 TCP:Transmission Control Protocol, 传输控制协议,是 ...

  3. C#按回车Enter使输入焦点自动跳到下一个TextBox的方法收集

    在录入界面中,用户往往需要按回车键时光标自动跳入下一个文本框,以方便录入操作.在C#中实现该功能有多种方法,以下是小编收集的不使用TAB键,而直接用回车键将光标转到下一个文本框的实现方法. 一.利用W ...

  4. 在浏览器输入网址到页面加载完毕中间到底发生了什么?(Browser-->Server)

    最近在学习韩老师的php视频,中间有讲到发送请求到服务器返回内容,以前对这个理解并不深刻,虽然以前也知道一部分,这次听了之后收获良多:所以我就画了个流程图,从浏览器输入网址到服务器返回信息,浏览器渲染 ...

  5. HTTP-点开浏览器输入网址背后发生的那点事

    前言 Internet最早来源于美国国防部ARPANet,1969年投入运行,到现在已有很长一段路了,各位想要了解发展史可以百度下,这里就不多说了. 现如今当我们想要获取一些资料,首先是打开某个浏览器 ...

  6. 用户在浏览器中输入一个url发生的奥秘

    在HTTP 客户端向服务器发送报文之前,需要用网际协议(Internet Protocol,IP)地址和端口号在客户端和服务器之间建立一条TCP/IP 连接. http://207.200.83.29 ...

  7. 在浏览器输入URL后发生了什么?

    摘录部分一:https://www.cnblogs.com/kongxy/p/4615226.html 从输入URL到浏览器显示页面发生了什么 当在浏览器地址栏输入网址,如:www.baidu.com ...

  8. 浏览器输入一个url到整个页面显示出来经历了哪些过程?

    https://cloud.tencent.com/developer/article/1396399 https://www.cnblogs.com/haonanZhang/p/6362233.ht ...

  9. 从一个url输入浏览器到页面渲染出来,这个过程都发生了哪些事情?

    经典问题:在浏览器输入一个url后,会发生什么事情呢? (1)假设是简单的http请求(GET),IPV4,无代理. 浏览器先查看浏览器缓存-系统缓存-路由器缓存,若缓存中有,请略过中间步骤,直接跳到 ...

随机推荐

  1. i++ 是线程安全的吗

    相信很多中高级的 Java 面试者都遇到过这个问题,很多对这个不是很清楚的肯定是一脸蒙逼.内心肯定还在质疑,i++ 居然还有线程安全问题?只能说自己了解的不够多,自己的水平有限. 先来看下面的示例来验 ...

  2. Java中的可变参数

    1.什么是可变参数 可变参数是JDK1.5的新特性,允许一个方式接受任意数量的参数 public static void main(String[] args) { print("a&quo ...

  3. 前台ajax传数组,后台java接收

    后端 //添加 @RequestMapping(value = "checkChoise") @ResponseBody ResultJson checkChoise(@Reque ...

  4. linux命令之查找find &grep

    区别:find找目录下的文件:find+目录路径+条件表达式,grep找文件中的行:grep+匹配正则表达式+文件名 find命令 find命令的一般形式 find命令的常用选项及实例 find与xa ...

  5. 实现mypwd(选做)

    实现mypwd(选做) 任务清单 1 学习pwd命令 2 研究pwd实现需要的系统调用(man -k; grep),写出伪代码 3 实现mypwd 4 测试mypwd (一)pwd命令的学习 1.pw ...

  6. 关于vue给对象新增属性页面不会动态更新

    不知道大家有没有遇到过这个问题,当我们给data里边声明或者已经赋值过的对象或者数组,添加新的属性时,如果更新此属性的值是不会动态更新视图的. $set 看以下实例: 我们开始给drug_list追加 ...

  7. rosbag record and play

    话题录制: 录制所有发布出来的话题,此时默认将话题保存在一个以当时时间戳命名的文件夹中:   $ rosbag record -a1 录制指定话题:   $ rosbag record /topic1 ...

  8. hihoCoder#1879 : Rikka with Triangles (计算几何)

    n<=2000,肯定没有办法把所有三角形找出来全判一遍 对于三角形的三个角,分别计算贡献,锐角的贡献是1倍面积,钝角的贡献是-2倍面积,这样算出角的贡献之后除以3就可以了 每次选择一个点为中心点 ...

  9. Linux_文件系统、磁盘分区_RHEL7

    目录 目录 前言 文件系统 目录结构 文件的类型 文件系统损坏后的修复 磁盘分区 分区的类型 分区最小存储单元 查看当前分区的block的大小 分区格式 MBR格式 GPT格式 mount挂载指令 挂 ...

  10. Selenium学习之==>ActionChainsApi接口详解

    ActionChains UI自动化测试过程中,经常遇到那种,需要鼠标悬浮后,要操作的才会元素出现的这种场景,那么我们就要模拟鼠标悬浮到某一个位置,做一系列的连贯操作,Selenium给我们提供了Ac ...