WordPress - Page Speedを参考にフロントエンドのパフォーマンスチューニング

GoogleのPage Speed

htmlのコーディングルールやキャッシュの設定など、サイトを作成するときに、毎回気をつけるポイントなので、覚えておいて損はないですね。「塵も積もれば山となる」です。

2012年9月4日現在のPage Speedでピックアップされる項目は全部で26個。各々の具体的な対応内容はタイトルをクリックすると確認できます。

について記述しています。

対応前の注意点

●外部サイトのAPIを利用している場合、Scoreを100点は無理

FacebookのいいねボタンやLikebox。Twitterのタイムライン表示など、外部サイトのAPI等を利用している場合は、全ての項目をクリアすることができませんので、無理なものは無理と割り切ってできるだけ対応していきましょう。

●HTMLの構文チェック

HTMLソースやCSSをいじり倒すので、対応が全て終わったら、HTMLの構文をチェックしましょう。

Nu Markup Validation Service

CSS Validation Service

Page Speedのいくつかの対応を効率的に行うのに、Head Cleanerが役に立ちます。

Page SpeedのアドオンをChromeに組み込むことができます。何度もチェックするツールなので、入れておくと便利です。

HTML

image