tools/ui: Add HEIC/HEIF image support#24137
Conversation
| "eslint-plugin-storybook": "10.2.4", | ||
| "eslint-plugin-svelte": "3.15.0", | ||
| "globals": "16.3.0", | ||
| "heic-to": "1.5.2", |
There was a problem hiding this comment.
IMO I'm not really a fan of adding a 3MB library to do such a simple task.
Can we simply draw it to a canvas then convert back to jpeg?
There was a problem hiding this comment.
Unfortunately the non Safari browsers don't support decoding the image, so some library is needed to convert. I'll do some shopping around to see if there is a more lightweight option.
There was a problem hiding this comment.
Most options are similar because they rely on the libheif WASM to do the decoding. I tried using https://github.com/saschazar21/webassembly/tree/master/packages/heif but this fails on many of the HEIC images I have. It seems like if this is a goal to support this image type a library will be required.
I found one other library option I am looking into that might work, but besides that it seems a way to improve this is to potentially try and lazy load the dependency only when it is needed
There was a problem hiding this comment.
that is not much better, the lib is ~2MB and wasm version is ~1MB (raw, not base64)
better to just lazy load it from CDN instead of bundling it into the source
the bundle.js is currently sitting at 5.27MB, already quite big, I don't think we can spend more than 100KB for such a small feature
|
I will take a look at this after the weekend |
NickM-27
force-pushed
the
heic-image-support
branch
from
7f19f8e to
3d21058
Compare
Sounds good, I just pushed a commit with pulling the lib from a CDN instead, but happy to make any changes y'all want after you take a look |
3 participants
Overview
This PR implements support for HEIC/HEIF images in the UI, matching how WebP is implemented. An additional dependency for heic-to is added as non-safari browsers don't have the capability to decode HEIC images directly.
closes #24103
Requirements