講師はサイバーエージェントのあほむ@ahomuさんでした。
内容
Web ページはなぜ遅くなるのか
どのように調査、そして改善をすればいいのか
速い Web ページを維持するために何ができるか
本セミナーではこのようなテーマについて講義とワークショップを通し、次の日から現場で活かすための足がかりとなる考え方とノウハウをお伝えします。
詳細は省きますが、ざっくり次のような流れで学びました。
- セミナー前半
- 「Webページの速度」についての基本（考え方/ページロード・ランタイム/クライアント環境など）
- 高速化ポイントのセルフチェック（Chrome Devtoolsの各機能、Lighthouse、WebPagetestなど）
- ページロードを遅くする頻出原因（HTML返却/画像/キャッシュ/圧縮/レンダリングブロックなど）
- グループワーク
- パフォーマンスがよろしくないサイトについて、 ボトルネックの調査/改善アクションの考察/実行計画検討 をやる
- セミナー後半
- ページロード速度の運用（考え方/目標値）と定常計測（Real User Monitering/Synthetic Monitoring）
Googleスライドをあらかじめ共有いただき、解説では動画まで盛り込まれていて充実した内容でした！
不明点は直接コメントしてOK、という配慮もありがたかったです。
なぜ参加したのか
サイトのパフォーマンスやユーザービリティの向上に興味はあるものの、その根本的なロジックをちゃんと知らないし、学ぶにも何から手を出したら良いのかわからない…。こんな私にはきっとちょうど良い機会だと思い参加しました。
よかったこと
- サイト高速化のポイントや、具体的な調査・改善の流れについて大まかにイメージができた
- 初めて聞いたキーワードや聞いただけだとピンときていない話については、今回をきっかけに少し深掘りしたい
- Chrome Devtoolsの触れたことのなかった一部機能について使い方を知ることができた
- 中でも特に、Coverage でそのページで利用していないCSS/JSを調査できるのが便利そう
- Lighthouseについて存在は知っていたが、そこから得られるデータをどう捉え活かしたら良いのか少しイメージが湧いた
- Page Speed Insightsとの違いがなるほどだった
今回の内容について
Webページの高速化について、あほむさんの著書「超速! Webページ速度改善ガイド ── 使いやすさは「速さ」から始まる (WEB+DB PRESS plus)」でより詳しく解説されているとのこと。
ちなみに今回LTされた方の中に、その実践事例をかなり具体的に紹介してくださった方がいらっしゃって、これまたナルホドな内容でした。
えー、#wcan 前座LT枠で参加させて頂いたものですが、ご静聴ありがとうござました。機会くれた森田さんどうもアリガトウ！スライドはこちらです。https://t.co/APOhrX1Ufx ちょっとだけ紹介させて頂いた超簡単な圧縮結果比較ツールもP11にリンクあるんで興味あったらたどってください〜。
— junkjunctions/kaave (@junkjunctions) 2018年9月15日
終わりに
＿人人人人人人人人人人人人人人＿
— ろくぜうどん (@rokuzeudon) 2018年9月15日
＞ Webページは早い方がいい！ ＜
￣Y^Y^Y^Y^Y^Y^Y^Y^Y^Y^Y^Y^Y^Y^￣#wcan
登壇されたあほむさん、運営・協賛のみなさま、どうもありがとうございました。