Bug 185833 - Add APNG as a supported MIME type
Summary: Add APNG as a supported MIME type
Status: RESOLVED INVALID
Alias: None
Product: WebKit
Classification: Unclassified
Component: Images (show other bugs)
Version: WebKit Nightly Build
Hardware: Unspecified Unspecified
: P2 Normal
Assignee: Nobody
URL:
Keywords: InRadar
Depends on:
Blocks:
 
Reported: 2018-05-21 13:18 PDT by Yoav Weiss
Modified: 2018-05-25 17:23 PDT (History)
10 users (show)

See Also:


Attachments
Patch (5.79 KB, patch)
2018-05-21 13:27 PDT, Yoav Weiss
no flags Details | Formatted Diff | Diff
Archive of layout-test-results from ews113 for mac-sierra (562.43 KB, application/zip)
2018-05-21 14:23 PDT, EWS Watchlist
no flags Details
Patch (5.51 KB, patch)
2018-05-25 00:50 PDT, Yoav Weiss
no flags Details | Formatted Diff | Diff

Note You need to log in before you can comment on or make changes to this bug.
Description Yoav Weiss 2018-05-21 13:18:32 PDT
Add APNG as a supported MIME type
Comment 1 Yoav Weiss 2018-05-21 13:27:40 PDT
Created attachment 340878 [details]
Patch
Comment 2 EWS Watchlist 2018-05-21 14:23:35 PDT
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.
Comment 3 EWS Watchlist 2018-05-21 14:23:36 PDT
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
Comment 4 Alexey Proskuryakov 2018-05-22 19:16:53 PDT
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.
Comment 5 Yoav Weiss 2018-05-25 00:35:13 PDT
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?
Comment 6 Yoav Weiss 2018-05-25 00:50:13 PDT
Created attachment 341257 [details]
Patch
Comment 7 Yoav Weiss 2018-05-25 00:51:45 PDT
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.
Comment 8 Radar WebKit Bug Importer 2018-05-25 08:49:24 PDT
<rdar://problem/40555415>
Comment 9 Said Abou-Hallawa 2018-05-25 10:12:49 PDT
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.
Comment 10 youenn fablet 2018-05-25 10:27:46 PDT
Is there a spec defining the image/apng mime type?
Comment 11 Yoav Weiss 2018-05-25 10:44:09 PDT
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
Comment 12 Yoav Weiss 2018-05-25 10:47:41 PDT
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)
Comment 13 youenn fablet 2018-05-25 11:10:09 PDT
(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".
Comment 14 Said Abou-Hallawa 2018-05-25 11:17:59 PDT
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.
Comment 15 Patrick Kettner 2018-05-25 15:50:50 PDT
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.
Comment 16 youenn fablet 2018-05-25 16:32:45 PDT
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?
Comment 17 Michael Catanzaro 2018-05-25 16:36:48 PDT
(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.
Comment 18 Patrick Kettner 2018-05-25 17:23:51 PDT
> 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