从输入一个URL到页面完全显示发生了什么?
这是经典的前端问题,主要是对浏览器的工作原理有个理解!
网络通信走的一般是五层因特网协议,详见下图。图片来自于https://images2018.cnblogs.com/blog/882926/201711/882926-20171127181032128-471806615.png
大致步骤如下:
1.域名解析
浏览器查找域名的IP地址,这一步包括DNS的具体查找过程,DNS属于应用层协议。客户端会检查本地是否有对应的IP地址,若存在则返回,否则请求上级DNS服务器,一直到找到为止或者最终到根节点。
显然这一过程可能非常耗时,所以很多网站都会采用dns-prefetch,使浏览器在空闲时间就将这些域名转化为ip地址,这样就能有效减少时间。以淘宝网为例:
其实DNS的查找过程包括:浏览器缓存-》系统缓存-》路由器缓存...
2.TCP三次握手,客户端向服务器发送http请求
服务器可能会有永久服务器重定向相应,客户端随之继续追踪重定向地址。
3.服务器返回一个http响应
4.客户端得到html代码
5.客户端解析HTML代码,并请求html代码中的资源(图片,音频,css,js等)
6.浏览器对页面进行渲染,展现给用户
主要是解析html构成dom树,解析css构成render树,dom树和render树结合进行布局和绘制!
参考链接:
从输入一个URL到页面完全显示发生了什么?的更多相关文章
- 输入一个URL到页面呈现其中发生的过程-------http过程详解
在我们点击一个网址,到它能够呈现在浏览器中,展示在我们面前,这个过程中,电脑里,网络上,究竟发生了什么事情. 服务器启动监听模式 那我们就开始了,故事其实并不是从在浏览器的地址栏输入一个网址,或者我们 ...
- 从输入一个URL到页面渲染的流程简介
首先说明以下是我参考网上答案和自己的思考,给出自己的想法,如果有问题,欢迎大家吐槽从用户在浏览器中输入一个URL,到整个页面渲染,这个过程中究竟发生了什么呢?今天先简单写下整个过程,后面再一点点完善. ...
- 经典面试题:在浏览器地址栏输入一个 URL 后回车,背后发生了什么
尽人事,听天命.博主东南大学硕士在读,热爱健身和篮球,乐于分享技术相关的所见所得,关注公众号 @ 飞天小牛肉,第一时间获取文章更新,成长的路上我们一起进步 本文已收录于 CS-Wiki(Gitee 官 ...
- 从输入一个URL到页面呈现,网络上都发生了什么?
归纳一下其中涉及到前端的一些基础知识,主要包括:http协议.web标准.w3c标准等. 这个问题虽然只有两个2个动作:输入URL和呈现页面,但这背后发生了很多"有趣" ...
- 笔试常考--浏览器输入一个URL点击回车之后发生了什么
解析URL:浏览器首先对拿到的URL进行识别,抽取出域名字段. DNS解析: 查询浏览器缓存(浏览器会缓存之前拿到的DNS 2-30分钟时间),如果没有找到, 检查系统缓存,检查hosts文件,这个文 ...
- 当在浏览器中输入一个url后回车,后台发生了什么?比如输入url后,你看到了百度的首页,那么这一切是如何发生的呢?
简单来书有以下步骤: 查找域名对应的IP地址.这一步会依次查找浏览器缓存,系统缓存,路由器缓存,ISPDNS缓存,13台根域名服务器. 向IP对应的服务器发送请求. 服务器响应请求,发回网页内容. 浏 ...
- 【ASP.NET Core】EF Core - “影子属性” 深入浅出经典面试题:从浏览器中输入URL到页面加载发生了什么 - Part 1
[ASP.NET Core]EF Core - “影子属性” 有朋友说老周近来博客更新较慢,确实有些慢,因为有些 bug 要研究,另外就是老周把部分内容转到直播上面,所以写博客的内容减少了一点. ...
- 网易笔试题:浏览器中输入一个url后回车到返回页面信息的过程
You enter a URL into the browser输入一个url地址 The browser looks up the IP address for the domain name浏览器 ...
- 浏览器输入一个url到整个页面显示出来经历了哪些过程?
https://cloud.tencent.com/developer/article/1396399 https://www.cnblogs.com/haonanZhang/p/6362233.ht ...
随机推荐
- iOS中 UITabBarController中自定义UITabBar
1.创建多个视图控制器,放如UITabBarController中 AViewController *aa = [[AViewController alloc] init]; UINavigation ...
- Java最最常用的100个类排序(非官方)
下面这句话是引用"大部分的 Java 软件开发都会使用到各种不同的库.近日我们从一万个开源的 Java 项目中进行分析,从中提取出最常用的 Java 类,这些类有来自于 Java 的标准库, ...
- (五十六)iOS多线程之NSOperation
NSOpertation是一套OC的API,是对GCD进行的Cocoa抽象. NSOperation有两种不同类型的队列,主队列和自定义队列. 主队列运行于主线程上,自定义队列在后台运行. [NSBl ...
- ssh连接原理介绍( 无密码连接登录的原理)
SSH(Secure Shell)一种在不安全网络上提供安全远程登录及其它安全网络服务的协议.由客户端和服务端的软件组成的,有两个不兼容的版本分别是:1.x和2.x.(SSH 2.x的客户程序是不能 ...
- Unity 5.X扩展编辑器之打包assetbundle
5.x的assetbundle与4.x以及之前的版本有些不同,不过本质是一样的,只不过5.x打包assetbundle更为简单和人性化了,总体来说只需要三个步骤: 第一步:创建打包资源 //这里是一个 ...
- react-native-android之初次相识
作为一名Android开发者,我的感觉就是,一步一卡,卡的潇洒. 但是我还是要学react-native,不要问我为什么,因为我相信一门解决了原生app,开发周期长,开发成本高,升级代价大的语言一定会 ...
- Java集合之Hashtable
和HashMap一样,Hashtable也是一个散列表,存储的内容也是键值对key-value映射.它继承了Dictionary,并实现了Map.Cloneable.io.Serializable接口 ...
- 非阻塞IO模式原理
与阻塞模式对应的另一种模式叫非阻塞IO模式,在整个通信过程中读和写操作不会阻塞,当前处理线程不存在阻塞情况.从A机器到B机器它的通信过程是:A机器一条线程将通道设置为写事件后往下执行,而另外一条线程遍 ...
- Global Financial Applications uses the following Public tables
来自文档: Oracle Financial Applications Technical Reference Manual 更多明细参考文档 Table Name ...
- Java I/O最简单的几个类
今天把I/O中最简单的几个类整理了一下,之所以整理最简单的,是因为这样会让我更加快速方便的理顺这里面的东西,以前每一次用的时候都要先百度一下,觉得很烦. 首先需要先看一下Read,Write和Stre ...