GoogleのPageSpeedInsightsで、修正個所としてJavaScriptおよびCSSのリソース縮小を指摘されました。
自サイトで、まだ圧縮していなかったファイルがあり、それを指摘されたようです。
まず、JavaScriptの圧縮には、以前より「Packer」を使用しています。
Packerは、圧縮とともに難読化もしてくれるので便利です。
cssのリソースの縮小には、Googleのヘルプでも紹介されている「YUI Compressor」を使用しています。
YUI Compressorは、本来ダウンロードしてJavaで実行して使用するものですが、使い方がよくわからないので、YUI Compressorを使用していると言ってもオンラインで使用できる下記サイトを利用しています。
Online YUI Compressorの使い方
Online YUI Compressorは、cssおよびJavaScriptどちらも圧縮でき、JavaScriptは難読化もしてくれます。
Online YUI Compressorは英文ですので、GoogleのChromeなどで開いて、日本語に翻訳して使用するといいかと思います。
[Code]に圧縮したいcssもしくはJavaScriptのコードをペーストし、[ File Type]でファイルの種類を指定し、[Compress]ボタンをクリックするだけです。
オプションは、好みに応じて選択しますが、おもなものとして以下のようなものがあります。
Insert a line break after the specified column number. →（空欄に）指定した列番号の後に改行を挿入JavaScript Options
Minify only, no symbol obfuscation. →縮小のみ行い難読化しない。
CSS Options
Insert a line breaks after ‘}’ characters. →セレクタの後に改行を挿入します。
圧縮後のコードは、オプションのRedirect Optionsで[No redirect]を選択した場合は、[Compress]ボタンの下に以下のように表示されます。
[Download Compressed File]ボタンをクリックするとブラウザにコードが表示されますので、それをコピペします。
[Download Gzipped Compressed File]ボタンをクリックすると、gzippedファイル形式でダウンロードできます。
ちなみにオプションの[Redirect to output]を選択すると、[Download Compressed File]をクリックしたのと同様で、[Redirect to gzipped output]を選択すると、[Download Gzipped Compressed File]をクリックしたのと同様の入手方法になります。
このOnline YUI Compressorなのですが、表示速度が遅いときがあります。
重いときは全く開けないということもあります。
そこで、それに代わるものと思い検索してみたところ、同じくオンラインでYUI Compressorを使用できる下記サイトを見つけました。
http://99webtools.com/yui-compressor.php
使用方法は、上記Online YUI Compressorと同様です。
その他、Googleのヘルプで紹介されているもう一つの圧縮ツールとして「cssmin.js」というのがあります。
ページ中の「online demo」を開いてみると、以下のページに移動します。
http://tools.w3clubs.com/cssmin/
「Source」の入力ボックスにcssの中身をコピペし、「crunch」ボタンを押すと「Result」に圧縮後のcssが吐き出されます。
cssの圧縮自体、改行やコメント、空白、インデントなどを取り除くだけですので、どちらのツールを使ってもそれほど圧縮率は変わりないようです。
いずれのツールも私の環境下では問題なく使えましたが、ご使用の際は、ファイルのバックアップを取り、テストを行うなどご自身の判断で使用ください。
さて、PageSpeedInsightsでの再分析結果ですが、圧縮後、指摘箇所は無事クリアできました。