Browser-local limits
Canvas-based export is browser dependent. PNG is broadly available; JPEG/WebP quality and support can vary, and metadata may not be preserved through canvas re-encoding.
Device pixels and CSS pixels answer different questions
A high-density image is often prepared with more physical pixels than the CSS size at which it is displayed. A 2× asset, for example, can use roughly twice the width and height in image pixels while occupying the same CSS dimensions, giving the browser more source detail on a high-DPI screen.
Use responsive images instead of assuming one DPR
Real devices have many device-pixel ratios, zoom levels, viewport sizes, and bandwidth conditions. Use the calculated dimensions as an asset-planning reference, then provide appropriate srcset/sizes or other responsive-image hints when multiple resolutions are available. More pixels do not automatically improve perceived quality if the source is soft, and oversized assets can waste download bytes and memory.