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 を使ったカナリーリリース
Search
Sponsored
·
SiteGround - Reliable hosting with speed, security, and support you can count on.
→
PLAID Tech
PRO
August 01, 2023
Technology
10
0
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
一部のユーザーに開発版スクリプトを配信する - Fastly を使ったカナリーリリース
https://3rdpartyjs.connpass.com/event/289558/
PLAID Tech
PRO
August 01, 2023
More Decks by PLAID Tech
See All by PLAID Tech
計測できないものは改善できない - CI Observabilityの実践
plaidtech
PRO
0
190
プレイドのユニークな技術とインターンのリアル
plaidtech
PRO
1
1.2k
データ民主化を加速する仕組み作り -BigQuery Sharing の活用-
plaidtech
PRO
0
600
サーバーサイドのビルド時間87倍高速化
plaidtech
PRO
0
1.1k
大量配信システムにおけるSLOの実践:「見えない」信頼性をSLOで可視化
plaidtech
PRO
1
3.1k
AI時代の開発生産性を加速させるアーキテクチャ設計
plaidtech
PRO
3
2.2k
積み上げられた技術資産と向き合いながら、プロダクトの信頼性をどう守るか
plaidtech
PRO
0
2.9k
Rollupのビルド時間高速化によるプレビュー表示速度改善とバンドラとASTを駆使したプロダクト開発の難しさ
plaidtech
PRO
1
390
早くて強い「リアルタイム解析基盤」から広げるマルチドメイン&プロダクト開発
plaidtech
PRO
1
620
Other Decks in Technology
See All in Technology
ここは地獄!つらい朝会を体験することで、チームとしてのより良い振る舞いに気づくワークショップ / The stand-up meeting from hell in the game industry
scrummasudar
0
210
複数プロダクトで進めるAI機能実装 ── 実践から得たリアルな学びとロードマップ実現への挑戦 / AICon2026_yanari
rakus_dev
1
270
AI工学特論: MLOps・継続的評価
asei
4
240
OPENLOGI Company Profile for engineer
hr01
1
74k
生成 AI 時代にいま一度「問い合わせ」について考えてみる
kazzpapa3
1
120
AmplifyHostingConstructからSSRフレームワークのためのホスティング設計を考察する/amplify-hosting-construct
fossamagna
1
290
プロダクト開発組織の現在地(Ver.2026/07) / product-organization
kaonavi
0
360
Network Firewallやっていき!
news_it_enj
0
260
凡エンジニアがこの先生きのこるためには。〜TypeScript完全に理解したい〜
alchemy1115
2
410
Amplify Gen2でbackend.tsにCDKを定義する/しない事によるCDKの挙動の違いとユースケース
smt7174
1
480
クラウドを使う側から、作る側へ / 大吉祥寺.pm 2026前夜祭
fujiwara3
4
1k
Aurora MySQL 8.4リリース! Rubyistが備えること / what-rubyist-should-prepare-for-aurora-mysql-8-4
fkmy
0
530
Featured
See All Featured
Producing Creativity
orderedlist
PRO
348
40k
Faster Mobile Websites
deanohume
310
32k
Become a Pro
speakerdeck
PRO
31
6k
What does AI have to do with Human Rights?
axbom
PRO
1
2.3k
Distributed Sagas: A Protocol for Coordinating Microservices
caitiem20
333
23k
How to Ace a Technical Interview
jacobian
281
24k
How Fast Is Fast Enough? [PerfNow 2025]
tammyeverts
3
660
Effective software design: The role of men in debugging patriarchy in IT @ Voxxed Days AMS
baasie
0
450
A Guide to Academic Writing Using Generative AI - A Workshop
ks91
PRO
1
350
Impact Scores and Hybrid Strategies: The future of link building
tamaranovitovic
0
340
Building AI with AI
inesmontani
PRO
1
1.1k
How To Speak Unicorn (iThemes Webinar)
marktimemedia
1
510
Transcript
| © PLAID Inc. 2023.8.1 | 3rdparty.js #1 | 1 ⼀部のユーザーに開発版スクリプトを配信する Fastly を使ったカナリアリリース
2023.8.1 | 3rdparty.js #1 | | © PLAID Inc. 2 しおざわ はじめ Hajime
Shiozawa Github : @hshiozawa 株式会社プレイドのエンジニア 主にプロダクト基盤の開発をやってます • 解析エンジン Blitz の開発 • 新しい埋め込みタグ Edge の開発
2023.8.1 | 3rdparty.js #1 | | © PLAID Inc. 3 カナリアリリースをできるようにしよう 新機能を開発したから、新しいスクリプトの検証がしたい! でも、検証環境だとシンプルなテストデータしか⼊ってない いきなり本番環境にはリリースはできない・・・
2023.8.1 | 3rdparty.js #1 | | © PLAID Inc. 4
2023.8.1 | 3rdparty.js #1 | | © PLAID Inc. 5
2023.8.1 | 3rdparty.js #1 | | © PLAID Inc. 6 考えるべきポイント KARTE の埋め込みスクリプトのアーキテクチャ
2023.8.1 | 3rdparty.js #1 | | © PLAID Inc. 7 1 埋め込みスクリプトの URL は変えない
2023.8.1 | 3rdparty.js #1 | | © PLAID Inc. 8 2 クライアントごとに配信スクリプトが異なる
2023.8.1 | 3rdparty.js #1 | | © PLAID Inc. 9 3 クライアントが設定を変えると、スクリプトを再ビルド スクリプトを ビルドするサーバ
2023.8.1 | 3rdparty.js #1 | | © PLAID Inc. 10 4 スクリプトへの修正は、全スクリプトの再ビルドが必要
2023.8.1 | 3rdparty.js #1 | | © PLAID Inc. 11 1. 配信スクリプトは同じ URL
2. クライアントごとに違うスクリプト URL 3. クライアントが設定を変えると、スクリプトを再ビルド 4. スクリプトの修正は、全スクリプトの再ビルドが必要 ポイント
2023.8.1 | 3rdparty.js #1 | | © PLAID Inc. 12 カナリアリリースを実現する
2023.8.1 | 3rdparty.js #1 | | © PLAID Inc. 13 Fastly VCL を使う 1.
配信スクリプトは同じ URL 2. クライアントごとに違うスクリプト URL を解決する
2023.8.1 | 3rdparty.js #1 | | © PLAID Inc. 14
2023.8.1 | 3rdparty.js #1 | | © PLAID Inc. 15 Cookie を付与して Fastly
の VCL で カナリー環境に振り分け Cookie を付与 VCL で振り分け
2023.8.1 | 3rdparty.js #1 | | © PLAID Inc. 16 sub vcl_recv {
if (req.http.Cookie ~ "new_feature" && req.url ~ "aaa") { # カナリア環境 set req.backend_hint = canary_release_backend; } else { # プロダクション環境 set req.backend_hint = production_backend; } }
2023.8.1 | 3rdparty.js #1 | | © PLAID Inc. 17 リクエストごとにビルドする 3. クライアントが設定を変えると、スクリプトを再ビルド 4.
スクリプトの修正は、全スクリプトの再ビルドが必要 を解決する
2023.8.1 | 3rdparty.js #1 | | © PLAID Inc. 18 カナリー環境はリクエストに応じてスクリプトをビルドする 多少⻑めにキャッシュ 毎リクエストビルド
2023.8.1 | 3rdparty.js #1 | | © PLAID Inc. 19 全体像
2023.8.1 | 3rdparty.js #1 | | © PLAID Inc. 20
2023.8.1 | 3rdparty.js #1 | | © PLAID Inc. 21 まとめ&感想 埋め込みスクリプトのカナリアリリース 環境の振り分けに
Fastly VCL を使う スクリプトは毎回ビルドしてる CDN にロジックを組めるのは便利 Edge Computing をもっと組み込みたい 💡 💡
None