Log in Sign up

WebP images?

They seem to be working but wanted to confirm support for WebP images?


6 months ago, 3 replies   Edit question

I haven't done anything explicit to support them but they should load and work correctly if your readers use a modern browser. I don't believe Blot's thumbnail generator or image caching will work with them, though.

I will add webp support to these features eventually, would you like me to email you when it's done? If so, contact us and we'll add you to the list

Answered 2 years ago · Edit answer

That's okay, I'll keep an eye out for it. :)

Thanks for the reply!

Answered 2 years ago · Edit answer

I switched all my images to WebP recently, it renders fine on my 1.5 year old Mac OS and all the up to date Apple devices (to my surprise because of the Google origin of the standard).

For example this page has two webp images: https://lev.lc/now

This said, I don't use Blot's CDN and I may be writing a script to make sure that WebP images loads, and replacing .webp to .png on error, perhaps someone knows a better way to implement that

function supportsWebP(callback) {
    var img = new Image();
    img.onload = function() {
        callback(true);
    };
    img.onerror = function() {
        callback(false);
    };
    img.src = 'data:image/webp;base64,UklGRiIAAABXRUJQVlA4IBYAAAAwAQCdASoBAAEAAkA';
}

supportsWebP(function(supported) {
    if (!supported) {
        // Replace .webp with .png for all images
        var images = document.querySelectorAll('img');
        images.forEach(function(image) {
            var src = image.src;
            if (src.toLowerCase().endsWith('.webp')) {
                image.src = src.replace(/\.webp$/i, '.png');
            }
        });
    }
});
Answered 6 months ago · Edit answer