如何在我的网站上测量客户端的图像下载时间？ [英] How to measure image download time on client side for my website?

问题描述

在Img标签中，我们知道图像有一个OnLoad事件，当图像完成加载时会触发该事件。但是，当图像开始下载时，我们能获得准确的测量吗？我正在尝试测量网站的页面加载时间，因此知道加载图像所需的时间将是我的分析的一部分，如果可能的话。

In the Img tag, we know that the image has an OnLoad event that fires when the images finish loading. But can we get the accurate measure when the image begin to download? I am trying to measure a website's Page Load Time, so knowing how long it takes for an image to load will be part of my analysis if that's possible.

我想要从自动化的方式来做，所以我可以测量真实的客户体验而不是将我的网站放在Yslow或PingDom上（ http ：//tools.pingdom.com/fpt/ ）。我试图查看Navigation Timing Apis（http://w3c-test.org/webperf/specs/NavigationTiming/），遗憾的是，即使它们提供了诸如DNS解析时间之类的见解，但是在Web请求中的资源获取似乎并不存在。得到支持。

I would like to do it from an automated fashion, so I can measure real client experiences instead of putting my website on Yslow or PingDom( http://tools.pingdom.com/fpt/). I have tried to look into Navigation Timing Apis (http://w3c-test.org/webperf/specs/NavigationTiming/) unfortunately even they provide insights such as DNS resolution time, but resource fetching within the web request doesn't seemed to be supported.

推荐答案

您可以开始尝试使用Chrome Dev Channel的IE10来验证资源计时API是否符合您的需求 - getEntriesByName是可能最常用于单个资源的方法。

You can start to experiment with whether the Resource Timing API will meet your needs useing either IE10 of the Chrome Dev Channel - getEntriesByName is the method that's probably most use for a single resource.

我在Performance Advent Calendar中编写了一个引子 http://calendar.perfplanet.com/2012/an-introduction-to-the-resource-timing-api/

I wrote a primer form the Performance Advent Calendar http://calendar.perfplanet.com/2012/an-introduction-to-the-resource-timing-api/

这篇关于如何在我的网站上测量客户端的图像下载时间？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！