HTTP/2流优先级为何成为性能优化的隐形战场:从依赖树到服务器缓冲区的完整技术解析

2019年,一个电商平台发现他们的页面在Chrome下加载需要8秒,而换用Firefox只需要4秒——同样网络环境、同样服务器、同样代码。性能团队排查了DNS、TLS握手、服务器响应时间,所有指标都正常。最终发现问题出在一个被大多数人忽略的地方:HTTP/2流优先级。浏览器向服务器发送了优先级信号,但服务器没有正确处理。这不是个案。Andy Davies的测试显示,全球主流CDN中只有不到30%正确实现了HTTP/2优先级。Google Cloud CDN、Amazon CloudFront、Azure CDN——这些巨头的服务都曾在这个问题上栽过跟头。 ...

12 min · 5698 words

移动端点击为何总是慢半拍:从300ms延迟到触摸事件处理的完整技术解析

2014年,一个开发者做了这样一个测试:在一个配置了正确viewport的移动端页面上,连续点击按钮10次。在没有优化的情况下,完成这个操作需要约5秒;而消除300ms延迟后,同样的操作只需要约3秒。这2秒的差距,足以让用户放弃一个Web应用。 ...

10 min · 4993 words
Blog Cover

为什么setTimeout不是最佳让出方案:从4ms最小延迟到优先级续行的技术突围

2023年9月,土耳其电商平台Trendyol的产品详情页INP指标高达963毫秒,处于"差"评级。用户点击商品后,页面近乎冻结。六个月后,这个数字降到了481毫秒——INP改善50%,点击率提升1%。转折点只改动了了几行代码:用scheduler.yield()替换了setTimeout。 ...

14 min · 6667 words

移动端点击为何总是慢半拍?从300ms延迟到触摸事件处理的完整技术解析

2007年,第一代iPhone发布时,一个看似简单的决定埋下了困扰移动Web开发十年的技术债务:为了区分单击和双击缩放,移动浏览器在每次点击后都要等待约300毫秒。这个延迟在当时的桌面网页上几乎不可感知,但在触摸交互的场景中却成了用户体验的隐形杀手。 ...

9 min · 4439 words

HTTP/2 Server Push:一个被寄予厚望的特性为何在七年中走向消亡

2015年5月,HTTP/2作为RFC 7540正式发布。在众多新特性中,Server Push被寄予了最高的期望——它被认为是解决"关键请求链"延迟问题的终极方案。理论上,当浏览器请求HTML时,服务器可以同时推送CSS、JavaScript等资源,将原本需要两个往返时间(RTT)的加载过程压缩为一个。 ...

11 min · 5298 words