window.devicePixelRatioの値が何であるか、そのデバイスに必要なサイズ（2x、3x、など）のサイズがどのように決定されるのかよくわかりません。Retina - デバイスのピクセル比率とイメージのサイズの相関は？
たとえば、iMac 5K Retina（2015年後半）では、ピクセル比率は少なくとも3程度かと思っていますが、実際にはiPad AirやiPhone 6sと同じ2です。 2倍のビットマップが好きですか？ 3倍？
devicePixelRatioは、特定のデバイス上の物理的画素とデバイス非依存画素（ディップ）との比です。あなたはディップをディスプレイが "行動する"ものと考えることができます。例えば
：非網膜27" のiMacは、すべてが1表示されている2560個の物理ピクセルの幅を持っています。1を、それも2560のディップ広いですので、devicePixelRatioは1ある27あなたの網膜に
。 "iMac、幅は5120物理ピクセルです。しかし、このディスプレイは2560ピクセル幅のように機能し、すべてが非網膜のiMacと同じ物理サイズで表示されます。したがって、それでも幅は2560ディップであるため、devicePixelRatioは2（5120/2560）で、2倍の画像を表示します。
（システム環境設定>ディスプレイ>ディスプレイに移動し、解像度トグルをスケーリングに切り替え、さまざまなオプションにカーソルを移動して、網膜ディスプレイがある場合は、システムのディップ値を調べることができます。デフォルトでは、5K iMacでは「2560 x 1440のように見える」と表示されます）。
これまで、Retinaディスプレイ向けのグラフィックスの標準的なプラクティスは、従来の2倍のRetinaサイズの画像を提供しています。
注意：現在のユーザーのデバイスサイズと解像度に必要な大きさのイメージのみを提供するのは、「帯域幅の衛生管理」に適しています。その解決策はこの質問の範囲外です。