Add WebP support to Orion on macOS Catalina/Mojave

webpsupporter Thanks. Note there is Flag as Duplicate option under Reply menu, that you can use to do this in the future

The odd thing is that AVIV image support works in 0.99.123 in Catalina and doesn't seem to rely on OS level support (AVIV doesn't work in regular Safari in Catalina). But the same is not true for webp.

onerob It's explained here https://avif.io/blog/tutorials/safari/#whyappletakessolong

Thanks for the link. That explains the fact of Safari having to wait on OS updates in order to support newer image formats but still leaves me puzzled as to why I can see AVIF images in Orion in Catalina. Does Orion use WebkitGTK as opposed to plain Webkit?

Additionally, the reply to this Stack Overflow question is interesting. It's possible to compile webkitGTK with a webp library.

https://stackoverflow.com/questions/71238404/webkitgtk-build-webp-libraries-were-not-found-when-i-have-installed-the-webp-l

onerob This post is about WebP support, please keep it on topic.

AFAIK WebKit uses system AVIF support, not built in one, and since macOS does not support AVIF for 10.x, that is why it does not work.

onerob Those are different things. However you can ask the question on WebKit.org, specific to WebP support in Mojave and share an answer here.

Alright, I found a solution onerob . It is far from ideal, but it does work.

It relies on custom script execution. According to Vlad this is meant to be implemented natively soon. Keep in mind this will decode every webp image on the client side.

Here the steps:

1. Install https://addons.mozilla.org/en-US/android/addon/codeinjector/ in normal firefox
2. Inside the add-on, create a new rule. Use whatever URL, it doesn't matter. As of today, the add-on is unable to detect the current loaded site in Orion.
3. While creating the rule, go to Files. Add the following two paths and save:

https://unpkg.com/webp-hero@0.0.2/dist-cjs/polyfills.js
https://unpkg.com/webp-hero@0.0.2/dist-cjs/webp-hero.bundle.js

4. Open the add-on options. Export the rule. This will save a .json file.

5. Install the extension in Orion and import the same file.

6. Restart Orion

7. Open any website that loads webp images. Click on the extension, select the dropdown menu besides your rule and click "inject"

8. Nothing will happen! You still need to apply the injection. Open the console (F12) and execute the following:

   var webpMachine = new webpHero.WebpMachine()
   webpMachine.polyfillDocument()

9. Webp images will start loading. Done.

Keep in mind that you will need to 1) inject the rule on every new tab and 2) execute the console commands every time new webp elements are loaded. The images will be decoded one at a time. I don't have enough time to find out how to make it work automatically. It should be possible, but extensions support is still very buggy. If you find a way, let me know.

Vlad This should not be considered a solution for the reasons stated above. I would keep this open until something more elegant is found. WebKit has support for webp since 2013 (see https://bugs.webkit.org/show_bug.cgi?id=47512) so this might actually be activated through some compilation flag?

Thanks for the code injection tip, webpsupporter. I think it's a bit too involved to be a realistic workaround, as I can always open the page in Firefox if I want to see the webp images.

As for compilation flags etc.., see the Stack Overflow link above. It contains further links to two libraries needed to enable webp in WebKit (or at least WebKitGTK). These are featured in Ubuntu packages and I don't know if they're capable of working on Mac.

Great job @webpsupporter

I am inviting you to post a bug report on webkit.org with your findings to get this moving.

https://webkit.org/reporting-bugs/

Our team is too small to be patching this on our end (and we have 1,700+ open issues on this site).

Hi, just a little update.

I am trying to compile WebKit myself with a series of changes. Will see where this leads.

Regarding @onerob curious finding, this PR might explain why you can decode AVIF in Catalina, but I haven't looked further into it. Maybe Vlad can make sense of it.

webpsupporter

Interesting. That would seem to explain it. Further down the thread we had this comment: "Looking forward to deleting this in two years ", which implies that it's a temporary solution. Still, better than nothing.

I don't think they'd do this for webp as Catalina no longer receives Safari updates (except for security issues) so it would not be seen as something that's needed. Unfortunately.