Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Fastly Meetup 3 / More about Ingestly
Search
Hajime Sano
October 31, 2019
Technology
0
650
Fastly Meetup 3 / More about Ingestly
Fastly YAMAGOYA 2019の翌週ということで、YAMAGOYAの続きのような感じでIngestlyについてお話ししました。今回は具体的なクエリー例と、少し苦労話をご紹介しました。
Hajime Sano
October 31, 2019
Tweet
Share
More Decks by Hajime Sano
See All by Hajime Sano
メディア企業のデータエンジニアリング ~ 内製化と文化醸成 ~ NIKKEI TECH TALK #2
hsano
0
1.1k
Compute@Edge で機械学習モデルを動かす
hsano
1
340
顧客理解のための挑戦とは? (1st PartyData SHIFT〜Treasure Dataが提供するWebアナリティクスの高度化〜)
hsano
0
420
Measuring the performance. Let’s own your analytics tool.
hsano
2
2.7k
Other Decks in Technology
See All in Technology
テストを書かないためのテスト/ Tests for not writing tests
sinsoku
1
160
Amazon Q Developerで.NET Frameworkプロジェクトをモダナイズしてみた
kenichirokimura
1
160
The future we create with our own MVV
matsukurou
0
1.8k
最近のSfM手法まとめ - COLMAP / GLOMAPを中心に -
kwchrk
8
1.8k
When Windows Meets Kubernetes…
pichuang
0
270
大規模言語モデルとそのソフトウェア開発に向けた応用 (2024年版)
kazato
2
500
KMP with Crashlytics
sansantech
PRO
0
130
3年でバックエンドエンジニアが5倍に増えても破綻しなかったアーキテクチャ そして、これから / Software architecture that scales even with a 5x increase in backend engineers in 3 years
euglena1215
11
4.3k
「隙間家具OSS」に至る道/Fujiwara Tech Conference 2025
fujiwara3
4
140
コロプラのオンボーディングを採用から語りたい
colopl
2
310
20240522 - 躍遷創作理念 @ PicCollage Workshop
dpys
0
310
ソフトウェア開発における「パーフェクトな意思決定」/Perfect Decision-Making in Software Development
yayoi_dd
2
2.7k
Featured
See All Featured
StorybookのUI Testing Handbookを読んだ
zakiyama
28
5.4k
Six Lessons from altMBA
skipperchong
27
3.5k
Making the Leap to Tech Lead
cromwellryan
133
9k
The Myth of the Modular Monolith - Day 2 Keynote - Rails World 2024
eileencodes
19
2.3k
"I'm Feeling Lucky" - Building Great Search Experiences for Today's Users (#IAC19)
danielanewman
226
22k
The MySQL Ecosystem @ GitHub 2015
samlambert
250
12k
A better future with KSS
kneath
238
17k
How to Ace a Technical Interview
jacobian
276
23k
Dealing with People You Can't Stand - Big Design 2015
cassininazir
365
25k
Build The Right Thing And Hit Your Dates
maggiecrowley
33
2.5k
Optimizing for Happiness
mojombo
376
70k
Build your cross-platform service in a week with App Engine
jlugia
229
18k
Transcript
Fastly User Meetup #3 More about Ingestly Hajime Sano, Project
Lead at Ingestly A maintanance free open-source real-time web analytics tool.
2 YAMAGOYA お疲れ様でした!
3 自己紹介 • Digital Analytics & Data Marketing advocate •
Ingestlyプロジェクトを仕切ってます • リアルタイムなマーケティングデータ分析とデータ活用を 組織的に取り組む文化を広めたい • エンジニアリングとビジネスのバランス • アナリティクス原理主義 ◦ SiteTracker ◦ Omniture SiteCatalyst / Adobe Analytics ◦ Atlas ◦ Ingestly / Polytrek Hajime Sano @hjmsano hsano.jp hajime.dev
4 お話しすること 1. Webパフォーマンスに関するクエリー例 2. sendBeaconの落とし穴 3. Fastly Log Streaming
に対する要望
5 その前に、少し振り返り
Ingestly → Realtime Web Analytics 6 JS SDK Custom VCL
Logging Schema Mapping • sendBeaconでデータ送信 • Server-Side 1st Party Cookieをセット • HTTP 204 / No Contentを即答 • ログをJSON化 • BQまたはESにフィード • 適切な型で保存 • イベントから1秒程度で クエリー可能
計測できること 7 • 通常のページビュー • クリック • スクロール深度 • 読了
• Video/Audio のハートビート • Real User Monitoring • 任意のイベント ページ ◀ ▶ https://www. ページ ◀ ▶ https://www. 40% 100% ページ ページ 本文 ◀ ▶ https://www. 25% 100% 本文 ◀ ▶ https://www. スクロール深度 読了
8 インフラや環境 ユーザー行動 ビジネス上の成果 RUMとその先の効果測定 コスト効率のような視点 従来のウェブアナリティクス Webパフォーマンス測定と改善の意義
Google Analytics っぽい? • YAMAGOYAの後、「GAっぽいもんか」というツイートを見てしまった… • 既製品との違い ◦ 全てのシステムは「自社で持つ」、あくまでファーストパーティ ◦
任意の変数も含め、サンプリング無しに全データがリアルタイムに扱える ◦ DBの選択肢が豊富で、DBの良いとこどりできる ◦ 可視化を持たないので普段使ってるBIで直接扱える ◦ 生データを扱うが低コストかつメンテナンスフリー 9
10 Webパフォーマンスに関するクエリー例
前提としてID体系を… 11 Ingestly ID = ブラウザ識別 Root ID = ナビゲーション毎のID
Request ID = レコードのユニークID Action = 動詞 Category = 目的語 Request ID = レコードのユニークID Action = 動詞 Category = 目的語 • 1PVごとに複数レコー ドが記録される • Action と Category の組 み合わせがイベントの 意味を持つ • セッションの概念は無 い(ユーザーの行動と 関係無いという考え)
単純な時間別PVとUUはこんんな感じ 12
サイト全体のDCLまでの平均ミリ秒 13
トップページのDCLまでの時間を時系列で 14
DOM Completeまでの時間とスクロール深度 15
DOM Completeまでの時間とクリック率 16
• ページが意味を成す状態までロードされたタイミングで、 Ingestly.trackAction(‘track’, ‘meaningful_paint’, {}) を呼ぶ • クエリー時に timing_elapsed_ms を用いることで、first
meaningful paint まで の時間を使った分析が可能 さらに… 17
18 sendBeaconの落とし穴
sendBeaconって? • https://www.w3.org/TR/beacon/#sec-sendBeacon-method • 宛先に対してPOSTでデータを送る、計測目的の通信に使うAPI • Documentがhiddenになる場合でも全てのビーコンリクエストを即時送信する ようにUser Agentはスケジュールしなければならない •
レスポンスコールバック無し 19
サポートしているブラウザ 20
Webkitのバグ • アクセスしたことの無いドメイン に、sendBeaconでHTTPS通信しよ うとすると、見えないところでエ ラーして何も送信されない • iOS13で直った模様 21 https://bugs.webkit.org/show_bug.cgi?id=193508
IngestlyのSDKは、ローカルにIDがあればsendBeaconを使うが、無ければFetchを使いエンドポイントに ID有無を確認するので、初めて通信するドメインに対してはFetchが先行するのでOK。
64KB制限 • sendBeaconで送れるデータは64KBまで ◦ ブラウザによって実装が異なり、1リクエスト64KBだったり、ナビゲーション中の合計が 64KBだったり ◦ ボディだけでなくヘッダーも含めなので、リクエストURLの長さも影響する • 上限に達すると
navigator.sendBeaconはfalseを返す ◦ IngestlyのSDKの場合、falseが戻ったらFetchまたはXHRで送り直す 22
Fetchもなかなかくせ者で… • タイムアウト処理が無かったような? ◦ Fetchが使えるようになりはじめた2016年〜2017年ごろ、タイムアウトはPromiseとsetTimeout で実装するのが主流だったような…? • FetchとAbortControllerは対応ブラウザが違う… ◦ 最近はAbortControllerを使ったタイムアウト処理が広まっている
23 Fetch Abort Controller
24 Fastly Log Streaming に対する要望
書き出した履歴を確認したい • Fastlyから各ストリーミング先に描き出したログを見たい • 「ログのログ」 • スロットリングを受けたとか、接続できなかったとか、何件中何件失敗した とか… 25
S3とKafkaの Log Format枠を大きくして欲しい • Log Formatは、BigQueryと Elasticsearchの場合、TEXTAREAにな っていてJSONを扱いやすい • S3とKafkaもJSONで書き出して使え
るが、INPUT-textになっていて難し さがある… • TEXTAREAにして頂いて、ログ記録 時に改行を除くようなオプション があると便利だと思う 26 つい最近、S3経由Athenaにも対応しました https://github.com/ingestly/ingestly-endpoint/tree/master/S3 Thanks @mrtec_y
ストリーミング先を追加して欲しい • ストリームデータ ◦ Google Cloud PubSub ◦ Amazon Kinesis
Stream • メッセージキュー ◦ Amazon SQS ◦ MQTTとか? 27 BigQueryやS3に入れる前にデータの加工をしたり、 API参照してPre-Joinしたりするのに使いたい SQSのようにキャパを気にせず投入できるとログ の受取と後処理を分離できて良さそう
28 Questions?