「Web ページを高速化してユーザーに価値を届けたい制作者のためのセミナー」に参加しました

Updated

2022.10.15

Published

2018.09.17

講師はサイバーエージェントのあほむ@ahomuさんでした。
WCAN 2018/09/15「Web ページを高速化してユーザーに価値を届けたい制作者のためのセミナー&ワークショップ」 - WCAN | Doorkeeper

内容

• Web ページはなぜ遅くなるのか
• どのように調査、そして改善をすればいいのか
• 速い Web ページを維持するために何ができるか

本セミナーではこのようなテーマについて講義とワークショップを通し、次の日から現場で活かすための足がかりとなる考え方とノウハウをお伝えします。

詳細は省きますが、ざっくり次のような流れで学びました。

1. セミナー前半

  1. 「Webページの速度」についての基本(考え方/ページロード・ランタイム/クライアント環境など)

  2. 高速化ポイントのセルフチェック(Chrome Devtoolsの各機能、Lighthouse、WebPagetestなど)

  3. ページロードを遅くする頻出原因(HTML返却/画像/キャッシュ/圧縮/レンダリングブロックなど)

2. グループワーク

  • パフォーマンスがよろしくないサイトについて、 ボトルネックの調査/改善アクションの考察/実行計画検討 をやる

3. セミナー後半

  • ページロード速度の運用(考え方/目標値)と定常計測(Real User Monitering/Synthetic Monitoring)

Googleスライドをあらかじめ共有いただき、解説では動画まで盛り込まれていて充実した内容でした! 不明点は直接コメントしてOK、という配慮もありがたかったです。

なぜ参加したか

サイトのパフォーマンスやユーザービリティの向上に興味はあるものの、その根本的なロジックをちゃんと知らないし、学ぶにも何から手を出したら良いのかわからない…。こんな私にはきっとちょうど良い機会だと思い参加しました。

よかったこと

  • サイト高速化のポイントや、具体的な調査・改善の流れについて大まかにイメージができた。初めて聞いたキーワードや聞いただけだとピンときていない話については、今回をきっかけに少し深掘りしたい

  • Chrome Devtoolsの触れたことのなかった一部機能について使い方を知ることができた。中でも特に、Coverage でそのページで利用していないCSS/JSを調査できるのが便利そう

  • Lighthouseについて存在は知っていたが、そこから得られるデータをどう捉え活かしたら良いのか少しイメージが湧いた。Page Speed Insightsとの違いがなるほどだった

終わりに

Webページの高速化について、あほむさんの著書「超速! Webページ速度改善ガイド ── 使いやすさは「速さ」から始まる (WEB+DB PRESS plus)」でより詳しく解説されているとのこと。

ちなみに今回LTされた方の中に、その実践事例をかなり具体的に紹介してくださった方がいらっしゃって、これまたナルホドな内容でした。

登壇されたあほむさん、運営・協賛のみなさま、どうもありがとうございました。

関連リンク

ろくデブログ

「Web ページを高速化してユーザーに価値を届けたい制作者のためのセミナー」に参加しました

written by

Genta