Service Workerがもつ圧倒的な力。SEO担当者は変化に適応が必要 | Moz - SEOとインバウンドマーケティングの実践情報
PWA、SPA、Service Workerとは？（前編で解説）SPAを可能にするApp Shellアーキテクチャ（中編で解説）Service Workerがもつ圧倒的な力まとめ3. Service Workerがもつ圧倒的な力最初にはっきりさせておきたいことがある。それは、ここまでで解説してきた「SPA」と、ここから取り上げる「Service Worker（サービス・ワーカー）」は、互いに排他的なものではないということだ。 つまりこの2つは共存するものだということだ。どちらもPWAと呼ばれるものの基盤となっているが、SPAではないPWAをつくることも可能だし、従来の静的なウェブサイト（クライアントサイドでレンダリングする処理がないサイト）にService Workerを統合することもできる（近い将来、そのようなサイトが増える僕は思っている）。 さらに、Service Workerはウェブ
「SEO」と「SPA/PWAによるUX向上」を両立させるハイブリッドレンダリングの基礎知識と実現手法 | Moz - SEOとインバウンドマーケティングの実践情報
前編を読んで最新ウェブ技術の入り口に立ったら、次はUXやパフォーマンスを実現するSPAの基本と、SEOのためのハイブリッドレンダリングの基本を理解しよう。 ここでは、ユーザーにとって快適なSPAを実現しながら、検索エンジンがコンテンツをクロール・インデックスできるようにするための基本的な知識として、 ディープURLインデックスサーバーサイドレンダリングハイブリッドレンダリングアイソモーフィックアプリプリレンダリングJSフレームワークによる完璧なハイブリッドレンダリング／静的サイトジェネレータといった具体的な手法を理解していこう。 URLが一意であるか、それがSEOのポイントしかし冒頭で述べたように、クライアントサイドのJavaScriptへの依存度が高い状況は、SEOにとって問題だ。 歴史的に見ると、このような問題の多くは、次のようなギャップに起因する。 検索エンジンのクローラーは、コンテ
Wego | web.dev
Wego Stay organized with collections Save and categorize content based on your preferences. There's a new way to deliver amazing user experiences on the web. Travel company Wego has built a successful AMP based Progressive Web App (PWA). Except as otherwise noted, the content of this page is licensed under the Creative Commons Attribution 4.0 License, and code samples are licensed under the Apache
Web Push Book
HelloThis website has a whole mess of content on implementing push for the web. The push messaging API is still new and the spec has only just started to settle. This site covers how to use the API and answers common questions that arise when implementing push for the web. You can read about push here on this site or grab a copy of this content via one of the download links in the footer. Introduc
Notification Generator | Peter.sh
Unable to execute the JavaScript code. On iOS and iPadOS, requires the web app to be added to the home screen. On Meta Quest, requires the web app to be packaged. Visual settings Title Body Direction Image Icon Badge Behavioral settings Persistent Tag Vibration Timestamp Actions Silent Renotify Req. interaction notificationclose event Show Trigger Reaction settings Action Close it? Request permiss
Storage for the web | Articles | web.dev
Storage for the web Stay organized with collections Save and categorize content based on your preferences. There are many different options for storing data in the browser. Which one is best for your needs? Internet connections can be flakey or non-existent on the go, which is why offline support and reliable performance are common features in progressive web apps. Even in perfect wireless environ
時間泥棒確定！PWAで作られた良質なWebゲームアプリ12個を厳選してみた - paiza times
どうも、まさとらん（@0310lan）です！ 今回は、PWAで開発された良質なWebゲームを厳選してみたのでご紹介します！ スマホのホーム画面に配置してアプリのように起動させることもできますし、オフラインにも対応しているのでネットワークが無くても遊べるものばかりです。 通勤途中や休憩時間などで気軽に楽しめるゲームを厳選しているので、ご興味ある方はぜひ遊んでみてください！ PWAとは？ スマホをルービックキューブに変えてしまうアプリ！ 【 The Cube 】 ピッタリ合わせて高層ビルを建築するバランスゲームアプリ！ 【 Tower Game 】 Chromeブラウザに隠された恐竜ゲームを楽しめるアプリ！ 【 Dino Game 】 3D空間で自分の陣地をひたすら守るディフェンスゲームアプリ！ 【 Defend 】 Googleによる毎年恒例のサンタクロースゲームアプリ！ 【 Santa T
クリエイティブの視点から挑戦するPWA
1. PWAs (Progressive Web Apps) were introduced by Google in 2015 and have grown in popularity since 2017 according to Google Trends. 2. PWAs aim to have aspects of native apps by using technologies like the Web App Manifest and Service Workers to add functionality like being installable and working offline. 3. Developers can check if their web app meets PWA criteria by using tools like the Progres
What makes a good Progressive Web App? | Articles | web.dev
What makes a good Progressive Web App? Stay organized with collections Save and categorize content based on your preferences. Progressive Web Apps (PWA) are built and enhanced with modern APIs to deliver enhanced capabilities, reliability, and installability while reaching anyone, anywhere, on any device with a single codebase. To help you create the best possible experience, use the core and opti
Service WorkerをサポートしないiOSでもPWAで成果をあげた世界最大のビューティサイト
[レベル: 中級] Google Developers サイトに PWA の成功事例が新たにたくさん追加されました。 多くは、Google I/O 2017 でも紹介されていました。 この記事では、特に注目したい事例として Lancôme（ランコム）を紹介します。 Lancôme はコスメやスキンケア、フレグランスなどの美容アイテムを取り扱う世界最大の化粧品会社です。 Lancôme の全体的な成果 PWA による全体的な成果として Lancôme は次のような改善を手にしました ページがインタラクティブになるまでの時間が 84% 減少 ※“インタラクティブ (Interactive)” とはここでは、ページが表示されたり、何らかのアクションをそのページで起こせる状態になったりすることだと考えてください コンバージョンが 17% 増加 直帰率が 15% 減少 モバイルのセッションが 51%
プログレッシブウェブアプリ詳解 ─ 過去・現在・未来
Web技術でアプリ開発2016特集・第5弾は、プログレッシブウェブアプリ (Progressive Web Apps)をご紹介させていただきます。 はじめに プログレッシブウェブアプリ(Progressive Web Apps)という言葉が初めて登場したのは2015年8月のAlex Russellによる記事Progressive Web Apps: Escaping Tabs Without Losing Our Soulです。当時オフラインやプッシュ通知など、モバイルウェブを飛躍的に進化させる画期的な機能が次々と追加されていた状況において、このムーブメントを呼称するための言葉が求められていました。Google社内でいくつもの候補が挙げられましたが、Service Workerの発案者としてAlex Russellが推したのが、この「プログレッシブウェブアプリ」でした。 また、当初Goog
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
SEO担当者向け PWA・SPA・Service Worker 超入門。もう「JavaScript苦手」なんて言ってられない | Moz - SEOとインバウンドマーケティングの実践情報
Collection of small test-cases and tools | Peter.sh
Workbox Broadcast Cache Update | Workbox | Google Developers
加速するフロントエンドとPWA