PWAに苦しめられて困り果ててる・・・という内容の投稿をしたのが去年(2019年)の8月のことでした。
その時にも書いたように、このブログで使っているワードプレスのテンプレート(トール)の影響で、いくらブログを更新してもTOPページを開いてみたら何日も前の状態しか表示されなかったのです。
だから、せっかくブログを読んでくれた人が「久しぶりに見てみようかな」って思ってくれても、古いままの状態しか表示されずがっかりさせてしまう。
そんな残念すぎる出来事が多発していた当ブログなのですが。
どうしたら最新状態が表示される「普通のブログ」になってくれるのか。
ネットで調べたりテンプレート(トール)の設定を隅々まで見たりと頑張ってはみたものの、どう頑張っても古い状態の表示になってしまい、正直もう「とりあえずしばらく様子を見よう」と事実諦めモードになっていました。
その後ですが、ちょくちょくいじってはみたものの全く進展ないまま、、
「最近どうなんだろう。と言っても何も変えてないんだからどうにもならん。いかん。なんとかせねばっっ( TДT)」
とがちで思い立ったのがここ最近のことです。
まずは、スマホとパソコンで今見える状態が何日前で止まっているのかを確認する必要がある!
と思い自分のパソコン&スマホ上で確認したところ、Firefoxは3日前・ Chromeはなんと3ヶ月前のままで更新が止まっていました。
現実はもう桜が咲くような季節なのに、ブログは年末で止まってる(ように見える)。
これじゃみた瞬間に萎える\(^o^)/
しかも更新ボタン(リロード)を何度押しても更新が反映されないから使いにくいったらない。
ブログを開始してもう半年以上経っているというのに・・ふりだし状態&自分の無能さに泣けてきました。
そもそもPWAって何??
テンプレート(トール)のせいでこんなことに・・という話はひとまず置いておいて、PWAにはどんな機能があるか説明したいと思います。
まずPWAを導入するとアプリっぽい動きが出来るようになるそうです。
例えばスマホのホーム画面にアイコンを追加したりとか更新情報の通知が自動で入るようにできるとか・・まるでアプリを導入してるっぽいサイトに見える訳ですね。
しかもページの読み込み速度が速くなったりネットが繋がってない状態でもブログを閲覧してもらえる。
これだけ聞くと、すごく今っぽくて合理的な機能に見えますよね。
このブログでPWAを活用したら何が起きたか
だけど実際にトールでPWAを有効化すると、「サイトをいくら更新しても古いまま現象」が起きた訳なんです。
そう、「ネットが繋がってない状態でもブログを閲覧してもらえる」・・ってことは。つまり以前サイトを訪れた時の状態がそのまま表示されてしまう!!!
ようなのです(涙)
PWAの説明をみていると、
「ユーザーがサイトを閲覧している間に他のページ情報を読み込むからユーザーが待たなくていい。」
みたいに書いてあるんだけど、そもそも3月に訪れたのに「師走を乗り切ろう〜」とか書いてあったら、私なら秒でそんなブログ閉じる。
つまり、他のページ情報の読み込みなんて無駄足でしかない(トールは)
そもそもホーム画面にアイコン追加とか更新情報の通知とか・・このブログにそんな機能を欲してくれる人なんているだろうか?(いやいないと思う涙)
ちなみに私は、スマホにおいとくアプリを最小限で食い止めたい人間だ。
むしろ、何かの拍子に閲覧したサイトで、
「ホーム画面に追加しますか?」「プッシュ通知を受け取りますか?」
↑こんなのが出るだけでうざくなる。速く消えろとか思う。マジでもうついてくんなよ~っっとか思うタイプ。
今思うとあのうざい通知、あれは「PWA」だったということだ。
うち σ(^o^)/・・(遠い目)
ワードプレストールのPWA問題をなんとかしたいっ!!
ということでここまでの話をまとめると、ワードプレストールのPWA機能は、以前サイトを開いた時のキャッシュ(履歴情報)がお手元のスマホやパソコンに残っていて、そのいらぬ記憶をわざわざ復元させちゃうという、この上ないほど厄介な機能だったということになります。
もともとPWAは、ユーザー側は接続の待ち時間が短縮できるし、管理人側はグーグルさんに「うちのサイトは待ち時間の少ない使いやすいサイトでっせ〜」と勝手にアピールができる。
PWAにはそんな素晴らしい(と思っていた)利点がある。
しかし実情は、うちのブログを一度でも見た人(私も)が全て、古い情報しか見れないという、誰も得しない機能でしかなかった訳です(ぴえん)
もっと専門知識があれば、打開策を見出せたりとか直接phpを書き直したりとか、自分好みにカスタマイズ出来るかもしれないが私にそんなスキルはない(断言)
こんな時のためにトールには会員向けのお助けサービスが充実しているのだけど(解説サイト&会員フォーラム)正直どちらもいまひとつだった。
一通りは見てみたんだけど、正直何も解決できなかったので、また改めて打開策をネットで検索してみました。
ワードプレストールのPWA問題解消の糸口発見!
その結果ですが、私と全く同じ痛い思いをしている証言は見つけられなかったけど、どうやらトールを使っている人の発言を見ていると「PWAを切った」と言っている人が時々いた模様です。
そして自分のパソコンやスマホのキャッシュ(閲覧情報)を削除したら一番新しい状態になった、と。
つまり、PWAが生み出したごみ(閲覧情報)が全ての邪魔をしている!!!
だから、まずはPWA機能という「ごみ製造マシーン」をこのブログから抹殺してやればゴミはもう「生まれない」。
そしてスマホやパソコン上で溜まりに溜まった「PWAが産んだごみ(閲覧情報)」もぜーんぶスッキリ捨ててやれば今までのゴミも「一掃できる」。
ということになる訳です(*゚∀゚*)パアァ
ワードプレストールのPWA問題、ついに解決?!
ただその方法だと、確かに新しいゴミはもう産まれないけど、今までのゴミは一人一人が自分で処理をしなければならない。
つまり、一度でもこのブログを見に来てくれた人に、このブログひとつのために「キャッシュ削除」という極めてめんどくさい作業をしてもらうしかない!という話になってしまいます。
でもこんなブログひとつのためにそんなめんど臭いことをして頂く訳には絶対いかない。
だからこちら側が何か対策することで、誰にでも一番新しい状態を見てもらえる状態にしなければ!と心から思いました。(むしろそれ普通)
そして調べるだけ調べて、私が見つけ出した結果はこれ。
無理\(^o^)/
つまり、個々でキャッシュを消して頂くしかない。
しかもトールのPWAが生み出したごみはとにかく厄介で、普通にキャッシュを消すだけじゃ消えない。
もうそれは、ちょーうるとらキャッシュ削除 。(ネット上ではスーパーリロードよりさらに強力なキャッシュ削除なんて書かれていた)
どれだけ頑固な汚れ(PWA)なのか。
もちろんこんなブログひとつのためにそんなめんどくさいお手間をおかけする気は毛頭ありません(´;ω;`)
ただひょっとしたら、何かの理由でその強力なキャッシュ削除の方法が知りたい人もひょっとしたらいるかもしれないので参考までに掲載を・・
ちょーうるとらキャッシュ削除のやり方(参考までにChromeパソコンの場合)
Chrome画面の中で右クリックする → 「検証」をクリック → 「DevTools」 → 「Application」をクリック → 「Service Workers」をクリック → 「Unregister」をクリック
※キャッシュ削除の際にCookieも消さないように注意しましょう!(ログイン情報が消えたりします汗)
そしてスマホなんですがこの強力な削除方法、思いつく方法は全部試したものの、それでもキャッシュが消えなく良い方法がどうしても分からなかったので、
開き直ってブラウザアプリ自体を削除してやりました\(^o^)/
そしてその後もう一度インストールし直したらやっとPWAのごみが全て消えてくれた。ざまみろーぃ
(しかしAmazonとか他のサイトで必要なログイン情報とかも一部消えた笑)
かなり深手を負ってしまったけれど、、これで私のパソコンやスマホからは完璧にPWAごみは消え失せました。
ただ。ただこちらがこのブログ上でトールのPWAをONにしている限り、このごみは新たに排出され続ける。
絶対だめ\(^o^)/
もちろんトールのPWAも「無効化」一択!
そんなだから当たり前だけど、トール側のPWA機能も切ってやったぞ(ざまみろーーい!)
(ちなみにこの辺がイマイチわからなくて、今まで何度か切ったりつけたりをずっと繰り返していた涙)
もう永遠にこのスイッチをONにすることはないでしょう。… シミジミ
これで少なくとも私のパソコンやスマホからは、自分のブログが常に新しい状態で表示されるようになりました!
(むしろそれが当たり前っ!)
あっ。あとあと、、
「サイト公開前にこのことに気づいてPWAの実装を諦めたら良かったけど、もし気づかないでそのまま公開してたらと思うと恐ろしい・・」
みたいに書いてるサイトを見かけましたが・・
こうなりますっっ\(^o^)/
【余談】強力じゃない一般的なキャッシュ削除方法
せっかくなので一般的なキャッシュ削除方法(スマホ版)も一緒にご紹介しようと思います。
ちなみにこの方法は、PWAが生み出した頑固汚れ満載のPWAごみにはまったくの無力でしたが、大抵のごみにはよく効くはずです(笑)
Google Chromeのキャッシュ削除方法
Chromeアプリを開いて右上の点3つをタップして「履歴」→「閲覧データを削除」→(削除する期間を選ぶ)→「キャッシュされた画像とファイル」にチェックして「データ消去」をタップ!
※「Cookieとサイトデータ」にチェックが入っているとログインなど必要な情報も消えるので注意です
iPhoneSafariのキャッシュ削除方法
「設定」アプリ→「Safari」 → 「履歴とWebサイトデータを消去」→「履歴とデータを消去」をタップ
普通のサイトだったら「あれ?更新されないな」って思ったら、この作業をすればほぼ更新されるっ。はず!
【結論】トールのPWAは絶対使っちゃいかん!(注:私みたいな素人は)
ちなみにPWAは読み込みが早いから、その分グーグルさんによく思ってもらいやすい!(=SEO⤴︎⤴︎)というのが最大の利点と言われています。
せっかくなので私もこのブログが読み込みに何秒かかるかを計測してみたのですが、PWAバリバリの時は1.8秒とちょっとだけ早いという結果が出ていました。
そして、PWAもAMPも全て切った現在、思い出したように久しぶりに測ってみたらなんと5秒。(がっつり遅い)
という結果になっています。
PWAとAMPを切ったことだけが原因ではないと思うのですが、トールというテンプレートに読み込みの速さを期待している人は、カスタマイズに自信がある人でないと、きっと私みたいに残念な思いをすると思うので、それなら違う有料テンプレートを探した方がいいと思います(汗)
トールの利点はデザイン性の高さ&装飾の手軽さ
トールだと本文の装飾や画像の挿入に、ボタンのクリックや画像のドラックなどで簡単に出来るお手軽さがあります。
あとやはりデザイン性は高いと思うので、この2つに惹かれている人は購入してもいいのかなって思います。
逆をいうと、それ以外の機能はないものと思っておいた方がいい。(使わない方が賢明w)
特にSEO効果とか狙ってる人にはまったく勧めません(笑)
じゃあお前は何がオススメなのかと言われると・・実は私、有料テーマの購入って初めてだったので
全くわかりません\(^o^)/
以前お伝えしたように、トールはAMP機能でもかなり悩まされました(そして結局そのAMPも切ったww)
大事なことなのでもう一度言います。
- 「AMP標準搭載」
- 「PWA標準搭載」
- 「だからSEO効果抜群♪」
トールのテーマに、この3点を期待している人にトールの購入は絶対オススメしません(笑)
(購入前の私そのもの)
あとまだ新しいテーマなので調べても情報が少なく、打開策を見つけにくいので今回の私のように一度沼にハマると労力注ぐかもしれません(汗)
逆に、スタイリッシュな見た目に魅力を感じている人ならアリなのかなと。
(このブログとほぼ同じ見た目にするとかだったら割と難しくないと思います)
AMPとPWAを最初から使わないと割り切れば、お洒落だし直感的に使えるのである程度使いやすいテーマかも、とも思いますね。
\ もしトールが気になる人はここから見てみてくださいね^^; /
ワードプレストール内蔵PWAとの戦いにやっとケリがついた・・
PWA問題はこのブログの公開当時からまとわりついてました。
・・・公開したのが2019年6月末、今が2020年3月。
実に8ヶ月間、、私はPWAに悩まされ続けていた訳です。
もしも、
「あれ??ブログ更新されてないのかな」
「使いにくいなぁ」
こんな気持ちにさせてしまった方がいたら、本当に申し訳ありません。。
悪いのは全てトールです。
あと、どこかのブログやサイトを訪問した時に「なんかおかしいな」って思ったら、一度今回の私のようにキャッシュを削除してみたら解決するかもしれません。
今回、このトールというテンプレートを選んだことで、PWAもAMPも改善法を探るのに相当な手間と労力がかかりました。
その時間で何記事書けたのかな・・とか思うとちょっとしょんぼり。
でもしょうがないので良い勉強になった・・と思う。
新しいものに飛びつく時は、大胆さと慎重さのバランスが大事なんでしょうね。うん。
(それが難しい)