Potrei sbagliarmi, ma penso che abbia senso.
Se guardi l’srcset HTML, le seguenti immagini vengono servite in base al rapporto pixel del dispositivo (x1, x1,5, x2).
https://...2f50d4ad9f5f865b783b02d392de75bdceec01da_2_690x460.jpeg,
https://...2f50d4ad9f5f865b783b02d392de75bdceec01da_2_1035x690.jpeg 1.5x,
https://...2f50d4ad9f5f865b783b02d392de75bdceec01da_2_1380x920.jpeg 2x
Di solito, i dispositivi mobili hanno un rapporto x2 (o superiore) perché hanno una densità di pixel più elevata.
Quindi, vorresti servire immagini con una risoluzione più alta.
Device Pixel Ratio
Il Device Pixel Ratio (DPR) è un numero fornito dai produttori di dispositivi e viene utilizzato per i display HiDPI (High Dots Per Inch) o Retina (marchio registrato di Apple), che fanno parte degli smartphone moderni, tablet e persino alcuni laptop e monitor.
Il DPR è in correlazione diretta con la densità di pixel del display, maggiore è la densità, maggiore è il valore del DPR.Il DPR è il rapporto tra i pixel fisici (del dispositivo) e i pixel logici (CSS) in direzione orizzontale (larghezza) o verticale (altezza) di uno schermo.
In altre parole, il DPR è un numero utilizzato per calcolare la risoluzione CSS dello schermo. Dal DPR possiamo vedere direttamente quanti pixel hardware effettivi compongono un pixel CSS.Esempio:
Apple iPhone 12
Risoluzione in pixel del dispositivo (fisici): 1170 x 2532
DPR: 3
Larghezza: 1170/3 = 390, Altezza: 2532/3 = 844
Pertanto, risoluzione in pixel CSS: 390 x 844Poiché il DPR è 3, nella griglia di pixel: 3 (larghezza) x 3 (altezza) = 9; 9 pixel fisici vengono utilizzati per formare un pixel CSS.