[HTTP] HTTP 1.1/2/3

HTTP1.1

假设你开了一家小卖部,但只有1个快递员帮你送货。这时候你会发现两个问题:

1️⃣ 队头阻塞问题:想象快递员每次只能拿一个快递,而且要严格按照顺序送。如果第一个快递是送到很远的山区(需要2小时),后面所有快递都要等这个山区快递送完才能出发。这时候就算后面的快递都是送到隔壁小区(只要5分钟),也要白白等2小时!这就是"队头阻塞"——前面慢的请求会堵住后面所有请求。

2️⃣ 请求排队问题:后来你招了6个快递员(Chrome浏览器最多同时发6个请求)。当你要送第7个快递时,会发现所有快递员都在忙,新快递只能放在门口的篮子里排队。直到有快递员送完回来,才能处理篮子里积压的快递。这时候你的小卖部门口就会堆满等待的快递!

✏️ 总结成两句话:

  • 队头阻塞就像只有一个窗口的食堂,前面同学点10碗拉面,后面买包子的同学也得等着。

  • 请求排队就像游乐场的过山车,虽然有6个座位(6个并发请求),但第7个人必须等有人玩完才能上车。

 

HTTP2

假设你的小卖部升级成了物流中心,还买了一辆大货车(HTTP/2 的一个 TCP 连接)。这辆货车有 3 个神奇功能

1️⃣ 多路复用(一次装所有快递,不用排队!)

  • 旧问题(HTTP/1.1):6个快递员各自开小车送快递(6个TCP连接),每辆车只能装1个快递(一个请求)。

  • 新方案(HTTP/2):一辆大货车把所有快递拆成小包裹,混在一起装车,同时出发!

    • 比如:第1个快递(A)拆成包裹A1、A2、A3,第2个快递(B)拆成包裹B1、B2,所有包裹同时发车

    • 货车到达后,快递员再把这些小包裹按编号拼回完整的快递(二进制分帧传输)。

    • 结果:远距离的快递(A)和近距离的快递(B)的包裹交替运输,谁先到就先处理谁,彻底消灭队头阻塞!

2️⃣ 优先级(加急快递先送!)

  • 旧问题:所有快递按先来后到处理,重要的文件可能被卡在后面。

  • 新方案:给每个快递贴优先级标签!比如:

    • ⚡️网页的HTML/CSS文件:最高优先级(贴红色标签),货车优先运输。

    • 🖼️网页的图片:普通优先级(贴蓝色标签),有空位再运。

    • 结果:用户打开网页时,文字和排版先加载出来(不卡顿),图片慢慢显示,体验更流畅!

3️⃣ 头部压缩(包裹体积缩小!)

  • 旧问题:每个快递都要带一张巨大的快递单(HTTP头部),重复写收货地址、发货人等信息。

  • 新方案:用缩写符号代替重复内容(HPACK算法)。

    • 比如:第一次写"收货地址:北京市海淀区",之后直接用代号"#1"表示。

    • 结果:快递单体积缩小,货车能装更多包裹!

 

直观对比:HTTP/1.1 vs HTTP/2

场景 HTTP/1.1 HTTP/2
快递运输方式 6辆小车各自运1个 1辆大货车运所有
队头阻塞 ✅ 严重(小车堵住) ❌ 消失(包裹交替运)
优先级处理 ❌ 没有 ✅ 智能标签
快递单(头部) 重复写,体积大 缩写符号,体积小

 

实际效果(打开一个网页)

  • HTTP/1.1:6个快递员疯狂来回跑,第7个文件必须等,远距离文件卡住所有人。

  • HTTP/2:一辆大货车把所有文件拆成小包裹,混在一起运。用户先看到文字,再看到图片逐渐加载,几乎没有卡顿!

 

HTTP3

假设你的物流中心又升级了!这次买了会飞的魔法货车(HTTP/3的QUIC协议),它用UDP协议(而不是TCP)当燃料,还自带3个神器:

1️⃣ 独立货舱(彻底消灭队头阻塞!)

  • 旧问题(HTTP/2):大货车虽然能混装包裹,但如果爆胎了(TCP丢包),所有包裹都要等修好轮胎才能继续送。

  • 新方案(HTTP/3):把货车变成无数个小飞行舱,每个舱只装一个包裹,独立飞行!

    • 比如:包裹A1、A2、B1、B2各自飞向目的地,互不干扰

    • 如果包裹A1的飞行舱坏了(丢包),只重飞A1,其他包裹照常飞!

    • 结果:连修轮胎的等待时间都没了,彻底解决队头阻塞!

2️⃣ 闪电握手(0秒建立连接!)

  • 旧问题:HTTP/2的货车每次出发前,司机要和客户握手3次(TCP三次握手),耗时1.5秒。

  • 新方案:飞行货车自带人脸识别系统(首次连接就加密),以后见面直接起飞!

    • 第一次送货:司机和客户交换秘密暗号(加密密钥),耗时1秒。

    • 之后送货:刷脸秒过,0秒起飞!

    • 结果:网页打开速度更快,尤其是手机网络切换WiFi/4G时(比如进地铁),连接几乎不断!

3️⃣ 自带防弹装甲(加密所有包裹!)

  • 旧问题:HTTP/2的货车虽然安全,但货舱门(TCP协议)本身不加密,黑客可能撬门。

  • 新方案:飞行货车的整个机身(QUIC协议)都裹上防弹装甲,连螺丝钉都加密!

    • 黑客想偷看包裹?连轮胎气压数据都看不懂!🔐

    • 结果:安全性拉满,用户隐私更有保障!

对比HTTP/2和HTTP/3

场景 HTTP/2 HTTP/3
运输协议 传统货车(TCP协议) 飞行货车(UDP+QUIC协议)
队头阻塞 ❗️ 爆胎会堵住所有包裹 ✅ 包裹独立飞,堵不住!
首次连接速度 1.5秒(三次握手) 1秒(加密+握手合并)
网络切换 需重新握手(卡顿) 秒切网络(无感)
安全性 货舱加密,车门不加密 全身加密,黑客无从下手

 

实际效果(极端情况测试)

  • HTTP/2:用4G打开网页时,电梯里信号丢包,整个网页卡住转圈圈⏳。

  • HTTP/3:同样的场景,只有模糊的图片加载慢,文字和按钮照样秒加载,用户能正常操作!✨

终极总结

  • HTTP/1.1 → 6辆三轮车送快递(慢、堵、累)。

  • HTTP/2 → 1辆大货车混装送(快,但怕爆胎)。

  • HTTP/3 → 满天飞行舱狂飙(又快又稳,爆胎也不怕)!

posted @   Zhentiw  阅读(2)  评论(0编辑  收藏  举报
相关博文:
阅读排行:
· 在鹅厂做java开发是什么体验
· 百万级群聊的设计实践
· WPF到Web的无缝过渡:英雄联盟客户端的OpenSilver迁移实战
· 永远不要相信用户的输入:从 SQL 注入攻防看输入验证的重要性
· 浏览器原生「磁吸」效果!Anchor Positioning 锚点定位神器解析
历史上的今天:
2024-02-21 [Rust] Char vs String
2023-02-21 [Javascript Tips] Using Map over Object
2021-02-21 [Javascript] Intl.ListFormat
2020-02-21 [Javascript] Understanding the difference between .prototype and .__proto__ in JavaScript
2020-02-21 [Javascript] let doesn't hoist -- false
2020-02-21 [AST Babel Plugin] Hanlde ArrowFunction && FunctionExpression
2020-02-21 [AST Babel] Add function name into the console log 'path.findParent(t.isFunctionDeclaration)'
点击右上角即可分享
微信分享提示