Google Chrome从缓存加载图片的速度比下载慢

Question

我正在建立一个Web应用程序以浏览本地服务器上的大照片。

奇怪的是，Chrome加载图像表单缓存耗费了太多时间，甚至比从本地服务器下载花费的时间还要多。

每张照片的大小约为5Mb，Chome卸载它的时间约为200毫秒，但从缓存中的开销约为400毫秒。

以下是屏幕截图：

我的环境是Mac OSX 10.8.4，我已经在PC上对其进行了测试-耗时约700毫秒。

这是对jsfiddle的测试。

我在网络上找不到如此大的图像，因此您可能需要fiddle2或Charies才能将这些图像映射到您自己的本地图像。并重写标头以使Chrome对其进行缓存：

Expires:Wed, 17 Jul 2013 01:50:08 GMT
Cache-Control:max-age=604800
Connection:keep-alive
Date:Wed, 10 Jul 2013 07:33:51 GMT
Last-Modified:Wed, 10 Jul 2013 01:13:26 GMT

Answer 1

不是很有用，但我解决这个问题的方法是将图像编码为数据 URI。复制图像（正如我所做的那样）或从缓存中提取图像大约需要 10-50 毫秒。

如果您通过 AJAX 加载图像，则必须注意 CORS 问题，但如果您在服务器端加载它们，您只需要弄清楚是否可以内联它们，而不会使页面加载太耗时长的。