问题：

我有一个变量，该变量包含以下192个图像：

<script>
  var stimuli = '.json_encode($_SESSION['stimuli'],JSON_UnesCAPED_SLASHES | JSON_PRETTY_PRINT).';
</script>

每个项目的示例如下：

{
    "image": "assets/materials/4233.png","correct_response": "c","evaluationnumber": 3649,"type": "f","stimulustype": "F3aC","item": 4233
},

在我的JS文件中，我尝试使用以下方法预加载所有图像：

stimuli.forEach(({image}) => loadImage(image));

loadImage()如下：

const loadImage = (src) => new Promise((resolve,reject) => {
  const img = new Image();
  img.addEventListener("load",() => resolve(img));
  img.addEventListener("error",err => reject(err));
  img.src = src;
});

当我检查网络标签时，只有32张图片正在预加载，而不是192张。

问题

1. 预加载192张图像中的32张是什么原因？
2. 如何重写代码以确保预加载全部192张图像？