Support » Plugin: Jetpack - WP Security, Backup, Speed, & Growth » Site Accelerator CDN Image Resizing

  • Resolved localskim

    (@localskim)


    As I understand it, the Site Accelerator CDN will resize images to best fit the screen size that is being used to view the website. So that instead of serving a one sized image and having the browser resize the image, the CDN will resize the image and serve that resized image. That means that if the image is being viewed on a mobile phone, the image served will be smaller and therefore will load quicker. Is my understanding correct?

    The maximum width of an image allowed on my website is 564px. So if I resize my original uploaded images to 564px, that seems to make sense. However, wouldn’t that make images displayed on Retina Displays look bad? So should I resize my images to 1128px wide and then it will look good on Retina Displays but still load fast on mobile phones since the CDN will resize the image to a smaller size before serving it anyway? Is there a disadvantage to uploading images at twice the width that is required on a normal monitor?

    Thanks for any help or insight you can provide.

    The page I need help with: [log in to see the link]

Viewing 3 replies - 1 through 3 (of 3 total)
  • Plugin Support KokkieH

    (@kokkieh)

    Hi there,

    That means that if the image is being viewed on a mobile phone, the image served will be smaller and therefore will load quicker. Is my understanding correct?

    That is correct, yes. The moment you upload an image to a post or page, the CDN will make several copies of that image at different sizes that are cached to our CDN servers around the world. Then it serves the file at the size needed when someone loads your site in their browser.

    So should I resize my images to 1128px wide and then it will look good on Retina Displays but still load fast on mobile phones since the CDN will resize the image to a smaller size before serving it anyway?

    Correct again 🙂

    For best results on Retina screens we recommend doubling up the image dimensions. That way, if we detect your site is being viewed on such a screen, there is a bigger version that can be served. The CDN can make images smaller, but it can’t serve an image bigger than the full-size version you upload.

    Is there a disadvantage to uploading images at twice the width that is required on a normal monitor?

    An image at twice the width can have a file size that’s several times bigger than the one with smaller dimensions, so the only disadvantage here is that you’ll use up the storage space in your hosting plan faster. At 1128px width you should still be looking at only a few hundred kb per image, though, so in your case that shouldn’t make a massive difference.

    In terms of how the CDN works, there’s no disadvantage that I know of. With really big images that are several Mb big there can sometimes be timeouts when we try to upload the image to our cache, which can then lead to a blank image appearing on your site, but I’d be very surprised if something like that happened at the image sizes you’re speaking of here.

    Thread Starter localskim

    (@localskim)

    Thanks so much for your help. That makes it much clearer.

    One followup question. So does the image get uploaded to the CDN when I add an image to the Media Library or when I upload the image to a page or post?

    If it gets uploaded to the CDN when the image is added to the Media Library, does only the original image get uploaded or does it upload all of the wordpress generated sized images (e.g. medium – 300 x 300, medium_large – 768 x 9999, large – 1200 x 1200, etc.).

    Plugin Support supernovia

    (@supernovia)

    Good question! I believe the images are loaded into the CDN when someone visits a post or page that involves the image, but we’ll double check.

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Site Accelerator CDN Image Resizing’ is closed to new replies.