¡PWA de escritorio funciona con Discourse!

Per Hands-On with Microsoft's New Edge Browser Built on Chromium - Thurrott.com

When it comes to features, Edge has the one critical item that always kept me crawling back to Chrome. If you are on a webpage, you can easily turn it into an app, by clicking the three dots in the top right and clicking install app. This is huge, as it allows me to turn Google Calendar, Tweetdeck, and a few other pages into applications on my desktop that makes my workflow, a lot easier.

:thinking: we should definitely whitelist all Chrome based browsers @falco

8 Me gusta

Looks like Chrome Canary is experimenting with a more in your face install button:

https://twitter.com/henrylim96/status/1110916077519699970

Here is it in Meta when the service worker is working:

13 Me gusta

Niiiice. We should definitely get this working on Chrome. I like it.

6 Me gusta

We want to get this working, but the last time we tried with the “You are offline” page wasn’t a great experience. Also we had a lot of suggestions about making reading Discourse possible when you are offline.

Using some libraries from GitHub - GoogleChrome/workbox: 📦 Workbox: JavaScript libraries for Progressive Web Apps · GitHub I was able to:

  • Remove the “You are offline” page

  • Make Discourse fallback to cache when a network request fail aka Discourse will allow offline browsing of every previously visited page.

  • Get a perfect score in the PWA Lighthouse audit:

  • Get the “Install Site” on the Desktop working (availiable in Chrome canary for now, will land in stable around August)

    image

Technical Details

The changes are pending in this branch: https://github.com/discourse/discourse/compare/offline

A demo site is running at https://discourse-workbox.muito.ninja/

27 Me gusta

Here is a demo of Discourse offline browsing on iPad

https://giant.gfycat.com/BlushingGreedyGiantschnauzer.mp4

14 Me gusta

Can you create topics offline that get synced with the server when the device is back online?

The current changes only affect GET requests, so it will make you able to use the composer, if you ever did it while online.

Discourse already keeps submitting a topic in a persistent “Saving” blue bar, and this doesn’t touch that request, so it should keep the current behavior.

However, getting Discourse to work totally in write mode while offline would require a lot more work and be a long term project involving multiple people. That is not the scope here, which is just enabling installs in Desktop.

9 Me gusta

cc @falco

In Chrome 76, we’re making it easier for users to install Progressive Web Apps on the desktop by adding an install button to the omnibox.

16 Me gusta

Okay, this is live in Meta for testing now. Please report any crazyness.

Here is Meta install:

6 Me gusta

Is there a flag we can set to tinker with this on our own installations?

4 Me gusta

It’s in the same branch as always here. You could deploy from that branch but it is a lot behind master currently. I can rebase it to master, but I don’t recommend messing with this until it’s proven stable here.

Another cool thing, if you try to use the pwa with a cold cache:

13 Me gusta

Esto está disponible en la última versión de Discourse tests-passed.

Por favor, informa cualquier Contribute > Bug en nuevos temas.

12 Me gusta

Chrome 76 se lanzó ayer con el botón de llamada a la acción ‘Instalar’ en la barra omnibox, y la última versión de Discourse funciona con él sin necesidad de configuraciones adicionales.

15 Me gusta

Confirmado que funciona en Chrome 76, lanzado hoy. Incluso hay una animación bastante compleja en la barra de direcciones :exclamation: que llama la atención sobre ella.

Parece que la animación solo ocurre una vez por dominio.

Técnicamente ya se ha lanzado, pero aún lo considero bastante experimental, por lo que estoy reabriendo el tema.

11 Me gusta

¿Hay alguna manera de ocultar el icono en la barra de direcciones, ya sea desde Discourse o desde Chrome? Prefiero usar solo el navegador, así que no veo el sentido de tener ese icono visible para siempre.

Probablemente sea una pregunta mejor dirigida a los desarrolladores del navegador Chrome, no a nosotros.

7 Me gusta

He estado buscando en Google por el lado de Chrome, pero no encontré nada. Así que supongo que les preguntaré directamente.

¿Es algo que teóricamente se pueda descartar (por ejemplo, con localStorage) o ocultar permanentemente según una configuración de Discourse? Lo pregunto porque no sé si Chrome detecta automáticamente si el sitio web es compatible como PWA o si hay alguna flexibilidad de su parte para ofrecer la opción solo condicionalmente.

Para cualquier otra persona interesada, hay una configuración en chrome://flags llamada App Banners que puedes establecer en Deshabilitado para eliminar el icono en la barra de direcciones.

EDITO: En realidad, la configuración relevante parece ser Desktop PWAs installable from the omnibox.

7 Me gusta

Solo para informarte, hoy en Chrome en Linux (Ubuntu) incluso apareció un popup proponiéndome «instalar» Discourse como una aplicación. Algo similar a los popups cuando los sitios web solicitan permiso para enviar notificaciones.

¿Está Chrome intentando promover este tipo de «instalaciones»?

¡Una ventana emergente en el escritorio! ¿Tienes una captura de pantalla?

4 Me gusta