Javascript Image Preloader 内存泄漏

Question

我有一个JS函数来预加载一组图像，然后将其存储在数组中，并最终在触发时绘制到画布上。我在iPad和旧款iPhone上的内存大小方面遇到了一些问题。因此，一旦加载了一定数量的图像，应用程序就会磨到霍尔特。从而使我认为问题出在预加载器上。

如果有人能够对此有所了解或指出我的任何方向，我将不胜感激。

canvas.preload = function(images){
  var
  d = $.Deferred(),
  // Empty Array
  a = [];
  // For each image in batch
  _.each(images, function( val, i) {
    var img = new Image();
    img.onload = function(){
      // Push Image and index into array
      a.push({image:this, index:i});
      // Sort this array by the index
      var sortedArray = _.sortBy(a, 'index');
      // When total batch is loaded return it
      if (a.length === images.length) {
        // Pluck just image from array
        d.resolve(_.pluck(sortedArray, 'image'));
      }
    }
    img.src = images[i];
  });
  return d;
} // preload();

Answer 1

这里的问题是由于移动设备设置的内存限制。

您的图像对他们来说可能太大了。对于大来说，它可以是维度明智的，也可以是咬合的。问题是他们不会以任何方式提醒你：他们只是从不下载它们。

在这些情况下，最佳方法始终是根据设备提供不同的资产。例如，如果客户端使用的是移动设备，请尝试下载较小版本的图像。