我获取了约100张图像并存储为斑点。
这是示例代码。
let response = await axios.get(t.url, {
responseType: 'arraybuffer'
});
const binaryContent = response.data;
const blob = new Blob([binaryContent], {
type: "image/png"
})
imageList[ts] = URL.createObjectURL(blob);
当用户滚动时,我会将图像元素src替换为相应的blob。
我在桌面版Chrome和iOS Safari上进行了测试。
但是在Android Chrome上,获取时间约为900毫秒,并且图像替换的速度确实很慢。
99%的提取时间被暂停。
我该如何解决?
当我将objectURL更改为dataURL时,延迟时间消失了。
imageList[ts] = await blobToDataURL(blob);
async function blobToDataURL(blob) {
return new Promise((res, rej) => {
var reader = new FileReader();
reader.onload = (function () {
return function (e) {
res(e.target.result);
};
})();
reader.readAsDataURL(blob);
})
}