For the best performance, you should always upload your images at scale if possible. For example, if you have an image that you want to display at 200 px wide, don’t upload an image that is 400 px wide and then scale it with HTML. A better way to accomplish this is to use the srcset
attribute in the <img>
tag which allows you to define possible resolutions that the browser can choose from. Here an example:
<img srcset="/img/keycdn-300.jpg 300w,
/img/keycdn-600.jpg 600w,
/img/keycdn-1200.jpg 1200w"
src="/img/keycdn-600.jpg" alt="KeyCDN">
Most modern web browsers support srcset, except IE and opera mini.