デスクトップ PWA が 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

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

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

「いいね!」 6

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

Here is a demo of Discourse offline browsing on iPad

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

「いいね!」 14

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

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

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

Here is Meta install:

「いいね!」 6

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

「いいね!」 4

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

これは最新の Discourse tests-passed でライブです。

bug については、新しいトピックでご報告ください。

「いいね!」 12

Chrome 76 は昨日、オムニバーにインストールの呼びかけ(コール・トゥ・アクション)付きでリリースされました。最新の Discourse は、これとすぐに連携して動作します。

「いいね!」 15

本日リリースされた Chrome 76 で動作が確認されました。アドレスバーには、その存在を強調するかなり複雑なアニメーションさえあります:!

ただし、このアニメーションはドメインごとに一度だけ発生するようです。

技術的にはリリース済みですが、まだ実験的な段階と捉えているため、このトピックを再オープンします。

「いいね!」 11

アドレスバーのアイコンを、Discourse側またはChrome側で非表示にする方法はありませんか?ブラウザのみを使用したいので、そのアイコンが常に表示されている意義がわかりません。

おそらく、Chrome ブラウザの開発者に向けた質問であって、私たちではありません。

「いいね!」 7

Chrome 側で Google 検索してみましたが、何も見つかりませんでした。なので、彼らに聞いてみることにします。

これは、理論的には localStorage などでdismiss可能、あるいは Discourse の設定に基づいて恒久的に非表示にできるようなものなのでしょうか?私が聞いている理由は、Chrome が自動的にウェブサイトが PWA として互換性があるかどうかを検知するのか、それともあなた側で条件付きでそのオプションを提供する柔軟性があるのかがわからないからです。

興味のある方へ:chrome://flags に「App Banners」という設定があり、これを「無効」にするとアドレスバーのアイコンを削除できます。

編集:実際には、関連する設定は「Omnibox からのデスクトップ PWA のインストール可能」のようです。

「いいね!」 7

参考までに、今日は Linux(Ubuntu)の Chrome で、Discourse をアプリとして「インストール」するよう提案するポップアップが表示されました。ウェブサイトが通知の許可を求めて表示するポップアップに似たものです。

Chrome はこのような「インストール」を推進しようとしているのでしょうか?

デスクトップでポップアップ!?

スクリーンショットはありますか?

「いいね!」 4