JavaScript Image 对象如何与浏览器缓存交互？
我使用简单的对象来包装 Image 对象并跟踪它们的加载时间，如下所示：
var preloader = {
loaded: false,
image: new Image()
}
preloader.image.onload = function() {
preloader.loaded = true;
}
preloader.image.src = 'http://www.example.com/image.jpg';
当图像加载完成时，preloader.loaded 设置为 true。一切都很好。
我的问题是，当我有这么多的对象和图像以至于浏览器缓存耗尽时会发生什么。最终，一旦加载了足够的图像，浏览器就会开始从缓存中转储旧图像。在这种情况下，我最终不会得到 Loaded=true 的 JavaScript 对象，但图像文件实际上不再被缓存吗？
这很难测试，因为我无法在任何给定点判断哪些图像仍在缓存中，哪些不在缓存中。
I'm using simple objects to wrap Image objects and track when they are loaded, like so:
var preloader = {
loaded: false,
image: new Image()
}
preloader.image.onload = function() {
preloader.loaded = true;
}
preloader.image.src = 'http://www.example.com/image.jpg';
When the image is finished loading, preloader.loaded is set to true. That all works fine.
My question is, what happens when I have so many of these objects and so many images that the browser cache is used up. Eventually once enough images are loaded, the browser will start to dump older ones out of the cache. In that case won't I end up with JavaScript objects where loaded=true, but the image file is not actually cached anymore?
This is hard to test, because I can't tell at any given point which images are still in the cache and which aren't.
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（2）
从网页加载图像后，就不会从缓存中使用该图像。实际上，在浏览器页面生命周期内，或者直到您删除此 JS 对象以便可以对其进行垃圾收集之前，它实际上都位于浏览器页面内存中。
缓存不用于存储页面上加载的图像。使用缓存是为了下次请求加载该图像时可以更快地加载它。如果您加载的图像太多以至于超出了缓存的存储空间，那么您已经加载的图像将不会发生任何变化，因为它们在页面持续时间内位于浏览器内存中（独立于缓存）。将会发生的情况是，您加载的某些图像将不再位于缓存中，因此下次某些浏览器页面想要加载它们时，它们将不再位于缓存中，而必须从其原始网站中获取通过互联网。
Once you've loaded the image from a web page, it's not being used from the cache. It's actually in the browser page memory for the duration of the browser page lifetime or until you get rid of this JS object so it can be garbage collected.
The cache is not used for storage of loaded images on a page. The cache is used so that the next time a load of this image is requested, it can be loaded much faster. If you load so many images that it exceeds the storage of the cache, nothing will happen to the images you have already loaded as they are in browser memory for the duration of the page (independent of the cache). What will happen is that some of the images you loaded will no longer be in the cache so the next time some browser pages wants to load them, they won't be in the cache and will have to be fetched from their original web-site over the internet.
昨天我删除了过去几个月建立的 800MB 互联网缓存。简而言之，我认为除非用户拥有一台非常旧的机器，或者您预加载了太多图像，否则不可能耗尽浏览器缓存。
Yesterday I deleted 800MB of internet cache that had built up over the past few months. In short, I don't think it's possible to exhaust the browser cache unless the user has a really old machine, or you're preloading WAY too many images.