在磁盘上引用图像时Cordova短暂（500ms？）延迟

Question

在这种情况下，我使用持久存储。我注意到图像（即使是非常低分辨率的图像，如40 KB和300x300px）也具有强制性＆＃34;加载延迟约500ms。当然，作为Javascript，我可以预先加载我将要使用的所有图像，但这会消耗内存使用量。我也可以在加载新页面之前预加载图像，但这有点麻烦。我不确定是否有一些技巧可以消除或减少这种延迟。

我正在使用Cordova / Crosswalk（crosswalk-cordova 10.39.235.13-arm），它运行Chrome 39.0.2171.71。

是否有任何想法让这更快和/或尽可能快？

Answer 1

您是否拥有图像的文件路径，或者每次都需要使用文件系统访问它？

每次我想加载文件系统时，我都会遇到类似的问题。但是，保留每个图像的字典（给它一个id）和文件系统上的完整url，并且每次从字典而不是文件系统获取url，使得加载速度明显加快。

如果这对您来说仍然太慢，那么您还有其他两个选项可供选择，您的选择应取决于您的应用业务：

1. 显示占位符图像，直到加载实际图像。

2. 延迟显示整个屏幕的图像为500毫秒。与丢失的图像相比，延迟对用户来说不那么烦人。

Answer 2

我猜你会遇到浏览器回流问题，引用一个新的未知图像意味着浏览器必须重新计算许多元素的位置。

直接关闭，您可以考虑将height =和width =属性添加到IMG标记中。另外，看看：

https://developers.google.com/speed/articles/reflow

http://andmag.se/2012/10/responsive-images-how-to-prevent-reflow/