.jetpack-lazy-image{display:none}ゲームと音楽と副業の「趣味でまったりお金を稼ぐ」ブログです。2018.08.05スポンサーリンクキャッシュあたりの話になるとだんだん頭が痛くなってきますね。わたしも記事をつくりながらしんどくなってきた頃合いです。キャッシュについては導入の是非を問うところがあるので、ぶちくま面倒だからもういいかなという方は、画像の適正化とサーバー設定くらいでやめてもいいと思いますよ。サイトのコンテンツボリュームを増やしていった方がよっぽど利益はあるかと。Insightでやばい評価を受けたのでサイトの高速化に乗り出しています。この記事では、「キャッシュ」についていろいろ弄り倒した内容が書いてあるよう。高速化プラグインのまとめスポンサーリンクCocoonに必要なキャッシュ機能Cocoonだと、ブラウザ側のキャッシュはやってくれる機能がついています。機能のことを言います。ブラウザキャッシュの具体的な機能について最初に来たときには、そのサイトの情報を1から読み込む必要がありますが、2回目にはもうすでにそのサイトの情報を持っているので、たとえばデザインだとかの情報をつかってサクッと表示してくれる、という効果があります。容量があるので、ブラウザの方で「もういいな」と思ったら、数日で消えたりします。ユーザー側にデータを依存している状態なわけです。ユーザー側のブラウザにキャッシュが溜まっていれば逆に動作がもっさりすることもあります。Headersが付いています。Webサーバーからの応答ヘッダー情報の集まりです。Headers内に「キャッシュ動作に関するヘッダー」が含まれていて、それに従います。この「キャッシュ動作に関するヘッダー」設定はWebサーバー側で行います。【Webサイト高速化】ブラウザキャッシュについてまとめてみた引用させてもらいましたが、ブラウザキャッシュについて勉強になったサイトです。デザインが適応されないんだけど、というのはキャッシュが問題よく、CSSのデザインを変えたときに、「変えたところが反映されてない!」っていう現象が起きます。これは、前のCSSの情報をブラウザが保存していて、前の情報(CSS)でサイトをデザインしているから起きます。別原因のこともあるけどね。Cocoonでのブラウザキャッシュ設定方法このブラウザキャッシュに関しては、Cocoonの高速化設定のところでチェックを入れるだけで対応できます。簡単で、かつ相手のブラウザの保存容量依存に高速化が測れるのでいいですね。データは送る必要があるので、(たぶん)サーバー負担はそれほど軽くならない。処理が早くなるのはユーザー側のブラウザでの処理ですね。ちなみにブラウザキャッシュとCookieはどう違うのクッキーの場合は、個人を対象にしている感じですね。読者からすると、自分の情報をサイト側に提示して、「私、前に来たこういうものなんですけど」とクッキーを差し出しているイメージ。すると、サイト側は「はいはい、前の情報、とっておいてありますよ」という感じで、たとえばショッピングサイトだとカートの中に商品をとっておいてくれますね。スポンサーリンクCocoonユーザーが設定すべきキャッシュプラグインキャッシュを使うための方法として、プラグインを導入します。先ほど紹介したブラウザキャッシュの他にも、キャッシュは4種類あります。ブラウザのキャッシュ(CocoonでOK)ページのキャッシュ(サーバー側の処理)データベースのキャッシュ(サーバー側。ページキャッシュと天秤にかける)オブジェクトキャッシュ(今回はいじらない)Cocoonユーザーの我々がすべきことはページキャッシュとサーバーのデータベースキャッシュを作成することです。このふたつのキャッシュについても説明していきます。長い説明になったので、説明はいいやって方はそのままプラグイン導入に進んでください!クリックでCSSを表示ページキャッシュとDBキャッシュの違いこの辺りは私もあまりよくわかっていないというのが本音のところ。参照ページを参考にしていただきたい。私があえて記事にするのは、自分の理解度を整理するためである。何も知らない人が「へー」と思うくらいの知識量を提供しています。WordPressキャッシュプラグインを選ぶために知っておくべきことページキャッシュはコピー用紙を貼り付けておくイメージページキャッシュは、コピー済みの用紙を張り出しておくイメージだと私は思います。最近のWebページは、データが常に変動することを想定して作られています。新しい情報を常に更新し続けることで、動きのあるページ作りができます。同時に毎回ページを画面に映して、データが変動したらまた画面を叩き壊して新しい画面を用意するのは、かなり面倒です。(動的ページ)なので、ある時点のデータでページを作成し、コピーをとることにしました。何時間かおきに、コピー機で各ページのコピーを作ります(静的ページ)。これを貼り出しておくのが、キャッシュを有効にする、ということです。コピー用紙一枚ですむので、データ処理はほとんど必要ありません。これをそのまま読者は読み取ればいいので、楽チンですね。ページが更新されれば、本来なら新しくコピーをつくって貼り直す必要があります。コピー用紙なので、一度張り出されたままだと、読者は新しい情報があることも知らずに、そのコピー用紙の情報だけを読み取ることになります。データの更新頻度に合わせて、キャッシュを用意したり、あるいは投稿したとき、コメントなどのデータ変動があったときにキャッシュを作り直せると便利なわけです。データベースキャッシュはコピー機に指示が保存されているデータの更新が激しく、頻回にコピー機を動かす必要があるページもあります。コメントが多い掲示板や、実況系の記事、タイムセール情報などが考えられるでしょうか。いう場合は、コメントがあったり、記事を更新したりするときに、コピーが勝手に出力されると便利ですよね。その労力を軽量化し、変更のある部分を動的に動かすのが、データベースキャッシュになります。クエリをとっておいて、解決策を瞬時に弾き出す、というのがデータベースキャッシュになります。わけわかんないですね。「計算の公式を保存しておいて、数字が送られて来たら公式に当てはめて速攻で答案を作る」みたいなイメージでしょうか。高速化はするのですが、データをもらったら新しいコピー用紙を印刷する必要があるので、サーバーの負担がかかるようになるのが難点ですね。キャッシュの正しい使い方うちはほぼコメントのないブログなので、特に必要性は感じていません。投稿回数も週に1回くらい。月単位だと5本が精一杯ですね。データの変動はほとんどないので、自分が配信しているページのキャッシュさえあれば事足ります。「高校野球の実況掲示板をつくりたい」なんて方は、(そもそもキャッシュがいるのかも考えどころですが)ページキャッシュの設定を頻回にしたり、データベースキャッシュを利用したりするといいのかもしれません。いずれにせよ、サイトの特徴に合わせることが大事です。サーバーのデータベースキャッシュがいいのか、ページキャッシュがいいか、そもそも本当に必要か。各サイトの実測とデータ化して、何が最適なのかをみていく必要があると思います。くまながくなってしまった。今回使用したプラグインはこちら。全て無料サポートの範囲内で検証しています。簡単な特徴もこちらでチェック。Cache(Automattic社、シンプル、安心)以上の3つです。Cacheを使っています。Cache」っていうのが無料なのにえらく高機能で各所でお勧めされているのです。私も、おすすめプラグインとして紹介されていたので、導入はしていました。設定もおすすめされるがままにしていたのです。Insightsの点数は思わしくない。Cache」はアウトしました。Cocoon製作者の、我らがわいひらさんがこのプラグインについて解説した記事です。各ファイル(CSS,JS,HTML)の縮小化データベースキャッシュオブジェクトキャッシュ作成ブラウザキャッシュ作成CDN対応などなど、まぁとにかくいろいろあります。各項目に分かれているので、作りたいキャッシュだけ「Enable」チェックして使用していけば、自分好みに使えると思います。ある程度、自分のサイトにあった使い方がわかってから導入したほうがいいのかも。Cache」の悪いところ定期的に自分でキャッシュを消さないと溜まっていきます。今回自分の得点が悪かった原因はそこにあると思います。再利用する予定ではあるので、そのときレポートを追記します。最近、Twitterなんぞをみていると、このプラグインを使っている方が多いので私も使用してみました。このプラグインは、簡単・日本語、が特徴。日本語だろうが英語だろうが、意味がわからないなら調べるのがぶちくまです。それほど日本語対応はメリットに感じませんが、使ってみると、「たしかにこれは楽チンやわぁ」って感じです。Cacheの使い方まずは、日本語表記にしたほうがとっつきやすいですよね。全部が日本語に対応するわけではないので、いずれにせよ調べながら、になりますけどね。簡単に操作方法を見ていきましょう。薄い文字になっているのは有料版の機能です。Cacheの設定キャッシュこちらは有効にしておきましょう。いうかこれが目的です。ログインユーザーこれはチェックしておきましょう。ログインユーザーってのは、平たく言えば管理者のことです。管理者はキャッシュが繁栄しているのをまたずにサイトチェックが必要になるので、デザインいじったり、投稿した時は最新版でチェックするべきです。モバイルこちらはチェック不要。CocoonはレスポンシブデザインなのでモバイルもPCもデザインは一緒のはずです。モバイルに対してキャッシュをつくるべきなので、未チェックでお願いします。published「新しい投稿をしたらキャッシュをクリアする」という設定ですね。これは更新頻度との相談ですかね。updated「記事を更新したらキャッシュをクリアする」という設定出す。頻回な更新をしすぎると、それはそれでサーバー負荷になるので、この辺りもご自身の運営に合わせてください。Cocoonの圧縮と天秤にかけてもいいですが、重複機能はかえって重くなるうえにエラーの可能性もあるので。Cocoon以外のテーマで圧縮が必要な場合はチェックしてください。一応チェックしてます。Googleさん的にはやってほしいみたいです。効果の程は正直なんとも。ブラウザキャッシュ一応、未チェックです。cocoon高速化機能とダブる。Emojis絵文字カット機能です。無駄にダウンロードすることになるので、カットしてもいい。除去してくださいこんな感じです。微調整は各自でお願いします。Autoptimizeも使ってみるAutoptimizeはどちらかというとスクリプト圧縮系のプラグインなんで、Cocoonには不要かと思ったのですが、なぜか少し点数があがりました。mod_pagespeedでも圧縮されているはずなので、やや機能過多感はあるのですが、どうしてでしょうか。圧縮以外にも、スクリプトの適切な配置もしてくれているのでしょう。レンダリングブロックが回避できているのかもしれません(警告は消えませんでしたけどね)ちなみにレンダリングブロック回避のためにやったこと別記事になりますが、いろいろヘッダーからフッターに逃がすといいらしいですよ。配信を最適化」の処理に手を焼いているようでれば解決策として考えられるのがhead部分をきれいにすること。Insightsの得点をあげる奥の手としてプラグインを使って簡単に解決した方法をまとめています。buchikuma.xyz2018.08.04Autoptimizeはこんな人におすすめサイトスピード計測によって、「CSSやJavascript、HTMLを圧縮しろ」という警告を受けたら、適宜導入するのはいいかも。Cocoonユーザーであれば、機能が重なっていると思うので、レンダリングブロック回避だけなら別プラグインがいいと思います。Cacheを使うじゃあ、キャッシュだけできたらいいんでないの。「WordPress.com」の開発・運営元のAutomattic社なので、安定感と安心感は強い。これは本当にシンプルにキャッシュを定期的に作成してくれるって感じなのでいいのかな、と。Jetpackあたりとの相性も良い。Cacheでもサイト高速化は可能こちらも基本的にはシンプルなので使いやすい。昔からあるプラグインなので、設定方法についてもたくさんのサイトが参考になります。Cache」に移行されている方も多い。個人的に効果を比較した感じだと、こちらの方が使いやすいんじゃないか、と感じた部分があったので、これを導入しようと思いました。Cacheを導入いや、Superの方が良いと思ったんですよ。Fastestのチーターみたいな絵が少しださいなぁ、と思ったのと、Superの方がシンプルに感じたので。メインサイトをいじった時には、なぜかFastestの方が得点が上がったんですよね。広告やアフィリエイトの影響はあるんだと思うけど。チーターの絵を我慢しようと思います。スポンサーリンクキャッシュ系プラグインの注意点スクリプト圧縮系も合わせて、ですが。不具合というか、テーマと干渉することが多いので注意が必要です。幸いにして、今の所はCocoonを使用していて目立って不具合はないのですが、悪いことも起きています。キャッシュのタイミング次第で更新が反映されないこれはキャッシュをつくる宿命ですね。ログインしていればキャッシュが反映しないように設定すればキャッシュ(コピー)を見ずに反映結果をみることができるのですが。私は投稿後に「誤字・脱字」や「見出し」、「デザイン」、「行間」などをチェックします。この作業をスマホでやるんだけども(ユーザーはスマホ利用が多いので)、反映されないことがある。設定でキャッシュクリアをかけているのですが、ブラウザキャッシュが残るようになったりなんだか面倒になった。Cocoonの高速化機能だけでやりくりするのが一番シンプルでラクだな、と思った。Rinkerの表示がうまくいかない当サイトでは、物販系リンク作成ツールとして「Rinker」というプラグインを使用しています。このRinkerが表示されないことがちょくちょくあります。Rinker自体、それほど多用しているわけではないので、実害は少ないので放っておいてますが(おいおい)。キャッシュをつくるタイミングの問題で、うまく反映しないことがあるみたい。1日経つと治っているので、キャッシュの問題かと思います。カエレバの画像表示もうまくいかないRinkerと同様ですが、カエレバも画像取得がうまくいかないことがありますね。こちらはリンクボタンは生きているのですが、画像なし物販リンクを果たして踏んでくれる人がいるかどうか。私がメインで使っているのが「WPアソシエイトポストR2」なのです。今の所は、こちらは画像表示のエラーはないようですね。このプラグインが一番使いやすいので多用しています。結局Cocoon側で便利な物販リンク挿入ツールができたので、徐々にこちらに移行していこうかなとは思っています。Insightsの点数も上がる。不具合もあるからキャッシュ系プラグインを使わないで高速化できるにこしたことはない点数は無理にあげなくても困ってなければそれでいい更新チェックが面倒になったこんな感じですね。今はまだ使用していますが、正直、外したくて仕方がない気持ちにはなっています。確かにキャッシュができることで読み込みが異様に早くなったのは、点数だけじゃなく体感としても感じるところ。ユーザーとしては読みやすくなっているんだろうなとは思う。キャッシュクリアのタイミングなどを調整することで、ある程度の不便は解消できそうですし、もう少し使ってみようと思います。サイト高速化スポンサーリンクシェアするTwitterFacebookはてブPocketLINEコピーぶちくまをフォローするぶちくまぶちくま創作ベース関連記事サイト高速化CDN導入のためにJetpackとCloudflareを使った感想CDNを導入すべくJetpackとCloudflareを使ってみました。使用感でいうとJetpackはとにかく簡単で安定感あり。Cloudflareはかなり暴れ馬でめちゃくちゃ速くなったけどいろいろエラーは吐き出している。サーバーが落ちる可能性も考えると、どちらがいいかしっかりと考える必要がありそうです。配信を最適化」の処理に手を焼いているようでれば解決策として考えられるのがhead部分をきれいにすること。Insightsの得点をあげる奥の手としてプラグインを使って簡単に解決した方法をまとめています。2018.08.04サイト高速化Cocoonを高速化する際に必須の画像最適化方法|WPプラグイン画像最適化すればほとんどのサイトでページ表示を高速化できます。images」プラグインで簡単にできます。設定は簡単で、APIキーを取得して一括最適化をお願いするだけ。枚数制限があるので有料となるので、無料でできるお得な方法もまとめています。2018.08.05サイト高速化ブログ高速化のためにやった5つの方法|WordPressテーマはCocoonサイト高速化のためにやることはシンプルです。要は、画像を減らして圧縮する。これだけでほぼ解決します。体感速度はまったくトラブルなし。Insightsの評価は残酷なものです。なんとか、コードやカスタマイズ不要で高得点を出した記録を公開します。2018.08.05サイト高速化エックスサーバー利用者なら簡単にサイト高速化ができる方法を伝授!サイトを高速化するために、エックスサーバーのmod_pagespeedの設定をONにしました。2クリックでできる、最も簡単な方法だと思います。画像を多用してわかりやすいように解説しています。Insightsの点数がだいたい5点くらい上がるようなイメージです。コメントをキャンセルメールアドレスが公開されることはありません。コメントデータの処理方法の詳細はこちらをご覧ください。Cacheを導入Headをすっきりさせて読み込みを早くするお勧めのWPプラグインエックスサーバー利用者なら簡単にサイト高速化ができる方法を伝授!CDN導入のためにJetpackとCloudflareを使った感想オススメの記事CocoonのカスタマイズをするならCocoonカスタマイズは初心者でも簡単にできる【おすすめ一覧】サイト高速化の手引きブログ高速化のためにやった5つの方法|WordPressテーマはCocoon記事の検索プロフィールぶちくまぶちくま:白いもふもふの毛皮を被った医療系社畜兼ブロガー。Cacheを導入Headをすっきりさせて読み込みを早くするお勧めのWPプラグインエックスサーバー利用者なら簡単にサイト高速化ができる方法を伝授!CDN導入のためにJetpackとCloudflareを使った感想オススメの記事CocoonのカスタマイズをするならCocoonカスタマイズは初心者でも簡単にできる【おすすめ一覧】サイト高速化の手引きブログ高速化のためにやった5つの方法|WordPressテーマはCocoon記事の検索プロフィールぶちくまぶちくま:白いもふもふの毛皮を被った医療系社畜兼ブロガー。「遊びを副業に変える」をモットーに、ブログで情報を発信してます!詳しいプロフィールはこちら!ぶちくまをフォローする人気のある記事アークナイツの課金アイテムをまとめる【買ってはいけない】2020.01.242020.01.31幻影戦争の装備・武器クラフトについて知りたい2019.12.062020.02.21ブレイドエクスロードの適正パーティーの組み方2019.11.012020.02.11アルカラストの効率的な育成手順【素材もないし金もない】2019.08.182020.01.28アルカ・ラストの最強パーティを決めたい【無課金】2019.10.24応援クリック大歓迎!人気ブログランキングにほんブログ村フォローボタンぶちくまをフォローするカテゴリーイラスト2ゲーム176FFBE幻影戦争12KHUx6TEPPEN12ぷよぷよクエスト4アルカラスト8アークナイツ10アートオブコンクエスト18ゼノンザード10デュエルリンクス28ドラガリアロスト3ドラクエライバルズ1ハンドレッドソウル8ブラウンダスト12ブレイドエクスロード10ヴァルキリーアナトミア6最果てのバベル28ブログ52Cocoon19カスタマイズ2サイト高速化6Simplicity4Xeory2ブログ運営15WordPress5スパルタブログ論2収益化5副業のすすめ13ゲームライター6動画配信2読書2小説1漫画1音楽3リスニング2スポンサーリンクタイトルとURLをコピーしました。