Most apps nowadays enhance user experience with the use of images, and one of the issues I've noticed with that is the amount of time it takes to load an image. (Not everyone has the luxury of a fast connection)
Google's WebP image format offers better compression compared to PNG or JPEG, allowing apps to send/retrieve images with smaller file sizes, reducing request times and hopefully provide a better user experience.
pod 'iOS-WebP', '0.5'
Don't forget to #import <iOS-WebP/UIImage+WebP.h>
.
There are 3 methods in iOS-WebP
, converting images to WebP format, converting images from WebP format, and setting an image's transparency.
+ (void)imageToWebP:(UIImage *)image quality:(CGFloat)quality alpha:(CGFloat)alpha preset:(WebPPreset)preset
completionBlock:(void (^)(NSData *result))completionBlock
failureBlock:(void (^)(NSError *error))failureBlock;
+ (void)imageWithWebP:(NSString *)filePath
completionBlock:(void (^)(UIImage *result))completionBlock
failureBlock:(void (^)(NSError *error))failureBlock;
- (UIImage *)imageByApplyingAlpha:(CGFloat)alpha;
Encoding and decoding of images are done in the background thread and results returned in the completion block on the main thread so as not to lock the main thread, allowing the UI to be updated as needed.
// quality value is [0, 100]
// alpha value is [0, 1]
[UIImage imageToWebP:[UIImage imageNamed:@"demo.jpg"] quality:quality alpha:alpha preset:WEBP_PRESET_DEFAULT completionBlock:^(NSData *result) {
NSArray *paths = NSSearchPathForDirectoriesInDomains(NSDocumentDirectory, NSUserDomainMask, YES);
NSString *webPPath = [paths[0] stringByAppendingPathComponent:@"image.webp"];
if (![result writeToFile:webPPath atomically:YES]) {
NSLog(@"Failed to save file");
}
} failureBlock:^(NSError *error) {
NSLog(@"%@", error.localizedDescription);
}];
WEBP_PRESET_DEFAULT
(default preset)WEBP_PRESET_PICTURE
(digital picture, like portrait, inner shot)WEBP_PRESET_PHOTO
(outdoor photograph, with natural lighting)WEBP_PRESET_DRAWING
(hand or line drawing, with high-contrast details)WEBP_PRESET_ICON
(small-sized colorful images)WEBP_PRESET_TEXT
(text-like)
If you need to fine tune the performance of the encoding algorithm you can specify overrides to the preset in a config block.
// quality value is [0, 100]
// alpha value is [0, 1]
[UIImage imageToWebP:[UIImage imageNamed:@"demo.jpg"] quality:quality alpha:alpha
preset:WEBP_PRESET_DEFAULT
configBlock:^(WebPConfig *config) {
config->sns_strength = 50.0f;
config->filter_strength = 0.0f;
config->method = 2;
config->preprocessing = 0;
config->filter_sharpness = 0;
config->thread_level = 1;
}
completionBlock:^(NSData *result) {
NSArray *paths = NSSearchPathForDirectoriesInDomains(NSDocumentDirectory, NSUserDomainMask, YES);
NSString *webPPath = [paths[0] stringByAppendingPathComponent:@"image.webp"];
if (![result writeToFile:webPPath atomically:YES]) {
NSLog(@"Failed to save file");
}
} failureBlock:^(NSError *error) {
NSLog(@"%@", error.localizedDescription);
}];
All possible config values can be found in encode.h in the WebPConfig stuct.
[UIImage imageWithWebP:@"/path/to/file" completionBlock:^(UIImage *result) {
UIImageView *myImageView = [[UIImageView alloc] initWithImage:result];
}failureBlock:^(NSError *error) {
NSLog(@"%@", error.localizedDescription);
}];
//alpha value is [0, 1]
UIImage *transparencyImage = [[UIImage imageNamed:image.jpg] imageByApplyingAlpha:0.5];
- Based off WebP-iOS-example by Carson McDonald
imageByApplyingAlpha:alpha
function contributed by Dmitry ShmidtWebPConfig
block contributed by Kasper Weibel Nielsen-Refs and Eugene Scherbafree_image_data
crash fix contributed by Brandon Schlenker and zblackmore- Memory leak and color changing fix contributed by Sagar Dagdu
pod libwebp
dependency and demo project changes contributed by Emil