超速! Webページ速度改善ガイド ──使いやすさは「速さ」から始まる

はじめに

この記事を読むのに必要な時間:およそ 1 分

『超速! Webページ速度改善ガイド ─⁠─ 使いやすさは「速さ」から始まる』p.ⅲより

本書では「超速!」と銘を打って,Webページの速度を改善するためのノウハウを紹介します。Webページの速度は,みなさんのビジネスにおけるWebの価値を大きく左右します。本書は,Webページの何が遅くて,どのように対応すれば速くなるのかを理解するために必要な体系的知識を提供し,開発者がWebページの速度を効率的に改善できるようにするために執筆しました。

Webページの速度は,Webフロントエンドで起きる出来事によってほとんどが決定されます。HTMLをネットワークから取得し,CSSや画像などのサブリソースの取得と評価を行い,そしてページをレンダリングするという一連の流れの中には,数多くの処理が含まれています。これは,たとえサーバサイドアプリケーションが高速であったとしても,それを台なしにしてしまうほどのインパクトを持っています。

Webフロントエンドの高速化は,向き合い続けなければならないテーマです。新しいデバイスや技術,表現が続々と登場する中で,不安定なモバイル通信でも,性能が低いデバイスでも安定して快適に動くWebページを提供することは,より多くのユーザーに使ってもらうために必要なことです。

Webフロントエンドを高速化するためには,継続的な計測と運用中の改善を通して,プロダクトと日常的に向き合うことが最も重要です。毎日のコンテンツ更新や運用による実装の変更,閲覧しているクライアント側の環境条件によっても,速度は常に変化します。これらをどのようにとらえ,調査から改善へのアクションに結び付けていくかを学ぶ必要があります。

本書では,ネットワーク処理,レンダリング処理,スクリプト処理の3つを取り上げ,これらを詳しく説明することでWebフロントエンドの高速化に関する知識を網羅します。各テーマについては,基礎知識の章と,実践的な問題の調査と改善の章の2本立てで解説を進めます。これにより,現実のプロダクトに対して,調査によって個別の問題に分解して把握する力と,それに対する適切な改善を実行する力を身に付けられます。また,Webページの速度に大きな影響を与える画像形式の解説や,高速化に役立つことが期待される新技術の解説も行います。

本書は,Webフロントエンド開発者だけでなく,すべてのWeb開発者にとって有用な1冊であることを確信しています。Webフロントエンドの高速化によって,ユーザー体験が広く向上することを願っています。

2017年11月 佐藤 歩
泉水 翔吾

謝辞

本書の執筆に際し,数多くの方々にレビューをしていただきました。

矢倉眞隆さんとJxckさんには,本書のテクニカルレビューをしていただきました。本書で扱っている広範なWeb技術の正確性および言及している内容について,多くの貴重なご意見をいただきました。

また,株式会社サイバーエージェントのFRESH!チームのみなさん,有限会社アップルップルのみなさん,谷拓樹さんには,草稿をレビューしていただき,多くのご指摘をもらいました。

本書の執筆は2016年の頭から始まり,約2年の期間を経て出版にいたりました。編集を担当していただいた株式会社技術評論社の稲尾尚徳さんには,⁠WEB+DB PRESS』の連載を含めると2014年半ばから約3年半もの間,拙い文章の校正に根気よく付き合っていただき,感謝の念に堪えません。

執筆に関わってくださったみなさん,本当にありがとうございました。著者両名,心より厚くお礼申し上げます。

著者プロフィール

佐藤歩(さとうあゆむ)

Webアプリケーション開発屋のあほむです。専門はWebフロントエンドのアーキテクチャ設計とパフォーマンス改善で,最近はWebのパフォーマンスとアクセシビリティの連続性に思いを馳せています。趣味は料理と温泉と二次元。

Twitter:@ahomu
GitHub:ahomu
URL:https://aho.mu/


泉水翔吾(せんすいしょうご)

SIerでのプログラマーを経てWeb業界に転職して以来,Web技術に没頭する日々を送っています。Web標準の動向やアーキテクチャの流行を追いかけつつ,技術啓蒙やOSS活動に励んでいます。

Twitter:@1000ch
GitHub:1000ch
URL:https://1000ch.net/