浏览器的资源并发亲试
前几天ali一个视频面试,给问到一个问题 为什么图片要分多个域名? 我开始以为他问我cdn,然后他再强调了一遍,为什么要分多个域名?
然后我认真想了想 不知道为什么,之后找我师傅叶小钗问了一下,他回答说一个域名下载有限,于是乎,我抽空写了一个demo。(只测试了pc和ios的 safari)
1、首先我准备了1张10M的图片 ,一个5M的js 和一个4M的css, 各复制了10次 改了10个不一样的名字。
2、准备了 a.com 和b.com 2个域名
同域名pc 和手机的并发情况
pc(chrome): 同一域名下 能同时并发6个 请求。
如果单纯 js, 同一时间也只能发6个。
由此可见,图片的请求,是会阻塞页面js的请求的, 所以移动端需要控制好首屏的请求数量, 会请求文件的大小(例如如果框架太大会阻塞页面渲染)
手机:
只请求js
只请求css
可以看出手机上同一时间只能同时请求4个资源。
不同域名pc 和手机的并发情况
pc:
css
手机:
css
可以看出 pc上不同域名并发是各6个请求,2个域名一共加起来是12个请求。
手机上不同域名并发 各4个, 2个域名一共加起来是 8个请求。
总结:
控制好页面初始加载请求数量,适当的合并,如项目首屏用到图片,应该以懒加载的方式。
还有如果网络稳定流畅的情况,可以通过访问不同域名的资源来提高请求的并发数量
分类:
Javascript
, Css
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· Linux系列:如何用 C#调用 C方法造成内存泄露
· AI与.NET技术实操系列(二):开始使用ML.NET
· 记一次.NET内存居高不下排查解决与启示
· 探究高空视频全景AR技术的实现原理
· 理解Rust引用及其生命周期标识(上)
· 阿里最新开源QwQ-32B,效果媲美deepseek-r1满血版,部署成本又又又降低了!
· 单线程的Redis速度为什么快?
· SQL Server 2025 AI相关能力初探
· 展开说说关于C#中ORM框架的用法!
· AI编程工具终极对决:字节Trae VS Cursor,谁才是开发者新宠?