[レポート] CTD207: CDN とサイトの性能を計測するために：モニタリング、ログ、解析ツール #reinvent

先日開催されました AWS re:Invent 2018 より下記セッションをレポートします。セッションの拝聴はできなかったのですが、公開された資料をもとにお送りします。

なお本セッションは少人数向けの「Builders Session」ということで動画の公開はありません。また後半はハンズオン形式になっています。こちらで紹介する内容は、スライド資料の内容をハンズオン資料の内容で補足したものとなっております。

セッションタイトル

• CTD207 - Use Monitoring, Logs, and Analytics Tools to Measure CDN and Site Performance

概要

セッション概要より抄訳：
このセッションでは、Webサイトパフォーマンスを計測し向上させるために、CloudFrontログとメトリクスの使い方とツール - CloudWatchやサードパーティ製ツールなど - を紹介します

In this session, use metrics and logs from Amazon CloudFront, and tools such as Amazon CloudWatch and third-party performance measurement tools, to measure and improve your web and mobile performance.

Speaker

• Karan Desai - Solutions Architect, AWS
• Hongmin Liu - SW Dev Engineer, AWS
• Karthik Uthaman - SW Dev Engineer, AWS

資料

• ハンズオン資料 : https://cloudfront.reinvent2018.com/docs/ctd207_instructions.docx
  • ※リンク先 Word ドキュメント

内容

ここで学べること

• サイトの性能を計測するためにどのメトリクスを使う？
• CDNパフォーマンスを解析するためにどんなツールが使える？
• CloudFrontのログを、Amazon Athenaを使って読み進めるには
• CDNパフォーマンスを、Amazon QuickSightを使って可視化するには

CDNパフォーマンスを計測するメトリクス

• CDN メトリクス
  • キャッシュヒットレート
    • CDNがどのくらいのリクエストを抑えたか
    • ヒット、ミス、再読込によるヒット
  • レイテンシ
    • あるオブジェクトがダウンロード完了するまでにかかった時間
    • キャッシュヒット時とミス時を比較
  • エラー
    • 接続性の問題
    • ユーザによる切断（Abandoned）

計測するためのツール

• ビルトインメトリクス
  • キャッシュ統計
  • 良くアクセスされる(Popular)オブジェクト
  • 利用率
  • Viewer demographics

• CloudFront アクセスログ
  • timeToDownload
  • キャッシュヒット / ミス
  • エラー

• サードパーティツール
  • Codexis
  • WebPageTest

CloudFrontディストリビューション設定の最適化

• 現実的な TTL を使う
  • オリジンにて Cache-Control max-age を設定
• クエリ文字列の最適化
  • 大文字・小文字
  • パラメータのリストは毎回同じ順番になるように
    • キャッシュキーを再利用するため
    • 参考 : Lambda@Edge で CloudFront キャッシュヒット率を向上させるんや！ ｜ DevelopersIO
• クッキーのオリジンへの転送 (Forward cookies) は必要最小限に
  • リクエスト + クッキーのコンビを減らす
  • 静的・動的コンテンツは Behavior を分離する
• どのヘッダをオリジンに転送するか厳選する

ハンズオン資料より：

• Origin Keep-alive Timeout: 10へ
• Default Cache Behavior 設定
  • Maximum TTL : 36400 ( 1 日)
  • Default TTL : 3600 ( 1 時間)
• JPG画像のための Cache Behavior 設定
  • Path Pattern: images/*.jpg
  • Object Caching: Customize
  • Minimum TTL: 60 ( 1 分)
  • Maximum TTL: 31536000 (default - 1年)
  • Default TTL: 86400 (default - 1日)

ログからパフォーマンスの指標を引き出す

• Amazon Athena を使用
• CloudFront ディストリビューションでアクセスログを有効化
• ログはS3バケットに保存される

ハンズオン資料より：

• Athena の Query エディタページにて、CloudFrontログのためのテーブルを作成する

CREATE EXTERNAL TABLE IF NOT EXISTS default.cloudfront_logs (
`date` DATE,
time STRING,
location STRING,
bytes BIGINT,
requestip STRING,
method STRING,
host STRING,
uri STRING,
status INT,
referrer STRING,
useragent STRING,
querystring STRING,
cookie STRING,
resulttype STRING,
requestid STRING,
hostheader STRING,
requestprotocol STRING,
requestbytes BIGINT,
timetaken FLOAT,
xforwardedfor STRING,
sslprotocol STRING,
sslcipher STRING,
responseresulttype STRING,
httpversion STRING,
filestatus STRING,
encryptedfields INT
)
ROW FORMAT DELIMITED
FIELDS TERMINATED BY '\t'
LOCATION 's3://dkaran.com-replica/cf-logs/'
TBLPROPERTIES ( 'skip.header.line.count'='2' )

• 作成したテーブルに対して、JPG画像へのリクエスト（ダウンロードにかかった時間順）をクエリ

SELECT date,
time,
location,
requestip,
uri,
resulttype,
requestprotocol,
requestbytes,
timetaken
FROM "default"."cloudfront_logs"
WHERE uri LIKE '%jpg%'
ORDER BY timetaken DESC limit 50;

• どのファイルが最もダウンロードに時間がかかっているかが分かる
• どの地域のユーザが遅いダウンロードタイムに直面しているかが分かる
  • 都市名はエアポートコードで記されている
• キャッシュミスした場合の平均的なダウンロード時間をクエリする

SELECT uri,
AVG(timetaken) AS downloadtime
FROM "default"."cloudfront_logs"
WHERE uri LIKE '%jpg%'
AND resulttype = 'Miss'
GROUP BY uri
ORDER BY downloadtime DESC;

• キャッシュヒット時とミス時で、どの程度のダウンロード時間の差があったかを比較

SELECT uri,
AVG(timetaken) AS avg_downloadtime,
resulttype
FROM "default"."cloudfront_logs"
WHERE uri LIKE '%jpg%'
AND resulttype IN ('Hit', 'Miss')
GROUP BY uri, resulttype
ORDER BY uri;

• 他にどんなクエリが書けるか考えてみよう

Amazon QuickSight によるCDNパフォーマンスの可視化

• Athenaテーブルからデータを取得
• グラフに合うようにデータタイプを自動認識

ハンズオン資料より：

• Amazon QuickSight > New Analysis > New data set
  • データソースに「Athena」を選択
  • テーブル名 cloudfront_logs を選択して「Visualize」
• 異なる二ヶ所のエッジロケーションの平均ダウンロード時間を比較する visualization を作成
  • Visual types から「vertical bar chart」を選択
  • フィールドリストから Field wells へドラッグする：
    • X axis: location
    • Value: timetaken (Average へ変更)
    • Color: resulttype
  • 該当 visualization にフィルタを追加する
    • resulttype を Hit と Miss だけにする
• 別の visualization を作成： +Add > Add visual
  • 「line chart」を選択
    • X axis: date
    • Value: timetaken (Average へ変更)
    • Color: resulttype
  • 先月一ヶ月にわたり、CloudFrontとオリジンの平均ダウンロードタイムが可視化される

参考リソース

• Measuring CloudFront Performance
  https://aws.amazon.com/blogs/networking-and-content-delivery/measuring-cloudfront-performance/
• Dynamic Whole Site Delivery with Amazon CloudFront
  https://aws.amazon.com/blogs/networking-and-content-delivery/dynamic-whole-site-delivery-with-amazon-cloudfront/
• Querying Amazon CloudFront Logs with Athena
  https://docs.aws.amazon.com/athena/latest/ug/cloudfront-logs.html

所感

CloudFront を利用するにあたり、Athena、QuickSight を使う上で基本的なところが押さえられたセッションでした。ハンズオン資料も丁寧にまとまってますので、これらを使ったことがない方は是非挑戦してみてください。