Status Update
No update yet.
Comments
ka...@chromium.org
[Empty comment from Monorail migration]
di...@gmail.com
Apologies for the missed tduplicate. The comment there to create a qeue makes a lot of sense, I'll totally do that.
I suppose like 20 300x300 images at a time per frame would fine to not trigger the limitation?
I suppose like 20 300x300 images at a time per frame would fine to not trigger the limitation?
fs...@opera.com
AFAIU the limit depends on the cache size, so what/how many images can be decoded can't easily be stated as 'N per frame'. The current (cache) limits are 256 (HW, or 1000 SW) images or 256M memory used (can be lower depending on device). 20 300x300 would be ~7M I think so it ought to be fine most of the time (as long as nothing happens to tie up resources such that the limits are hit - I think that's fairly unlikely though).
is...@google.com
This issue was migrated from crbug.com/chromium/1250975?no_tracker_redirect=1
[Auto-CCs applied]
[Monorail mergedinto:crbug.com/chromium/1055828 ]
[Monorail components added to Component Tags custom field.]
[Auto-CCs applied]
[Monorail mergedinto:
[Monorail components added to Component Tags custom field.]
jo...@gmail.com
This bug also appears when decode()-ing i.e. 10x 6000x4000 pixels .jpg with 100% reproducibility.
Safari and Firefox handles such media without throwing any error.
The workaround is to use img.onload instead of img.decode() or combined:
img.onload = callback;
img.decode().then(callback).catch(()=>{});
Description
Steps to reproduce the problem:
// For example, there are like a thousand of small images, about 300x300px each
const imageURLs = ['img1.jpg', 'img2.jpg', ...];
// sometimes user requests some set of them, for example first 70 images,
// so we load and append them:
for(let i = 0; i < 70; i++) {
let img = new Image();
img.src = imageURLs[i];
img.decode().then(() => {
// append image to dom
}).catch((error) => {
// handle error
});
}
Occasionally, the error appears "DOMException: The source image cannot be decoded.", generally for multiple images at a time. Even though the images are loaded properly (according to the Network tab). And `img.complete` property is also `true`.
I didn't manage to reproduce it in FF or Safari.
This also seem to happen if image is removed and then decode() is used again, for example:
let img = new Image();
img.src = 'img.jpg';
// Add to dom after decode
img.decode().then(() => {
container.appendChild(img);
}).catch((error) => {
});
// Remove some time later
setTimeout(() => {
img.remove();
}, 5000); // 5 seconds
setTimeout(() => {
// Add to dom again after the second decode()
img.decode().then(() => {
container.appendChild(img);
}).catch((error) => {
// "DOMException: The source image cannot be decoded." triggers here again
});
}, 10000); // 10 seconds
As with the previous case, this happens occasionally, and only when a large number of images are loaded.
What is the expected behavior?
What went wrong?
-
Did this work before? N/A
Does this work in other browsers? N/A
Chrome version: 93.0.4577.82 Channel: stable
OS Version: