这是经典的前端问题,主要是对浏览器的工作原理有个理解!


网络通信走的一般是五层因特网协议,详见下图。图片来自于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到页面完全显示发生了什么?的更多相关文章

  1. 输入一个URL到页面呈现其中发生的过程-------http过程详解

    在我们点击一个网址,到它能够呈现在浏览器中,展示在我们面前,这个过程中,电脑里,网络上,究竟发生了什么事情. 服务器启动监听模式 那我们就开始了,故事其实并不是从在浏览器的地址栏输入一个网址,或者我们 ...

  2. 从输入一个URL到页面渲染的流程简介

    首先说明以下是我参考网上答案和自己的思考,给出自己的想法,如果有问题,欢迎大家吐槽从用户在浏览器中输入一个URL,到整个页面渲染,这个过程中究竟发生了什么呢?今天先简单写下整个过程,后面再一点点完善. ...

  3. 经典面试题:在浏览器地址栏输入一个 URL 后回车,背后发生了什么

    尽人事,听天命.博主东南大学硕士在读,热爱健身和篮球,乐于分享技术相关的所见所得,关注公众号 @ 飞天小牛肉,第一时间获取文章更新,成长的路上我们一起进步 本文已收录于 CS-Wiki(Gitee 官 ...

  4. 从输入一个URL到页面呈现,网络上都发生了什么?

    归纳一下其中涉及到前端的一些基础知识,主要包括:http协议.web标准.w3c标准等.       这个问题虽然只有两个2个动作:输入URL和呈现页面,但这背后发生了很多"有趣" ...

  5. 笔试常考--浏览器输入一个URL点击回车之后发生了什么

    解析URL:浏览器首先对拿到的URL进行识别,抽取出域名字段. DNS解析: 查询浏览器缓存(浏览器会缓存之前拿到的DNS 2-30分钟时间),如果没有找到, 检查系统缓存,检查hosts文件,这个文 ...

  6. 当在浏览器中输入一个url后回车,后台发生了什么?比如输入url后,你看到了百度的首页,那么这一切是如何发生的呢?

    简单来书有以下步骤: 查找域名对应的IP地址.这一步会依次查找浏览器缓存,系统缓存,路由器缓存,ISPDNS缓存,13台根域名服务器. 向IP对应的服务器发送请求. 服务器响应请求,发回网页内容. 浏 ...

  7. 【ASP.NET Core】EF Core - “影子属性” 深入浅出经典面试题:从浏览器中输入URL到页面加载发生了什么 - Part 1

    [ASP.NET Core]EF Core - “影子属性”   有朋友说老周近来博客更新较慢,确实有些慢,因为有些 bug 要研究,另外就是老周把部分内容转到直播上面,所以写博客的内容减少了一点. ...

  8. 网易笔试题:浏览器中输入一个url后回车到返回页面信息的过程

    You enter a URL into the browser输入一个url地址 The browser looks up the IP address for the domain name浏览器 ...

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

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

随机推荐

  1. Android进阶(九)APP编程感想

    从初识Android到现在,在不断做APP(二维码.条形码扫描,彩票购买,火车票余票查询)的过程中,自己学会了很多东西.找时间整理了一下,总结如下: 其中,对于前两个APP,自己都是在他人已完成的基础 ...

  2. UNIX环境高级编程——UNIX基础知识

    1.用户在登陆linux系统时,先键入登录名,然后键入口令.系统在其口令文件(通常是/etc/passwd文件)中查看登录名.口令文件中的登陆项由7个以冒号分隔的字段组成,它们是:登录名.加密口令.数 ...

  3. 关于Debug和Release之本质区别的讨论

    一.Debug 和 Release 编译方式的本质区别     Debug 通常称为调试版本,它包含调试信息,并且不作任何优化,便于程序员调试程序.Release 称为发布版本,它往往是进行了各种优化 ...

  4. OJ题:字符串分隔

    题目描述 •连续输入字符串,请按长度为8拆分每个字符串后输出到新的字符串数组:•长度不是8整数倍的字符串请在后面补数字0,空字符串不处理. 输入描述: 连续输入字符串(输入2次,每个字符串长度小于10 ...

  5. OC语言大总结(下)

    根据OC学习的知识点,总结了一下,希望能帮到大家! 作者:韩俊强   未经允许,请勿转载! 关注博主:http://weibo.com/hanjunqiang 上接:http://blog.sina. ...

  6. Leetcode_80_Remove Duplicates from Sorted Array II

    本文是在学习中的总结,欢迎转载但请注明出处:http://blog.csdn.net/pistolove/article/details/43835055 Follow up for "Re ...

  7. UE4 创建第三人称角色

    一.C++创建 1.      创建一个C++类,继承自Character,取名MyThirdCharacter 2.      在头文件中声明一个摄像机目标点CameraBoom,一个摄像机Foll ...

  8. REST(Representational State Transfer表述性状态转移)

    参考内容:http://www.csdn.net/article/2013-06-13/2815744-RESTful-API 定义了一组体系架构原则,您可以根据这些原则设计以系统资源为中心的 Web ...

  9. centOS 安装(光安装 和 u盘安装)

    光盘安装用这个: http://www.williamlong.info/archives/1912.html 是否保留win7,要作好相关配置.有些插件可以不装. 网络设置:不好弄 如果用u盘安装, ...

  10. EBS 系统标准职责定义MAP

    ERP的相关职责           Responsibility Name(职责) Application(应用) Responsibility Key(关键字) Data Group(数据组) M ...