SWELLを高速化設定するコツ【サイトが遅い理由と速くする方法7選】

2021 8/06

2021.07.11 2021.08.06

SWELLを高速化したい
サイトが遅い理由と速くするコツが知りたい
現実世界では早漏なのにブログが遅い

上記の悩みに答えます。

本記事の内容はつぎのとおりです。

サイトが遅い理由
SWELLの高速化設定はいらない理由
SWELL高速化のコツ7選
モバイルサイトスピードを「90以上」にする方法

結論。SWELLの高速化設定は不要です。

なぜかというと、SWELLは素ではやいから。

本サイト(ブログボーイ)のサイトスピードはモバイルで「88」。

100に近いほど速い表示が早いサイトです。

本サイトはSWELL(スウェル)をつかっていますが。

SWELL独自の高速化設定はしてまいせん。

ただし、サーバーはConoHaWING(コノハウィング)をつかっています。

ConoHaWINGとSWELLの組み合わせは素ではやいです。

繰り返しですが、SWELLの高速化設定は不要。

本記事では現状既にサイトスピードが遅くて悩んでいるひと向けにSWELLの高速化のコツを解説します。

あわせて読みたい

【WordPressテーマの正解】SWELLの評判と口コミ【メリット7選とデメリット】美しさとつかいやすさを極めたWordPressテーマ「SWELL」のメリットとデメリットを解説します。初心者におすすめのWordPressテーマNo.1。プログラミングやWEBデザイの知識は一切不要です。

サイトが遅い理由

サイトが遅い理由は大きく分けると2つです。

サイトが遅い理由

データ量が多い
読み込みスクリプトが多い

特に画像のデータ量がサイトスピードに影響していることは間違いありません。

画像はできるだけ小さく軽くしましょ。

また、スクリプトが多いと読み込み時間が増えるのは事実でして。

PHPとかCSSにHTMLの記述が多いとサイトは遅くなります。

スクリプトとは、台本、脚本、原稿、手書き、筆記体などの意味を持つ英単語。ITの分野では簡易なコンピュータプログラムをスクリプトと呼ぶことが多い。
引用：IT用語辞典 e-Words

WordPressであるあるなのがプラグインの入れすぎによるスクリプトの増加。

単純に、素の状態に近いほどサイトスピードはあがります。

ブログガール

カスタマイズするときは本当に必要な機能か精査しないといけないのね。

SWELLの高速化設定はいらない理由

サイトスピードはPageSpeed Insightsなら無料で計測可能。

しかし、PageSpeed Insightsは計測タイミングによって上下2ポイントくらいブレます。

正味。サイトスピード88なのでもう十分なのですが。

SWELLの高速化設定を試したところ91～93くらいにはなりました。

とはいえ。設定したことでSWELL(サイト)自体に負荷がかかっているのは事実でして。

ぶっちゃげ表示が遅くなる設定もありました。

ブログボーイ

高速化設定することでサイトに負荷がかかるなら本末転倒かと。。

詳しく解説しますね。

キャッシュ機能

SWELLはSWELL設定>高速化画面から高速化設定ができます。

SWELLのキャッシュ機能は、管理者側がサイトを表示させてキャッシュを作成すれば他のユーザーが初めて訪れた時でもキャッシュデータを利用できる機能です。

キャッシュとは、訪問した “ ウェブページの情報 ” を一時的に保存する仕組み（またはその一時的なデータそのもの）のことで、よく訪問するページの表示スピードが上がるというメリットがある。ページを表示する際には、そのページのデータをダウンロードする必要があるが、画像やテキスト情報など、キャッシュという一時的な保存データがスマホやPC内にあることで、再表示のスピードが上がるというわけだ。
引用：TIME＆SPACERSS by KDDI

キャッシュ機能すべてにチェックを入れた本サイト(ブログボーイ)はサイトスピードが「88 → 91」に改善されました。

SWELLの高速化機能はいらないなんていってごめんなさい。

とはいえ。キャッシュ機能を導入した直後はサイトスピードが一瞬「78」までさがったんですよね。

やはり何かしらサイトに負荷はかかってると思います。

ブログボーイ

「10以上」スピード改善されるなら、キャッシュ機能はONにしましょ。

現在、本サイト(ブログボーイ)はスマホ開閉メニューをキャッシュする以外にチェックを入れています。

遅延読み込み機能

遅延読み込み機能はフッターなど「ページの初回表示時には見えないエリア」をページの読み込み完了後に挿入することができる機能です。

サイトスピードはかなり改善されました。

とはいえ。リスクもあります。

遅延読み込みされるパーツ内に含まれるウィジェットでは、ページ分岐処理は無効となります。例えば、フッターに設置している人気記事ウィジェットを「トップページで非表示」に設定していたとしても、この機能を使っている場合はトップページでも表示されてしまうので注意してください。
引用：SWELL公式サイト

「遅延読み込みさせる」というスクリプトはサイトへの負担が大きいです。

僕の感想ですが。遅延読み込み機能は使用しなくてもいいかと。

ページ遷移高速化機能

ページ遷移高速化機能はファーストビューに影響しません。

あくまでページからページに移動する場合の速度を上げるものです。

むしろ読み込むスクリプトが増えるので初回の表示速度は遅くなる場合があります。

むしろ読み込むデータが増えるので初回の表示速度は遅くなる場合があります。 — ページ遷移高速化機能設定あと

ページ遷移高速化機能はおすすめできません。

SWELLのCSSをインラインで読み込む

CSSをインラインで読み込むことでサイトスピードが改善される可能性はあります。

とはいえ。そこまで大きく改善される項目ではありません。

インライン読み込みにはデメリットもあります。

インラインでCSSを書くと後からまとめてデザインを変更したいときに非常に面倒です。なぜなら、タグ内のCSSをいちいち書き直す必要があるからです。コードを書くのがウマイ人は、ほとんどインラインでは書きません。
引用：サルワカ

「なにをいってるのかさっぱりわからん」ってひとは設定する必要はありません。

詳しくはサルワカさんのCSSはどこに書く？外部CSSファイルの読み込み方＆インラインでの書き方という記事で解説されています。

SWELL高速化のコツ7選

SWELLを高速化するコツを解説します。

画像は幅640ピクセルに統一

画像は小さいサイズに変更してアップロードしましょ。

単純に幅ピクセルが小さいほど画像は軽くなります。

ブログボーイ

本サイトはアイキャッチ画像も幅640ピクセルです。

幅はWindowsのペイントでも変更可能。

一括でピクセル変更するなら画像リサイズツールを使いましょ。

サルワカ道具箱

画像サイズ変更ツール｜JPEG・PNG画像を一括で縮小！ブラウザ上で使える画像サイズ縮小ツールです。複数の画像をまとめてリサイズすることもできます。JPEG、PNG、GIFに対応。

画像は圧縮してかからアップロード

画像は圧縮してからアップロードしましょ。

おすすめはTinyPNGです。

あわせて読みたい

TinyPNG – Compress WebP, PNG and JPEG images intelligently Free online image compressor for faster websites! Reduce the file size of your WEBP, JPEG, and PNG images with TinyPNG’s smart lossy compression engine.

画像圧縮系のプラグインは不要です。