在动态网站中快速加载图像

Question

所以我一直在一个动态网站上工作，在某个页面上有大约200多个图像，目前，该网站提取我的服务器的信息并逐个查询。这导致网站在15秒内加载。我想知道我是否可以将图像并行加载或预加载，或者以任何方式让我更快地完成此过程

非常感谢， 的Vivek

Answer 1

从--this--文章第6点谈到，从服务器加载图片并不是最佳做法。该文章还有许多其他好的技巧，例如以人眼无法察觉的方式降低图像质量，以提高加载速度。无论如何，当从各种URL访问图像时，您不会遇到此问题。它非常简单，因为您可以直接从HTML加载图像。这是一个代码示例：

var myImage = $("<img />").attr('src', 'https://myimageurl.net/myimage.jpg')
    .on('load', function() {
        if (!this.complete || this.naturalWidth == 0 || typeof 
this.naturalWidth == "undefined") {
            //error code
        } else {
            $("#thingToBeAppended").append(myImage);
        }
});

但是，如果您在服务器上加载图像时已经死定，一种解决方案可能是使用异步技术，例如jQuery.ajax()。然后你的图像或多或少会同时加载。