get blob在Android Chrome上停滞了900ms

时间:2018-09-20 04:56:50

标签: google-chrome android-chrome

我获取了约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);
    })
}

0 个答案:

没有答案