Upgrade to Pro — share decks privately, control downloads, hide ads and more …

一部のユーザーに開発版スクリプトを配信する - Fastly を使ったカナリアリリース

Avatar for Hajime Shiozawa Hajime Shiozawa
August 01, 2023
Technology
710
0

一部のユーザーに開発版スクリプトを配信する - Fastly を使ったカナリアリリース

Avatar for Hajime Shiozawa

Hajime Shiozawa

August 01, 2023

Other Decks in Technology

See All in Technology
Platform Engineering as a Product: Criteria for Improvement and Multi-Tenant Design
Avatar for Kumo Ishikawa kumorn5s
0
510
protovalidate-es を導入してみた
Avatar for 弁護士ドットコム bengo4com
0
130
生成 AI × MCP で切り拓く次世代 SRE！自律型運用への挑戦と開発者体験の進化
Avatar for _awache _awache
0
160
AI活用を推進するために ファインディが下した、一つの小さな決断
Avatar for starfish719 starfish719
0
250
Unlocking the Apps
Avatar for Tim Perry pimterry
0
240
トークン数だけでは測れない — Claude Code 組織展開の効果検証から学んだこと
Avatar for Masaki Kubota makikub
0
130
AIを「創る」と「使う」の循環 — HRテックが実践するリアルなAI組織実装
Avatar for Taketo Sasaki taketo957
0
1.7k
Agentic Defenseとともにセキュリティエンジニアが輝き続けるには / How Security Engineers Can Keep Excelling with Agentic Defense
Avatar for Yuji Oshima yuj1osm
0
110
Platform engineering for developers, architects & the rest of us (AI agents)
Avatar for danielbryantuk danielbryantuk
0
180
Mastering Ruby Box
Avatar for Satoshi Tagomori tagomoris
3
150
AI Engineering Summit Tokyo 2026 AIの前に、やることがある 〜医療データ企業の4フェーズ〜
Avatar for Daisuke Taniwaki dtaniwaki
0
2k
AIにフローを作らせようとして挫折した話
Avatar for 濱津 太一｜ユースフル hamatsutaichi
0
200

Featured

See All Featured
Design and Strategy: How to Deal with People Who Don’t "Get" Design
Avatar for Morgane Peng morganepeng
133
19k
Let's Do A Bunch of Simple Stuff to Make Websites Faster
Avatar for Chris Coyier chriscoyier
508
140k
Scaling GitHub
Avatar for Zach Holman holman
464
140k
Prompt Engineering for Job Search
Avatar for Mfonobong Umondia mfonobong
0
330
How To Stay Up To Date on Web Technology
Avatar for Chris Coyier chriscoyier
790
250k
How to Align SEO within the Product Triangle To Get 
Buy-In & Support - #RIMC
Avatar for Aleyda Solis aleyda
2
1.5k
The MySQL Ecosystem @ GitHub 2015
Avatar for Sam Lambert samlambert
251
13k
Leveraging LLMs for student feedback in introductory data science courses - posit::conf(2025)
Avatar for Mine Cetinkaya-Rundel minecr
1
280
HU Berlin: Industrial-Strength Natural Language Processing with spaCy and Prodigy
Avatar for Ines Montani inesmontani
PRO
0
400
Winning Ecommerce Organic Search in an AI Era - #searchnstuff2025
Avatar for Aleyda Solis aleyda
1
2k
GraphQLとの向き合い方2022年版
Avatar for Yosuke Kurami quramy
50
15k
Tell your own story through comics
Avatar for letsgokoyo letsgokoyo
1
950

Transcript

  1. 　　｜　　© PLAID Inc. 2023.8.1　｜　　3rdparty.js #1 　｜　 1 ⼀部のユーザーに開発版スクリプトを配信する Fastly を使ったカナリアリリース

  2. 2023.8.1　　｜　 3rdparty.js #1　　｜　 　　｜　　© PLAID Inc. 2 しおざわ はじめ Hajime

    Shiozawa Github : @hshiozawa 株式会社プレイドのエンジニア 主にプロダクト基盤の開発をやってます • 解析エンジン Blitz の開発 • 新しい埋め込みタグ Edge の開発

  3. 2023.8.1　　｜　　3rdparty.js #1　　｜　 　　｜　　© PLAID Inc. 3 カナリアリリースをできるようにしよう 新機能を開発したから、新しいスクリプトの検証がしたい！ でも、検証環境だとシンプルなテストデータしか⼊ってない いきなり本番環境にはリリースはできない･･･

  4. 2023.8.1　　｜　　3rdparty.js #1　　｜　 　　｜　　© PLAID Inc.   4

  5. 2023.8.1　　｜　　3rdparty.js #1　　｜　 　　｜　　© PLAID Inc. 5

  6. 2023.8.1　　｜　　3rdparty.js #1　　｜　 　　｜　　© PLAID Inc. 6 考えるべきポイント KARTE の埋め込みスクリプトのアーキテクチャ

  7. 2023.8.1　　｜　　3rdparty.js #1　　｜　 　　｜　　© PLAID Inc. 7 1 埋め込みスクリプトの URL は変えない

  8. 2023.8.1　　｜　　3rdparty.js #1　　｜　 　　｜　　© PLAID Inc. 8 2 クライアントごとに配信スクリプトが異なる

  9. 2023.8.1　　｜　　3rdparty.js #1　　｜　 　　｜　　© PLAID Inc. 9 3 クライアントが設定を変えると、スクリプトを再ビルド スクリプトを ビルドするサーバ

  10. 2023.8.1　　｜　　3rdparty.js #1　　｜　 　　｜　　© PLAID Inc. 10 4 スクリプトへの修正は、全スクリプトの再ビルドが必要

  11. 2023.8.1　　｜　　3rdparty.js #1　　｜　 　　｜　　© PLAID Inc. 11   1. 配信スクリプトは同じ URL

    2. クライアントごとに違うスクリプト URL 3. クライアントが設定を変えると、スクリプトを再ビルド 4. スクリプトの修正は、全スクリプトの再ビルドが必要 ポイント

  12. 2023.8.1　　｜　　3rdparty.js #1　　｜　 　　｜　　© PLAID Inc. 12 カナリアリリースを実現する

  13. 2023.8.1　　｜　　3rdparty.js #1　　｜　 　　｜　　© PLAID Inc. 13 Fastly VCL を使う  1.

    配信スクリプトは同じ URL  2. クライアントごとに違うスクリプト URL を解決する

  14. 2023.8.1　　｜　　3rdparty.js #1　　｜　 　　｜　　© PLAID Inc. 14  

  15. 2023.8.1　　｜　　3rdparty.js #1　　｜　 　　｜　　© PLAID Inc. 15   Cookie を付与して Fastly

    の VCL で カナリー環境に振り分け Cookie を付与 VCL で振り分け

  16. 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; } }

  17. 2023.8.1　　｜　　3rdparty.js #1　　｜　 　　｜　　© PLAID Inc. 17 リクエストごとにビルドする  3. クライアントが設定を変えると、スクリプトを再ビルド  4.

    スクリプトの修正は、全スクリプトの再ビルドが必要 を解決する

  18. 2023.8.1　　｜　　3rdparty.js #1　　｜　 　　｜　　© PLAID Inc. 18   カナリー環境はリクエストに応じてスクリプトをビルドする 多少⻑めにキャッシュ 毎リクエストビルド

  19. 2023.8.1　　｜　　3rdparty.js #1　　｜　 　　｜　　© PLAID Inc. 19   全体像

  20. 2023.8.1　　｜　　3rdparty.js #1　　｜　 　　｜　　© PLAID Inc. 20  

  21. 2023.8.1　　｜　　3rdparty.js #1　　｜　 　　｜　　© PLAID Inc. 　 21 まとめ＆感想 埋め込みスクリプトのカナリアリリース 環境の振り分けに

    Fastly VCL を使う スクリプトは毎回ビルドしてる CDN にロジックを組めるのは便利 Edge Computing をもっと組み込みたい   💡  💡 
  22. None