javascript - 预加载大量图像

标签 javascript jquery image canvas preloading

我正在尝试使用以下链接上实现的逻辑并行预加载图像。

http://blog.lieldulev.com/2010/05/21/parallel-image-preloading-in-js/

我有大量图片,目前有 350 多张图片,每张平均文件大小为 50KB,总计我试图预加载的图片总计 20MB。我需要用于 Canvas 绘图的图像。

使用上述并行下载逻辑,我遇到浏览器等待 2 分钟才能完成整个页面加载的问题。有时,它会停止脚本。

顺便说一句,20MB 的图像是目前保守的图像数量。我需要将一些图像预加载到 80MB!

预加载如此多的图片是否可行?如果我需要预加载,什么是满足我要求的最佳方法?我应该做非平行的吗?部分预加载怎么样?

提前谢谢你 马尔夫

最佳答案

这是 MXHR(多部分 XHR)请求的完美用例。这意味着,服务器脚本正在读取您的图像文件,将它们解码为 base64 字符串并将这些图像流式传输到浏览器。 supplyJS help 正在使用这种技术,但目前仅适用于 javascript 和样式表文件。无论如何,它的设计非常模块化,为您需要的任何图像类型扩展它的功能应该没有问题。

如果你不想自己做,别担心 - 我会在接下来的几天更新图像加载脚本。

关于javascript - 预加载大量图像,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/4792568/

相关文章:

javascript - 单选按钮键盘陷阱

javascript - 在 jQuery 语句之外访问 javascript 变量

.net - Docker中的.Net核心+ React + PostgreSQL

css - 使用 Bootstrap 我想在较小的设备上将图像缩放到最小高度

javascript - 如何在javascript中获取开关切换状态(真/假)

php - 如何使用 PHP 直接显示图像?

javascript - 不要使用 util.inspect 记录符号

javascript - 无类型语言中是否存在模式匹配之类的东西

javascript - $(...).datepicker 不是函数

javascript - jquery中switch和if中为什么推荐使用else if