I don't quite understand what the window.devicePixelRatio value is, and how it dictates what size image (2x, 3x, etc) I need for that device.
For instance, on an iMac 5K Retina (Late 2015), I'd expect the pixel ratio to be at least 3 or so, but it's actually 2, the same as an iPad Air and iPhone 6s. Does that mean it prefers a 2x bitmap? 3x?
devicePixelRatio是给定设备上的物理像素和与设备无关的像素 (dip)之间的比率。您可以将下降视为显示“行为”的样子。
例如：非视网膜 27" iMac 的宽度为 2560 物理像素。所有内容都以 1:1 显示，因此它也是 2560 dips 宽，所以devicePixelRatio是1.
在您的视网膜 27" iMac 上，宽度为 5120 物理像素。但显示器“表现”就像它只有 2560 像素宽一样，因此所有内容都以与非视网膜 iMac 相同的物理尺寸显示。因此，它仍然是 2560 下降宽，所以devicePixelRatio是2（5120 / 2560），您将提供 2x 图像。
（您可以查看系统的倾角值 - 如果您有视网膜显示器 - 通过转到系统偏好设置>显示>显示并将分辨率切换到缩放，然后将鼠标悬停在不同的选项上。对于默认值，在5K iMac，它会说“看起来像 2560 x 1440”）。
迄今为止，用于 Retina 显示器的图形的标准做法仍然是提供两倍于通常非 Retina 尺寸的图像。
提醒：提供与当前用户设备大小和分辨率所需的图像一样大的图像是一种很好的“带宽卫生”。对此的解决方案超出了这个问题的范围。