面试官:输入URL之后发生了什么?

URL的组成

1.1 DNS解析查询

服务器都是有自己的IP的,但是IP地址很难记,域名相对比较好记,比如www.baidu.com,那么就需要DNS将IP地址和域名做一个映射。

DNS查找顺序
  • 浏览器自身DNS

  • 操作系统DNS

  • 本地hosts文件

  • 向域名服务器发送请求

DNS查找的规则

配置了CDN,DNS会将最终的域名解析权交给CNAME(别名指向)指向的CDN专用DNS服务器。

1.2 TCP三次握手、四次挥手

前面的篇章已经学习!!!

HTTP请求的方法有以下几种:

  1. GET: 用于请求指定资源,服务器将返回相应资源的内容。GET请求通常用于获取数据,不应该对服务器状态产生任何影响,是幂等的。
  2. POST: 用于向服务器提交数据,常用于提交表单或上传文件等操作。POST请求将请求的数据放在请求体中,相比GET请求可以传输更大量的数据。
  3. PUT: 用于向指定资源位置上传新的内容,或者替换原有资源。PUT请求的主要作用是更新资源,通常用于更新特定资源的全部内容。
  4. DELETE: 用于请求服务器删除指定的资源。DELETE请求将请求的URI所标识的资源从服务器上删除,如果删除成功,则返回204(No Content)状态码。
  5. HEAD: 与GET方法类似,但是服务器在响应中只返回首部,不返回实体的主体部分。HEAD请求常用于获取资源的元数据,如资源的大小、类型等,而不需要获取实际内容。
  6. OPTIONS: 用于获取目标资源所支持的通信选项,即查询服务器支持的HTTP请求方法和其他特性。OPTIONS请求常用于跨域请求的预检查,以确定是否可以发送实际的请求。
  7. PATCH: 用于对资源进行部分修改。PATCH请求的语义与PUT请求类似,但是它只对资源的部分进行更新,而不是替换整个资源。
  8. TRACE: 用于测试请求路径中的代理服务器的性能。TRACE请求会在目标服务器接收到请求后,将请求的内容原样返回给客户端,用于诊断和调试。 这些HTTP请求方法提供了丰富的功能,可以满足不同场景下的需求。
预检请求
触发预检请求
  1. 跨域
  2. 自定义请求头

1.3 缓存

强缓存一般缓存一些静态资源,一般是通过后台去配置的。 多次刷新网页,就会触发内存缓存。

思考?如果两种缓存并存,那个优先级高?

在强缓存中,存在两种常见的缓存机制,即Expires和Cache-Control。当这两种缓存机制同时存在时,Cache-Control的优先级更高。这是因为Cache-Control是HTTP/1.1引入的新特性,具有更灵活的控制选项,能够提供更精细的缓存策略。相比之下,Expires是HTTP/1.0的标准,其缓存控制相对简单,只能指定一个绝对的过期时间点,而无法像Cache-Control那样指定相对时间或其他高级选项。因此,当Expires和Cache-Control同时存在时,浏览器会优先遵循Cache-Control的指令来进行缓存控制。

思考?如果两种缓存并存,那个优先级高?

协商缓存中存在两种常见的缓存验证机制,即Last-Modified和ETag。当这两种机制同时存在时,ETag的优先级更高。这是因为ETag是一种更精确的缓存验证方式,它通过对资源内容的哈希值或其他标识符进行计算,来确定资源是否发生了变化。相比之下,Last-Modified只提供了资源的最后修改时间,存在一定的时间粒度问题,并且在某些情况下可能导致缓存不准确。 因此,当浏览器同时收到Last-Modified和ETag时,它会优先使用ETag进行缓存验证,以确保缓存的准确性和可靠性。

1.4 渲染HTML

1.5 解析JS

字节码的作用:做跨平台

V8用的是JIT解析器,也就是即时编译,还有一个解析器是AOT,将代码直接编译成二进制数据。

1.6 CPU

计算机组成原理:

相关推荐
Mintopia6 分钟前
🌈 React-Markdown 教学指南 —— 写给想让网页诗意地“读懂” Markdown 的你 ✨
前端·react.js·markdown
LYFlied8 分钟前
浏览器渲染图层详解
前端·性能优化·图形渲染·浏览器
DO_Community18 分钟前
加速 JavaScript 开发:DigitalOcean 应用托管现已原生支持 Bun
开发语言·前端·javascript
m0_6726565422 分钟前
React 使用 JSX 来替代常规的 JavaScript。
前端·javascript·react.js
她说彩礼65万22 分钟前
CSS 相对定位与绝对定位
前端·css
程序员王天23 分钟前
SQLite 索引智能构建:从每次启动30秒到秒开
前端·oracle·electron·sqlite
AI前端老薛27 分钟前
HTTP和HTTPS的区别
网络协议·http·https
mon_star°29 分钟前
《疯狂动物城2》主题网页设计之旅
前端
一只爱吃糖的小羊29 分钟前
Vue 3 vs React 19:响应式系统的“自动挡“与“手动挡“之争
前端·vue.js·react.js
AC赳赳老秦30 分钟前
使用PbootCMS制作网站如何免费做好防护
前端·数据库·黑客·网站建设·网站制作·防挂马·网站防黑