threema-ch / threema-web

The Threema Web application.
GNU Affero General Public License v3.0
1k stars 107 forks source link

Make it a Progressive Web Application (PWA) #407

Closed rugk closed 4 years ago

rugk commented 6 years ago

It would be nice if you could make Threema Web a Progressive Web Application, so it can be used on a phone as a "app", whcih feels quite native.

Especially as Mozilla recently released Firefox 58 for Android, which now supports This is how PWAs look like: https://www.youtube.com/watch?v=7sMtsOeqv2w

More information e.g. here: https://developer.mozilla.org/en-US/Apps/Progressive

As Threema Web already operates only offline (static files), the only thing, which may be still missing is a manifest file, so it can be added to the Homescreen. Okay, you maybe also need some ServiceWorkers to make it possible to launch the PWA without internet connection.

dbrgn commented 6 years ago

Okay, you maybe also need some ServiceWorkers to make it possible to launch the PWA without internet connection.

How would you access the SaltyRTC signaling server without internet connection?

rugk commented 6 years ago

How would you use Twitter without a internet connection? (They also offer a PWA.)

I think the purpose of having the assets locally for a PWA is just to have everything installed and to prevent that it is downloaded again and again (just like a native app) and of course it also starts faster. Of course PWAs, which can be used completely offline, are optimal, but it maybe is also designed so that it works in bad network conditions, i.e. you only need some small api calls (Twitter) or some tiny connection and otherwise can use LAN connections (Threema Web).

Generally, don't ask me. Ask the ones who invented PWAs. I think the general idea us to make it as close to a native app as possible. And there, the usual concept (which nobody would question) is that you download the app with all assets first, and then only make some connections if necessary.

ovalseven8 commented 6 years ago

While possible, it's probably not that useful to run Threema Web on a phone. The UX will be bad and the batter drain enormous.

dbrgn commented 6 years ago

Generally, don't ask me.

Well, you requested the feature :) Do you have a compelling use case for this? The only place where this might be useful is on a tablet. But as @ovalseven8 said, it could lead to battery drain with the current state of the application.

Anyways, I think PWAs are interesting, but this doesn't have very high priority for us at the moment. Pull requests are welcome though!

rugk commented 6 years ago

Okay, added a PR for the manifest. Still, for a real PWA the "offline functionality" is still missing.

As explained in https://infrequently.org/2016/09/what-exactly-makes-something-a-progressive-web-app/:

Should load instantly, regardless of network state. This isn’t to say that they need to function fully offline, but they must put their own UI on screen without requiring a network round trip.

This can even be a custom offline page only.

kristian-b commented 6 years ago

Since Windows 10 Update 1803 the Windows Store accept PWA submits to the store: https://blogs.windows.com/msedgedev/2018/02/06/welcoming-progressive-web-apps-edge-windows-10/

Would be really great to see Threema Desktop in the Windows Store.

dbrgn commented 6 years ago

Edge does not support WebRTC data channels, so that won't work at the moment. At least not with Android (Threema Web for iOS will only require Websockets).

ovalseven8 commented 6 years ago

@dbrgn: Will the future be to also make Threema Web for Android working with websockets only or waiting until iOS supports data channels?

dbrgn commented 6 years ago

@ovalseven8 that's yet to be discussed, but a hybrid websocket / datachannel approach could be an option.

dbrgn commented 6 years ago

What does a PWA give us compared to classic asset caching (which we already do aggressively)? What's the goal you want to achieve?

kristian-b commented 6 years ago

What does a PWA give us compared to classic asset caching (which we already do aggressively)? What's the goal you want to achieve?

I find the usage experience of the e.g. Windows 10 Twitter PWA very comfortable:

All that things I am missing at Threema Desktop,

rugk commented 6 years ago

Yes, a PWA is much more than just caching, or just offline, or just "have a nice entry method/fullscreen via WebManifest". However, it is each one of these parts and combined they just make users experience the website as a "real native app". At least, I think, this was the idea, when it has been invented. Kinda like the "WebApps are the new native apps" mantra…

dbrgn commented 6 years ago

But for "offline" we would need to store the messages/conversations on the client device, which I don't think is a good idea. And if you take away "offline" and "caching" (because it's a non-issue for us, we cache all resources indefinitely until a new release is published), we're left with "have a nice entry method via webmanifest" which we already implement.

What else would be the advantages of a PWA?

Note that - as mentioned before - submitting the application to the Windows store is not currently possible, since Edge does not support WebRTC data channels (required for Android devices). And submitting a client that only works for iOS clients is bad user experience.

rugk commented 6 years ago

Well that Edge does only support iOS here basically is a limitation of this app/Edge and may be changed/fixed on either party, so this "advantage" can be "created".

Apart from that, yeah, saving messages would probably not be the best, also but saving the passwords. However, such a thing may be what some users want. E.g. I can imagine that the ones who would like to have an electron application, would maybe want to have a persistent session across restarts.

Anyway, I think this all may depend on how browsers may implement PWAs in the future, so you can possibly use it without edge/on all OSes.

David100mark commented 5 years ago

Now that Microsoft is going to switch the Edge Engine to chromium, the PWA could be implemented, right? I really would like to see native background notifications on desktop.

chrisly-bear commented 5 years ago

I, too, would really enjoy this feature, however mainly for desktop use (not on Android/iOS as was initially suggested). Chrome has this nice 'install' feature for PWA's. After installing a PWA it acts like a normal desktop app with its own window, icon, notifications etc.

You can try it out with this note taking app for example: https://sii.im/playground/notes/ After opening the page, go to the hamburger menu and select "Install notes..."

install-PWA

You can find additional PWAs on https://pwa.rocks/.

lgrahl commented 5 years ago

This is definitely on my personal to do list, but unfortunately it is quite far from low-hanging.

chrisly-bear commented 4 years ago

I created a PR adding a (minimal) service worker. This will make the app installable on desktop devices using Chrome/Chromium (as demonstrated previously).

The service worker doesn't do anything at the moment, e.g., it doesn't cache assets or provide offline functionality. Thus, I guess we should still keep this issue open.

UweKeim commented 4 years ago

Any progress on this?

dbrgn commented 4 years ago

Yes, #972 was merged, so I guess this issue can be closed. The next release will happen this or next week.

Note that this does not include offline support. It's still the same webapplication as before, but you can now install it to your Desktop when using Chrome.

UweKeim commented 4 years ago

Awesome, Danilo, thanks a lot 👍