Skip to main content

ハイパフォーマンスWebサイト

―高速サイトを実現する14のルール

[cover photo]
TOPICS
Web , HTML/CSS
発行年月日
PRINT LENGTH
184
ISBN
978-4-87311-361-6
原書
High Performance Web Sites
FORMAT
Print PDF
Ebook
1,980円
Ebookを購入する
Print
1,980円
書籍のご注文はオーム社サイトへ

米Yahoo!のパフォーマンス担当責任者が導き出した「高速サイトを実現する14のルール」を実例とともに紹介します。サイトの高速化と聞くと、サーバ負荷分散などバックエンドで実施する大掛かりなパフォーマンスチューニングを思い浮かべますが、じつは待ち時間の80％はフロントエンドの処理に費やされています。ここで紹介する明解なルールに従いさえすれば、この時間を大幅に削減できるのです。本書では、ブラウザとサーバの通信の仕組みからわかりやすく解説し、14のルールに従うことでなぜ高速化できるのかを論理的に解明しています。

翻訳者によるサポートページ。

目次

訳者まえがき
本書に対する賞賛の声
推薦の言葉
まえがき
　
A章　フロントエンドのパフォーマンスの重要性
	A.1　ウェブページのパフォーマンスを追跡する
	A.2　時間はどこで使われたのか？
	A.3　パフォーマンス改善の鉄則

B章　HTTPの概要
	B.1　圧縮
	B.2　条件付きGETリクエスト
	B.3　Expiresヘッダ
	B.4　Keep-Alive
	B.5　参考資料

1章　ルール1：HTTPリクエストを減らす
	1.1　イメージマップ
	1.2　CSSスプライト
	1.3　インライン画像
	1.4　スクリプトおよびスタイルシートの結合
	1.5　まとめ

2章　ルール2：CDNを使う
	2.1　コンテンツデリバリネットワーク
	2.2　節減の効果

3章　ルール3：Expiresヘッダを設定する
	3.1　Expiresヘッダ
	3.2　max-ageとmod_expires
	3.3　キャッシュの有無の比較
	3.4　画像以外にも適用可能
	3.5　ファイル名にバージョンを付加する
	3.6　例

4章　ルール4：コンポーネントをgzipする
	4.1　圧縮の通知
	4.2　圧縮の対象
	4.3　圧縮による減量
	4.4　圧縮の設定
		4.4.1　Apache 1.3の場合（mod_gzip）
		4.4.2　Apache 2.xの場合（mod_deflate）
	4.5　プロキシによるキャッシュ
	4.6　エッジケース
	4.7　gzipの効果

5章　ルール5：スタイルシートは先頭に置く
	5.1　プログレッシブ・レンダリング
	5.2　sleep.cgi
	5.3　「からっぽの白い画面」現象
		5.3.1　CSSがページの最後にある場合
		5.3.2　CSSがページの最初にある場合
	5.4　「FOUC」現象
	5.5　フロントエンド・エンジニアはどうすべきか

6章　ルール6：スクリプトは最後に置く
	6.1　スクリプトに関する問題
	6.2　並列ダウンロード
	6.3　スクリプトによってダウンロードが中断される場合
	6.4　最悪のケース：スクリプトが一番上で読み込まれる場合
	6.5　最善のケース：スクリプトが一番下で指定されている場合
	6.6　まとめ

7章　ルール7：CSS expressionの使用を控える
	7.1　CSS expressionによる更新処理
	7.2　問題への対処
		7.2.1　1回限りのCSS expression
		7.2.2　イベントハンドラ
	7.3　まとめ

8章　ルール8：JavaScriptとCSSは外部ファイル化する
	8.1　インラインか外部ファイルか
		8.1.1　単純な比較ではインラインの方が速い
		8.1.2　ページビュー
		8.1.3　キャッシュが空かキャッシュ済みか
		8.1.4　コンポーネントの再利用
	8.2　実際のサイトにおける典型的な例
	8.3　ホームページ
	8.4　両方のよいところをとる
		8.4.1　onload後にダウンロード
		8.4.2　動的なインライン化

9章　ルール9：DNSルックアップを減らす
	9.1　DNSのキャッシュとTTL
		9.1.1　DNSキャッシュに影響を与える要因
		9.1.2　TTL値
	9.2　ブラウザの視点から見たDNSキャッシュ
		9.2.1　Internet Explorer
		9.2.2　Firefox
	9.3　DNSルックアップ回数の削減

10章　ルール10：JavaScriptを縮小化する
	10.1　縮小化
	10.2　難読化
	10.3　削減効果
	10.4　例
	10.5　補足事項
		10.5.1　インラインスクリプト
		10.5.2　gzipと縮小化
		10.5.3　CSSの縮小化

11章　ルール11：リダイレクトを避ける
	11.1　リダイレクトの種類
	11.2　リダイレクトによるパフォーマンスの低下
	11.3　リダイレクトの代替策
		11.3.1　末尾のスラッシュの欠如
		11.3.2　ウェブサイトの連結
		11.3.3　内部トラフィックの追跡
		11.3.4　外向きトラフィックの追跡
		11.3.5　覚えやすいURL

12章　ルール12：スクリプトを重複させない
	12.1　スクリプトの重複は起こりがち
	12.2　スクリプトの重複によるパフォーマンス低下
	12.3　スクリプトの重複を防ぐ

13章　ルール13：ETagの設定を変更する
	13.1　ETagとは何か
		13.1.1　Expiresヘッダ
		13.1.2　条件付きGETリクエスト
		13.1.3　最終更新日
		13.1.4　エンティティタグ（ETag）
	13.2　ETagの問題点
	13.3　ETagは使い込むか削除する
	13.4　ETagの使用実態

14章　ルール14：Ajaxをキャッシュ可能にする
	14.1　Web 2.0とDHTMLとAjaxの関係
		14.1.1　Web 2.0
		14.1.2　DHTML
		14.1.3　Ajax
	14.2　非同期ならば必ず速いか
	14.3　Ajaxリクエストの最適化
	14.4　Ajaxをキャッシュ可能にする具体的方法
		14.4.1　Yahoo! メール
		14.4.2　Googleスプレッドシート

15章　米国トップ10サイトの分析
	15.1　ページ容量、応答時間、YSlow評価
	15.2　ページ評価の方法
	15.3　Amazon
	15.4　AOL
	15.5　CNN
	15.6　eBay
	15.7　Google
	15.8　MSN
	15.9　MySpace
	15.10　Wikipedia
	15.11　Yahoo!
	15.12　YouTube

索引

関連書籍

RESTful Webサービス