JavaScript img onload - progressive jpg / jpeg

Question

有没有办法检测渐进式JPEG （或至少第一个）的每一步的加载？

一旦加载了最终（高质量）图像，就会触发onload（）事件。

在Chrome中测试过。

Answer 1

没有活动。

有loadstart事件告诉您浏览器何时发出请求，但它并不代表任何数据。

如果浏览器知道图像尺寸，则可以保持轮询.naturalHeight属性以观察，这意味着至少它已经获得了一些数据。

一个绝望的选择，在大多数情况下很可能效率太低，是使用XHR / fetch下载图像（允许您观察下载进度），然后继续将部分数据设置为Blob图像元素。我使用这个hack来演示ImageOptim API demo page上的慢动作渐进式图像加载。