search

elegantapp / pwa-asset-generator

Automates PWA asset generation and image declaration. Automatically generates icon and splash screen images, favicons and mstile images. Updates manifest.json and index.html files with the generated images according to Web App Manifest specs and Apple Human Interface guidelines.
MIT License
2.72k stars 138 forks source link

File hashes #318

Open Janne252 opened 4 years ago

Janne252 commented 4 years ago

Is your feature request related to a problem? Please describe. New icons will not become visible to the users due to browser caching and cache headers.

Describe the solution you'd like Introduce a customizable (filename template?) option to add hashes to generated icon file paths, e.g.

Describe alternatives you've considered I'm currently using a custom script file to use the programmatic API of pwa-asset-generator. I'm adding hashes to the src and href paths with hasha. This is fine, but it would be nice to have built-in support for file hashes.

frederikhors commented 4 years ago

This would be amazing!

Today it is impossible to update an icon of a PWA installed on Android except by changing the name in the manifest!

Too 90's! :smile:

onderceylan commented 4 years ago

Thanks for your feedback @Janne252 and @frederikhors! I will look into this feature asap.

djhmateer commented 3 years ago

File hashes would be a good feature.

In the meantime, I'm incrementing the directory eg ./assets23 every time I do a regenerate, to bust the cache.

# generate transparent favicon with no padding (so that Windows Chrome icon is as big as possible)
npx pwa-asset-generator santa-claus.svg ./assets23 -i index-template.html -m manifest.json  --opaque false --icon-only --favicon --type png --padding "0"

# overwrite 2 manifest icons and apple-icon-180.png with a background colour
# have a default 10 padding so that phone icons have a border (which looks good)
npx pwa-asset-generator santa-claus.svg ./assets23 -i index-template.html -m manifest.json --background "#696969"
atjn commented 3 years ago

Chrome does actually check to see if the icon has changed. From: https://web.dev/manifest-updates/#cr-android-trigger

Which properties will trigger an update? [...] File hash changes to the primary icon file, File hash changes to the splash icon file

Which browsers are your apps installed through? If it's Chrome, I would encourage you to file a bug instead. I'm not against adding this feature, but I think we should try to get it fixed in browsers before resorting to funky hacks ;)

bulbigood commented 1 year ago

I think this is a very important feature. Thumbs up!

bulbigood commented 1 year ago

Chrome does actually check to see if the icon has changed. From: https://web.dev/manifest-updates/#cr-android-trigger

Which properties will trigger an update? [...] File hash changes to the primary icon file, File hash changes to the splash icon file

Which browsers are your apps installed through? If it's Chrome, I would encourage you to file a bug instead. I'm not against adding this feature, but I think we should try to get it fixed in browsers before resorting to funky hacks ;)

The page you link to has this warning:

Changes to name, short_name and icons are not currently supported on desktop Chrome, though work is underway to support them.

So I don't think it would be helpful to file a bug. Also, it doesn't say anything about other browsers. So it's necessary to use a hash or workarounds there to bust the cache.

atjn commented 1 year ago

Hello @bulbigood. Thank you for contributing to this discussion in a constructive and open-minded way, I really appreciate it!

At the time I wrote my comment, the warning about icons was newly added, probably because someone filed a bug for it, and it seemed like it would be fixed quickly. Looking back after two years, it seems a little less sure. Or maybe it is fixed but the warning just hasn't been removed, maybe someone has time to test that?

Anyways, I actually thought the original comment was specifically about mobile apps, in which case the desktop problems didn't matter. Reading it again, I'm not sure if that is the case.

Also, it doesn't say anything about other browsers. So it's necessary to use a hash or workarounds there to bust the cache.

Yes, I agree. That is why my original comment said:

I'm not against adding this feature

But no matter what browser you encounter this issue in, I would still encourage you to file a bug for it, because it would be much nicer if we, in the future, did not have to apply these hacks in order to update the icons.

bulbigood commented 1 year ago

@atjn now I realize the icons of an installed PWA couldn't be changed except reinstall. At least that applied to my pretty old Android device. That is, there is little benefit from the use of hash in the icon names.

Anyway, I use webpack-webmanifest-loader for icon hashes, which also helps to reduce the amount of routine work in updating PWA manifest.