-
带宽简介
“把城市交通道路比作网络,道路会出现单车道、双车道、四车道、八车道。你开着一辆车,在路上行驶,途径单车道、双车道、四车道、把车道,最后到达目的地。”
上述场景中出现了几个关键词:
- 城市交通: 网络
- 整个车道的宽度: 带宽
- 单车道、双车道、四车道、八车道: 带宽大小
- 你开的车子: 网络传输的信息
而 带宽 是用来传输信息的,信息肯定有一个具体的量值,我们称它为 数字信息流 。 数字信息流 的单位是 bit
(比特),时间单位是 s
(秒),所以描述 带宽 的单位是 bit/s
(比特/秒)。想象一下每秒 1 bit/s 的下载速度,是不是要亲妈爆炸 💥 。现在的电信宽带上网,速度在 512 K bit/s (千比特每秒) 至 10 M bit/s (兆比特每秒) 之间。以太网就更快了,速度在 10 M bit/s (兆比特每秒) 以上。
KB 和 Kb 实际上是不一样,很多资料都没有严格区别,实际上这是不严谨的。大写 B 和小写 b 不同,大写 B 代表 Byte,字节;小写 b 代表 bit,比特。1 B = 8 b
也就是说我们平时办理的 100 M宽带,换算一下的话就是:
100 M b/s = (100 * 2400) K b/s = (100 * 2400 / 8) KB/s = 12800 KB/s = 12.5 M/s
上面一顿算,只是理想状态下的,而现实是,受“用户计算机性能、网络设备质量、资源使用情况、网络高峰期、网站服务能力、线路损耗,信号衰减”等多种因素的影响,会造成实际网速并没有理想的那么快。
-
浏览器同域并发数
说完带宽,我们来了解一下,一个浏览器,同域 下能并发多少个网络资源请求。 我们以谷歌浏览器为例子,是 6 个。我找到一份 2008 年的权威数据😱(惊了):
图片来自:地址
-
性能优化
雪碧图
为什么要做雪碧图?一张雪碧图里,图标多的情况下,有几十个小图标。如果把这些图标都换成单图加载,假设首页需要 100 个这样的小图标,同时加载 100 张图片。谷歌浏览器并发请求是 6 个,你说炸不炸(当然没有这么夸张,我就是说得夸张一点,吓唬吓唬你)。
减少 HTTP 请求-加缓存等
为什么要减少 HTTP 请求?还不是 服务器带宽大小 和 浏览器并发数 摆在那儿。如果频繁的并发请求,在某一时刻同时有多人完成大量的并发请求,服务器带宽不大(车道很窄)的情况下,会造成交通拥堵现象。(当然,负载均衡和启动多进程能解决这个问题)。
路由异步加载
异步加载的目的,就是减少首次加载的静态资源大小,在不需要其他页面资源的情况下,就无需在首页加载。而减少静态资源的体积的目的,一个是网速慢,加载会很慢;另一个是静态资源太大,服务器带宽小的情况下,响应时间也会变长。
图片资源转 CDN
图片资源转 CDN,目的就是不和网站 主域 抢资源。前面提到了谷歌浏览器 同域 下的并发请求数是 6 个,敲黑板!!!你把图片资源放在 主域 下,它会去抢网络资源啊。所以你会看到很多网站,就比如掘金,会把图片放在另外一个域下的 CDN 链接。甚至还会放在多个不同的域下。
压缩静态资源和分包
压缩静态资源和分包操作,就是考虑到服务器 带宽 传输信息的量在单位时间内是有限的,所以压缩完之后,单次请求的资源体积变小了,自然速度就会变快。
还有很多,我不举了(别瞎想),去掘金搜索框内输入“性能优化”,多如牛毛。