Using WebP to Improve Website Speed
Tuesday, May 7, 2019
ImageEngine will automatically convert images to WebP when serving to Chrome, Firefox, Edge, and Opera. This saves 80% of image payload and makes website speed faster.
What is WebP?
WebP is a modern image format that Google has developed. It provides superior lossless and lossy compression for images. According to Google, compared to JPEG, WebP generates 25-34% smaller file size. Compared to PNG, lossless images are 26% smaller on WebP.
Also, WebP has several helpful features. Like PNG, WebP supports transparency. And like GIF, WebP supports animations. WebP provides both of these features while maintaining efficient file size. Currently, WebP is natively supported in Google Chrome, Firefox, Edge, and Opera browsers.
How Much Will WebP reduce image payload?
WebP, when combined with ImageEngine’s device-aware edge technology, automatic resizing, and quality control, reduces image payload by an average of 82%
ImageEngine delivers billions of image requests per month, and WebP is the most common final image format. When converting from JPEG to WebP, the savings is 80% smaller. And with PNG to WebP, the savings is 90% smaller
You will note that this performance is over 2X better than the 25-30% that Google cites above. This is because ImageEngine does much more than just use WebP’s efficient compression. ImageEngine also tailors the image for each device model and its specification. In addition to support for WebP, ImageEngine resizes an image to the screen size of the device’s screen resolution and Pixels Per Inch (PPI). ImageEngine also adjusts compression to a threshold that saves image size, but has no impact on perceptible quality for the device and its screen.
What Image Formats Does ImageEngine Convert to WebP?
ImageEngine takes a website’s original master images and automatically changes them to the most efficient image format supported by that browser and operating system (OS). To generate optimal image payload savings, ImageEngine will take JPEG and PNG images and convert them to WebP. ImageEngine’s device-aware edge servers use ScientiaMobile’s WURFL device detection evaluate HTTP request headers and determine device,OS, and browser characteristics. If the device, OS, and browser combination supports WebP, ImageEngine will convert the JPEG or PNG to an optimal WebP image. This means that most images sent to Google Chrome Firefox, Edge, and Opera will be converted to WebP format.
In addition to JPEG and PNG, ImageEngine will also convert GIFs to animated WebP. Animated WebP is supported starting with Chrome version 32 and Opera 19. Converting GIF to WebP saves more than 50% of the image payload.
What about iPhones and iOS? Even though Chrome does exist on iPhones, Apple does not support WebP. Instead, ImageEngine opts to use JP2, also known as JPEG 2000. You can read more about JPEG 2000 here.