Because devicePixelRatio is not relyable enough

real-device-px-ratio.js

const resolutions = [
    'data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACwAAAAAAQABAAACAkQBADs=',
    'data:image/gif;base64,R0lGODlhAQABAAAAACwAAAAAAQABAAA=',
    'data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==',
    'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAAAAAA6fptVAAAACklEQVQYV2P4DwABAQEAWk1v8QAAAABJRU5ErkJggg==',
];
const img = document.createElement('img');
img.src = resolutions[0];
img.srcset = resolutions.map((itm, i) => `${itm} ${i + 1}x`).join(',');

export default function imageDpiResolution() {
    return resolutions.indexOf(img.currentSrc || img.src) + 1;
}