僕の考えた最強のService Workerキャッシュ戦略で爆速サービスを作った - Qiita
はじめに 聖地の写真を共有するサービス「Holy Place Photo」にService Workerによるキャッシュを実装しました。 そのためネットワークがオフラインでも下記のようにサクサク動きます!!!! Service Worker Demo pic.twitter.com/t04xSRl7B2 — tiwu (@tiwu_official) 2019年2月25日 また、LighthouseのPWAのスコアは100を取れました。 この記事ではService Workerを利用したキャッシュの設計、Laravel + Vue.jsのWebアプリケーションでの実装を解説していきたいと思います。 注意書き 僕の考えた最強のService Workerのキャッシュの設計のため唯一の正解ではありません キャッシュの設計はサービスによって違うと思うのでこの記事は一つの参考にしてください まずS
PWAs on iOS 12.2 beta: the good, the bad, and the “not sure yet if good”
A year ago, in January 2018, Apple surprised everyone with its early support for Progressive Web App technologies in iOS 11.3 beta. At that time, I published PWAs coming to iOS: Cupertino, we have a problem. Two months later, the stable release appeared and most of the bugs and UX issues remained during 2018, with new bugs coming in and out between iOS 11.4 and 12.1. Note: Final iOS 12.2 was relea
6 Tips to make your iOS PWA feel like a native app
On March 30, the long-awaited iOS 11.3 update was released, with support for basic PWA features on iPhones and iPads, such as service workers and app manifest files. Although it is great that these are finally supported, the user experience of Progressive Web Applications on iOS is still not perfect. That means that many existing PWAs still have some serious issues on Apple devices, while providin
ウェブ向けのストレージ | Articles | web.dev
ウェブ向けのストレージ コレクションでコンテンツを整理 必要に応じて、コンテンツの保存と分類を行います。 外出先でインターネット接続が不安定であったり、接続できなかったりする場合があるので、 オフライン サポートと信頼性の高いパフォーマンスは、 プログレッシブ ウェブアプリ完全なワイヤレス状態でも 保存、キャッシュ、その他のストレージ手法を賢く使用すると、 ユーザーエクスペリエンスが大幅に向上しますキャッシュに保存する方法はいくつかあります。 静的なアプリケーション リソース（HTML、JavaScript、CSS、画像など） データ（ユーザーデータ、ニュース記事など）最適なソリューションはどれでしょうか？方法 保存できる量はどれくらいでしょうか強制排除されないようにするにはどうすればよいですか？ 何を使用すればよいですか？ リソースを保存する一般的な推奨事項は次のとおりです。 アプリやフ
PWA(Progressive Web Apps)と戯れてみる - Qiita
はじめに Livesense Advent Calendar「学」の7日目です。「学」から連想できるものであれば、なんでもよしということで何を題材としようかと迷いましたが、せっかくなので「業務上あまり関わりがない分野の技術を学ぶ」ということにしました。 普段はAWSやGCPなどのクラウドやコンテナ周りを触ることが多く、インフラ関連がほとんどのため、今回はフロントエンド周りで熱いと噂のPWAを触ってみたいと思います。 PWAに関しては、Qiitaでもまだ投稿が少なく30件程度でした。特に目新しいことをしておらず、何番煎じかわかりませんが、なにか参考になることがあれば幸いです。また、的外れなことを書いてたらご指摘いただけると助かります。 PWA(Progressive Web Apps)とは Googleの記事を借用すると、以下の特徴を持つようです。 https://developers.go
PWAの実装をしてみた - 技術探し
一年以上前の記事なので、コードが古いです。気をつけて読んでください。 PWAとは？ 目的 技術スタック Service Worker PWAのview App Shell Content キャッシュ戦略 読み込みフロー Web App Manifest デザイン FirefoxとChromeしかService Workerないけどどうするの？ ネットワーク 実装 ライブラリ webpack-offline 構成 ファイル ルーティング アセットのインストール API周り SSR 資料 さいごに そういえばPWAの実装したことがなかったなと思ったので少し触ってみた。 PWAとは？ PWA(Progressive Web Apps) インストールが不要で、不安定なネットワークでも素早く起動し、プッシュ通知を可能にします。 また、ホーム画面にアイコンも表示でき、アプリと同様の扱いをすることが可能
PWA 入門 〜iOS SafariでPWAを体験するまで〜 2019年7月更新 - Qiita
What's PWA ? Progressive Web Apps （プログレッシブ ウェブ アップス）の略 Googleが推進している、モバイルユーザーの体験（UX）向上を目的とするプロジェクト・技術のこと PWAは、わざわざApple StoreやGoogle Play Storeからインストールする必要はありません 不安定なネットワークでも迅速に起動し、関連性の高いプッシュ通知を送信することができます。 ホーム画面にアイコンを表示することができ、トップレベルの全画面表示で読み込むことができます。 ▼このように、Webサイトを直接ホームに追加することでアプリケーション化されます 導入事例 大手WEBサイトからで導入がはじまりつつあります コンバージョンアップにも効果的です Trivago https://www.trivago.com Twitter Lite https://mobi
いまさら聞けないPWAとAMP - Qiita
概要 PWA = モバイルのWEBページでネイティブアプリのようなUXを提供するためのもの ※ 2020/04/05 追記: PWAに関する仕様の策定当初はモバイルでのユースケースが主だったと記憶していますが、PWAはモバイルに限定されたものではなく、実際にデスクトップでの活用例も増えています。参考: PWAs: building bridges to mobile, desktop, and native (Google I/O '18) AMP = モバイルのWEBページを高速化するためのもの どちらもGoogleが主軸となって策定されている、モバイルページを進化させるためのプロジェクトおよび技術。ネイティブアプリの代替技術ではなく、ブラウザAPIの進化によってネイティブアプリのようなUXをウェブページで提供することが主眼。 1. PWAとは Progressive Web Appsの
PWAのメリットと導入事例、対応ザラウザ、よくある質問、実装方法まとめ
PWAは通常のWebページにネイティブアプリのような機能を実装できる仕組みです。 ネイティブアプリのようにストアからインストールする必要はなく、ChromeやFirefoxなどのブラウザで通常のWebページと同じようにアクセスするだけで、ネイティブアプリのようなUX体験を提供できます。 ユーザーは、いちいちストアからアプリをインストールする必要が無く、ページの高速表示やオフラインでの動作などの恩恵を得られます。既に、国内では楽天レシピやSUUMO、Twitter、海外ではアリババやランコムなどがPWAを導入しており、モバイル端末からのコンバージョンが大きく改善したという事例も多数報告されています。 PWAのメリットと導入事例、対応ザラウザ、よくある質問、実装方法を紹介します。 PWAとは PWAとはProgressive Web Appsの略で、モバイル端末のブラウザでWebページを表示す
結局 PWA は来るの？来ないの？
昨日 Twitter でこんな記事を発見しました。 PWA が来るって言っているエンジニアは今すぐ辞めろ 「instagram の PWA が最高〜！ネイティブと見分けつかない！！とかほざいているグー○ルのエバンジェリストだかエンジニアが騒いでいたので触ってみたのだが、オワコンであった。」 もしかしてこれのことかな？ Instagram PWA is sooooooo impressive. I probably won't be able to distinguish it with its native app. InstagramのPWAが、デキが良すぎて感動してる。ネイティブアプリと見分けられる自信ない。 pic.twitter.com/DS8TfceBZ6 — Eiji Kitamura / えーじ (@agektmr) 2018年1月26日 確かに、この言い方は若干煽り気味のと
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Creating a Custom PWA Splash Screen - SimiCart
What is progressive web app solution for IOS