Bug 185833 – Add APNG as a supported MIME type

• Component: Images
• Status: RESOLVED INVALID

[Yoav Weiss]

Add APNG as a supported MIME type

[Yoav Weiss]

Created attachment 340878 [details]
Patch

[EWS Watchlist]

Comment on attachment 340878 [details]
Patch

Attachment 340878 [details] did not pass mac-debug-ews (mac):
Output: http://webkit-queues.webkit.org/results/7756388

Number of test failures exceeded the failure limit.

[EWS Watchlist]

Created attachment 340891 [details]
Archive of layout-test-results from ews113 for mac-sierra

The attached test failures were seen while running run-webkit-tests on the mac-debug-ews.
Bot: ews113  Port: mac-sierra  Platform: Mac OS X 10.12.6

[Alexey Proskuryakov]

Comment on attachment 340878 [details]
Patch

r- since this causes assertions on tests. I don't have an opinion on whether we should do this or not.

[Yoav Weiss]

It seems like this approach can't work without CGImageSourceCopyTypeIdentifiers also including apng in its supported types :/

What would be the best way to tackle this issue?

[Yoav Weiss]

Created attachment 341257 [details]
Patch

[Yoav Weiss]

OK, resolved it by not adding APNG to the generic image types, but instead add an exclusion for it to the function used in `<picture>`, similar to the way this is done for SVG.

[Radar WebKit Bug Importer]

<rdar://problem/40555415>

[Said Abou-Hallawa]

In WebKit we only support the mime types of the officially approved image file formats. You can find the list of the supported mime types in initializeSupportedImageMIMETypes() and the corresponding list of the supported UTIs in allowedImageUTIs() .

A file format extension does not require a new UTI or a new MIME type. For example the animated GIF is an extension to the GIF file format. It does have the same extension, the same UTI and the same mime type as the static GIF image.

According to https://en.wikipedia.org/wiki/APNG: "The PNG group officially rejected APNG as an official extension on April 20, 2007." But like other browsers do, WebKit considers the APNG an extension to the PNG file format.

WebKit is capable of displaying and animating an <img> or <picture> with an APNG source as long as you provide "image/png" as its mime type or do not provide it at all. For example, your test case will work without any source change if you change 

    type="image/apng" => type="image/png"

It will work also if you delete the type attribute. The mime type will be deduced from the file extension.

So I do not see any benefit from fixing this bug.

[youenn fablet]

Is there a spec defining the image/apng mime type?

[Yoav Weiss]

Animated PNGs are already supported by Safari: See https://upload.wikimedia.org/wikipedia/commons/1/14/Animated_PNG_example_bouncing_beach_ball.png

The spec I found was https://wiki.mozilla.org/APNG_Specification#MIME_type

[Yoav Weiss]

The benefits of adding such support is that it will help developers serve animated PNG images only to browsers that support them, while not serving them to browsers that don't (I believe Microsoft Edge is the last holdout in modern browsers)

[youenn fablet]

(In reply to Yoav Weiss from comment #11)
> Animated PNGs are already supported by Safari: See
> https://upload.wikimedia.org/wikipedia/commons/1/14/
> Animated_PNG_example_bouncing_beach_ball.png
> 
> The spec I found was https://wiki.mozilla.org/APNG_Specification#MIME_type

It seems to me it is the OS that should be responsible to tell WebKit whether a particular mime type like image/apng is supported or not. Ideally there should be some sort of RFC for it. Wikipedia is mentioning "image/vnd.mozilla.apng".

[Said Abou-Hallawa]

What is the difference between animated GIF and APNG?

In my opinion both of them are unofficial extensions to GIF and PNG. They both do not require new file extension, new mime types or new UTI. If the underlying OS  handles these extensions, the image will be animated. Otherwise the first frame will be the only one to be displayed.

[Patrick Kettner]

Patrick Kettner from the Edge team here. A bit of background - I actually caused yoav to write this patch, because I asked him wether or not it was possible for safari to load the animated PNG via the picture tag and still use fallbacks.

Essentially, a number of sites use images that involve motion. Most of the time this is still unfortunately gifs. I am working with CMSs and other providers to try to push folks off of this by moving to more modern syntax, like the picture tag so you get something like this

<picture>
  <source srcset="animation.webp" type="image/webp">
  <source srcset="animation.png" type="image/apng">
  <img src="animation.gif" > 
</picture>


That will load the smallest webp in chrome, the nearly as small apng file in firefox, and finally the extremely bloated gif for unsupported browsers.

Because safari lacks the ability to target the animated image, it will load the huge gif unnecessarily. There are of course workarounds via javascript to get it to work

in short, its not about wether or not a video is renderable on the os, it is intended to be a way to let users get the smallest and most efficient image format possible.

[youenn fablet]

Thanks Patrick, the motivation is clear.

If there is a plan for Edge to support apng, problem would disappear at some point. Relying on JS in the meantime would not sound too bad to me.

Patrick, Yoav, do you know how much the "type='image/apng'" markup is supported in other browsers?
Is there existing content using it already?

[Michael Catanzaro]

(In reply to youenn fablet from comment #13)
> It seems to me it is the OS that should be responsible to tell WebKit
> whether a particular mime type like image/apng is supported or not. Ideally
> there should be some sort of RFC for it.

WebKit has its own support for APNG in the cross-platform ImageDecoders, so I believe it's guaranteed to be supported on non-Apple ports. And it seems supported on Apple ports too.

[Patrick Kettner]

> Patrick, Yoav, do you know how much the "type='image/apng'" markup is supported in other browsers?

it is supported in Firefox and Chrome. Edge doesn't support it, though it would if and when it shipped support for apng. Since the main usecase (that I can think of) is in via picture, opera is a nonissue since it didn't ship support for that until well into their chromium builds. If there were any specific version questions, or more esoteric browsers, let me know and id be happy to find the answer