WEBサイトの高速化 のバックアップ(No.5)

• バックアップ一覧
• 差分 を表示
• 現在との差分 を表示
• ソース を表示
• WEBサイトの高速化 へ行く。
  • 1 (2017-10-03 (火) 13:35:55)
  • 2 (2017-10-03 (火) 13:47:50)
  • 3 (2017-10-03 (火) 23:57:55)
  • 4 (2017-10-04 (水) 10:13:15)
  • 5 (2017-10-04 (水) 14:13:15)
  • 6 (2017-10-14 (土) 13:17:48)

---

Linuxめも

WEBページをいかに早く表示させるかは大事なことです。
Googleもランクの評価に採用しているようなので、PageSpeed Insightsで85点以上を目指して対策を進めます。

CSSを縮小する †

スタイルシートの記述から余分なスペース、改行、インデントなどの文字を取り除いてファイルサイズを抑えます。

PageSpeed Insightsで分析すると下の方に
このページ向けに最適化された画像、JavaScript、CSS リソースをダウンロードできます。
とリンクが表示されるので、そちらをダウンロードして差し替えると楽ちんです。

JavaScript を縮小する †

CSSと同様の考えです。

圧縮を有効にする †

WEBサーバからブラウザへデータを送信する際にgzip圧縮をかけて転送量を抑えます。 別ページを参照して下さい。

Apacheでコンテンツ圧縮

画像を最適化する †

JPGやPNG画像は最適化することで見た目の質を落とさずに容量を抑えることができます。

無料サイトを利用する †

無料で利用できるサービスには TinyPNG が有名所のようです。
ドラッグ&ドロップで簡単に最適化することができます。

ツールを利用する †

PageSpeed Insightsでは以下のツールが紹介されています。

JPG

• jpegtran
• jpegoptim

PNG

• OptiPNG
• PNGOUT

jpegtranの使用方法 †

CentOSであればlibjpegが入っていれば使えるようです。
CentOS7の場合は

# yum install libjpeg-turbo-utils

メタデータを削除し、ハフマンテーブルを最適化して別ファイルに書き出す場合。

$ jpegtran -copy none -optimize a.jpg > b.jpg

同じファイル名で上書きする場合。

$ jpegtran -copy none -optimize -oufile a.jpg a.jpg

まとめて処理する場合。

$ find ./ -name "*.jpg" -type f -exec jpegtran -copy none -optimize -outfile {} {} \;

OptiPNGの使用方法 †

CentOSであればyumでインストールできます。

# yum install optipng