• 从用户在浏览器输入网址,看到整个页面,中间发生了哪些事情?


    一道面试题:从用户在浏览器输入网址,看到整个页面,中间发生了哪些事情?

    1. ​ HTTP请求阶段

    2. ​ HTTP的响应阶段

    3. ​ 浏览器渲染阶段(就是拿到数据,浏览器如何将内容渲染出来?)

      客户端(浏览器:为多线程的程序)

      ​ Request请求阶段:DNS解析(获取服务器的ip地址), TCP协议的三次握手建立连接,四次挥手释放连接, HTTPS和HTTP区别, HTTP1 和 HTTP2版本区别

      ​ 拿到代码,浏览器在内存条中开辟栈内存,为拿到的代码提供执行环境,同时分配一个主线程,去一行行解析代码。进栈执行,出栈退出。

      TASK_QUEUE任务队列:

      ​ 浏览器遇到资源加载,网络请求,分配新的线程去完成加载资源

      浏览器开辟新的线程,去加载资源文件
      <link href="http://www.xxx.com/test.js">
      <script>
       <img>
      

      生成DOM Tree

      生成CSS OM

      EventLoop事件循环: 主线程执行完当前任务后,在到主任务队列中执行下一个,这样循环的执行。 微任务 宏任务?????

      DOM Tree 和 CSSOM生成 Render Tree

      回流:根据Render Tree 和 当前的可视窗口大小(比如说你的电脑的屏幕显示区域的大小),专业用语叫做设备视口(viewpor),来计算元素的确确切位置和大小,这个计算的阶段叫做回流。

      重绘:根据回流得到的位置和Render Tree得到的集合信息,得到节点的绝对像素.??

      展示: 然后通知GPU绘制(paint)

      服务器端(Web服务器)

      ​ Response响应阶段:HTTP状态码, 304缓存(性能优化), HTTP报文

    补充知识点:

    1. ​ 线程 Process: 正在运行的程序

    2. ​ 进程 Thread:有些进程不止同时干一件事情,要同时干多件事情,比如同时进行逻辑运算和读写磁盘,就需要同时运行多个“子任务”,我们把进程中的子任务称作“线程” 。在进程中实际干活的

      多线程同时执行,在微观上是操作系统在多个线程中来回切换。

    3. 栈内存 Stack

    4. ​ 堆内存 Heap

    性能优化:

    减少http请求次数和文件大小(资源合并压缩:js,css,使用雪碧图)

    *图片懒加载

    音视频走流文件

    慢慢来,比较快!基础要牢,根基要稳!向大佬致敬!
  • 相关阅读:
    Java自学
    Java自学
    Java自学
    java自学
    Java自学
    mybatis基础及原理
    自定义swagger maven codegen插件
    spring学习总结016 --- spring事务原理
    spring学习总结015 --- spring事务
    windows解决端口占用问题
  • 原文地址:https://www.cnblogs.com/rookie123/p/14459224.html
Copyright © 2020-2023  润新知