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

Lambda@Edgeを利用したサードパーティJavaScriptのカナリアリリース / Ca...

Avatar for Edward Fox Edward Fox
May 28, 2021
Technology
0
91

Lambda@Edgeを利用したサードパーティJavaScriptのカナリアリリース / Canary release using Lamdba@Edge

2021-05-28 @AWS Dev Alliance

Avatar for Edward Fox

Edward Fox

May 28, 2021
Tweet

More Decks by Edward Fox

See All by Edward Fox
Priorityを制するものはローディングを制す
Avatar for Edward Fox edwardkenfox
4
700
AWS re:Invent 2019 / Hackathon for Good 参加録
Avatar for Edward Fox edwardkenfox
2
570
Repro basketball club
Avatar for Edward Fox edwardkenfox
0
240
Introduction to UX Optimizer
Avatar for Edward Fox edwardkenfox
0
99
フロントエンド開発の落とし穴 / Fallacies of Client Side Programming (2019ver)
Avatar for Edward Fox edwardkenfox
0
320
僕とprototypeとJSONで / Me and prototype down by the JSON
Avatar for Edward Fox edwardkenfox
0
130
クライアントサイド開発の落とし穴 / Fallacies of Client Side Programming
Avatar for Edward Fox edwardkenfox
0
430
Beacon API ことはじめ 〜そしてkeepalive fetchへ〜 / Beacon API The Basics
Avatar for Edward Fox edwardkenfox
0
1.1k
window.windowとは何か / What is window window
Avatar for Edward Fox edwardkenfox
1
220

Other Decks in Technology

See All in Technology
大規模イベントを支える ABEMA の アーキテクチャ 変遷 2025
Avatar for Katsutoshi Nagaoka nagapad
4
410
AI エンジニアの立場からみた、AI コーディング時代の開発の品質向上の取り組みと妄想
Avatar for Soh Ohara soh9834
8
560
claude codeでPrompt Engineering
Avatar for いおりん iori0311
0
520
DatabricksのOLTPデータベース『Lakebase』に詳しくなろう！
Avatar for Takeru Ino inoutk
0
160
M365アカウント侵害時の初動対応
Avatar for LHazy lhazy
7
5k
新規事業におけるAIリサーチの活用例
Avatar for Lanli Ran ranxxx
0
170
AI駆動開発 with MixLeap Study【大阪支部 #3】
Avatar for LINEヤフーTech (LY Corporation Tech) lycorptech_jp
PRO
0
260
ecspressoの設計思想に至る道 / sekkeinight2025
Avatar for FUJIWARA Shunichiro fujiwara3
12
2k
機械学習を「社会実装」するということ 2025年夏版 / Social Implementation of Machine Learning July 2025 Version
Avatar for Moe Uchiike（内池 もえ） moepy_stats
1
1.4k
Turn Your Community into a Fundraising Catalyst for Black Philanthropy Month
Avatar for Auctria auctria
PRO
0
180
Bliki (ja), and the Cathedral, and the Bazaar
Avatar for Koichi ITO koic
8
1.5k
ObsidianをLLM時代のナレッジベースに！ クリッピング→Markdown→CLI連携の実践
Avatar for Reiki Hattori srvhat09
7
9.6k

Featured

See All Featured
ReactJS: Keep Simple. Everything can be a component!
Avatar for Pedro Nauck pedronauck
667
120k
Unsuck your backbone
Avatar for Amy Palamountain ammeep
671
58k
Music & Morning Musume
Avatar for Bryan Veloso bryan
46
6.7k
CoffeeScript is Beautiful & I Never Want to Write Plain JavaScript Again
Avatar for Sam Stephenson sstephenson
161
15k
Optimising Largest Contentful Paint
Avatar for Harry Roberts csswizardry
37
3.4k
The Myth of the Modular Monolith - Day 2 Keynote - Rails World 2024
Avatar for Eileen M. Uchitelle eileencodes
26
2.9k
Six Lessons from altMBA
Avatar for Skipper Chong Warson skipperchong
28
3.9k
Facilitating Awesome Meetings
Avatar for Lara Hogan lara
54
6.5k
Speed Design
Avatar for Sergey Chernyshev sergeychernyshev
32
1k
ピンチをチャンスに：未来をつくるプロダクトロードマップ #pmconf2020
Avatar for Aki / @LoveIdahoBurger aki_iinuma
126
53k
Site-Speed That Sticks
Avatar for Harry Roberts csswizardry
10
720
Docker and Python
Avatar for Tania Allard trallard
45
3.5k

Transcript

  1. Lambda@Edge Λར༻ͨ͠ αʔυύʔςΟJavaScriptͷ ΧφϦΞϦϦʔε Edward Fox 2021/05/28 @AWS Dev Alliance

  2. @edwardkenfox Edward Fox ɾΤϯδχΞ @ Reproגࣜձࣾ ɾWEBʗϒϥ΢βٕज़શൠɺ෼ࢄॲཧ ɾόεέɺϏʔϧɺӉ஦ 2/52

  3. ࠓ೔࿩͢͜ͱ: Lambda@Edge Λར༻͠ ҆શͳܗͰϦϦʔε͕Ͱ͖Δ Α͏ʹͳͬͨ࿩ 3/52

  4. ࠓ೔࿩͞ͳ͍͜ͱ: Lambda@Edge ͷػೳ঺հ ͳͲ 4/52

  5. 1. αʔυύʔςΟJavaScriptͱ͸ 2. ϦϦʔεͷ໰୊఺ 3. ΧφϦΞϦϦʔε ͱ͸ 4. Lambda@Edge Ͱͷ࣮ݱํ๏

    5. ݁Ռ 6. AWS ͞Μ΁ͷཁ๬ 5/52

  6. 1. αʔυύʔςΟJavaScriptͱ͸ 2. ϦϦʔεͷ໰୊఺ 3. ΧφϦΞϦϦʔε ͱ͸ 4. Lambda@Edge Ͱͷ࣮ݱํ๏

    5. ݁Ռ 6. AWS ͞Μ΁ͷཁ๬

  7. αΠτʹຒΊࠐΜͰ΋Β͍ σʔλΛऩूͨ͠Γૹ৴͢Δ αʔυύʔςΟͷJavaScriptίʔυɻ Google Analyticsʹ୅ද͞ΕΔΑ͏ͳ λά΍޿ࠂܭଌπʔϧ͕͜Εʹ͋ͨΔ 7/52

  8. ※ ฐࣾͰఏڙ͍ͯ͠Δ αʔυύʔςΟJavaScript ͸ Web SDKͱ΋ݺ͹Ε͍ͯ·͢ 8/52

  9. ※ ࣮ࡍͷ΋ͷͱ͸ҟͳΓ·͢

  10. Web SDK ʹมߋ͕͋Δͨͼʹ ϦϦʔεΛ࣮ࢪ͢Δ͕ repro-sdk.min.js ͸ৗʹ ࠷৽όʔδϣϯΛࢀর͢Δ 10/52

  11. None

  12. 1. αʔυύʔςΟJavaScriptͱ͸ 2. ϦϦʔεͷ໰୊఺ 3. ΧφϦΞϦϦʔε ͱ͸ 4. Lambda@Edge Ͱͷ࣮ݱํ๏

    5. ݁Ռ 6. AWS ͞Μ΁ͷཁ๬

  13. ৽͍͠όʔδϣϯΛϦϦʔε ͢Δͱ ଈ࣌͢΂ͯͷ ΫϥΠΞϯτͰಈ࡞Λ࢝ΊΔ 13/52

  14. 👍 ɾ໰୊͕͋ͬͨΒ͙͢ʹؾ෇͚Δ 👎 ɾ໰୊͕͋ͬͨͱ͖ͷඃ֐͕ਙେ 14/52

  15. ڪාͷҰٿೖࠢϦϦʔε 😇 15/52

  16. ༷ʑͳϒϥ΢β΍΢ΣϒαΠτͰ ಈ࡞͢ΔαʔυύʔςΟ JavaScriptͱ͍͏ੑ࣭తʹɺ ΫϥΠΞϯτґଘͰى͖Δ໰୊Λ ͢΂ͯࣄલʹ༧ଌ͢Δ͜ͱ͸ࠔ೉

  17. => ຊ൪ʹग़ͯ͠Έͳ͍ͱ ෼͔Βͳ͍ɻ Ͱ΋ͳΔ΂҆͘શʹग़͍ͨ͠ 17/52

  18. ͦΜͳͱ͖ͷͨΊͷ ΧφϦΞϦϦʔε 🐧 🐧 🐧 18/52

  19. 1. αʔυύʔςΟJavaScriptͱ͸ 2. ϦϦʔεͷ໰୊఺ 3. ΧφϦΞϦϦʔε ͱ͸ 4. Lambda@Edge Ͱͷ࣮ݱํ๏

    5. ݁Ռ 6. AWS ͞Μ΁ͷཁ๬

  20. https://martinfowler.com/bliki/ CanaryRelease.html ͔ΒҾ༻ 20/52

  21. 1. 2. 3.

  22. 22/52

  23. Web SDKʹ͓͚Δ ΧφϦΞϦϦʔεͷཁ݅ 23/52

  24. 1. Web SDKʹର͢ΔτϥϑΟοΫશମʹରͯ͠ ภΓͳ͘৽چόʔδϣϯΛ෼ࢄ͍ͤͨ͞ 2. ΫϥΠΞϯτ͝ͱʹ͸৽چόʔδϣϯΛ ͲͪΒ͔ʹݻఆ͍ͤͨ͞ 3. ৽چόʔδϣϯͷৼΓ෼͚ͷׂ߹Λࢦఆ ͍ͨ͠ɻ·ͨঃʑʹׂ߹Λม͍͑ͨɻ

    24/52

  25. 1. αʔυύʔςΟJavaScriptͱ͸ 2. ϦϦʔεͷ໰୊఺ 3. ΧφϦΞϦϦʔε ͱ͸ 4. Lambda@Edge Ͱͷ࣮ݱํ๏

    5. ݁Ռ 6. AWS ͞Μ΁ͷཁ๬

  26. 26/52

  27. 27/52

  28. None

  29. 1. αʔυύʔςΟJavaScriptͱ͸ 2. ϦϦʔεͷ໰୊఺ 3. ΧφϦΞϦϦʔε ͱ͸ 4. Lambda@Edge Ͱͷ࣮ݱํ๏

    5. ݁Ռ 6. AWS ͞Μ΁ͷཁ๬

  30. 1. Web SDKʹର͢ΔτϥϑΟοΫશମʹରͯ͠ ภΓͳ͘৽چόʔδϣϯΛ෼ࢄ͍ͤͨ͞ 2. ΫϥΠΞϯτ͝ͱʹ͸৽چόʔδϣϯΛ ͲͪΒ͔ʹݻఆ͍ͤͨ͞ 3. ৽چόʔδϣϯͷৼΓ෼͚ͷׂ߹Λ ࢦఆ͍ͨ͠ɻ·ͨঃʑʹׂ߹Λม͍͑ͨɻ

    30/52

  31. 1. Web SDKʹର͢ΔτϥϑΟοΫશମʹରͯ͠ ภΓͳ͘৽چόʔδϣϯΛ෼ࢄ͍ͤͨ͞ 2. ΫϥΠΞϯτ͝ͱʹ͸৽چόʔδϣϯΛ ͲͪΒ͔ʹݻఆ͍ͤͨ͞ 3. ৽چόʔδϣϯͷৼΓ෼͚ͷׂ߹Λ ࢦఆ͍ͨ͠ɻ·ͨঃʑʹׂ߹Λม͍͑ͨɻ

    30/52 👌👌👌

  32. 1. Web SDKʹର͢ΔτϥϑΟοΫશମʹରͯ͠ ภΓͳ͘৽چόʔδϣϯΛ෼ࢄ͍ͤͨ͞ 2. ΫϥΠΞϯτ͝ͱʹ͸৽چόʔδϣϯΛ ͲͪΒ͔ʹݻఆ͍ͤͨ͞ 3. ৽چόʔδϣϯͷৼΓ෼͚ͷׂ߹Λ ࢦఆ͍ͨ͠ɻ·ͨঃʑʹׂ߹Λม͍͑ͨɻ

    30/52 👌👌👌 👌👌

  33. 1. Web SDKʹର͢ΔτϥϑΟοΫશମʹରͯ͠ ภΓͳ͘৽چόʔδϣϯΛ෼ࢄ͍ͤͨ͞ 2. ΫϥΠΞϯτ͝ͱʹ͸৽چόʔδϣϯΛ ͲͪΒ͔ʹݻఆ͍ͤͨ͞ 3. ৽چόʔδϣϯͷৼΓ෼͚ͷׂ߹Λ ࢦఆ͍ͨ͠ɻ·ͨঃʑʹׂ߹Λม͍͑ͨɻ

    30/52 👌👌👌 👌👌 👌

  34. 1. αʔυύʔςΟJavaScriptͱ͸ 2. ϦϦʔεͷ໰୊఺ 3. ΧφϦΞϦϦʔε ͱ͸ 4. Lambda@Edge Ͱͷ࣮ݱํ๏

    5. ݁Ռ 6. AWS ͞Μ΁ͷཁ๬
  35. None
  36. None

  37. ຖճίʔυΛॻ͖׵͑ͳ͚Ε͹ ͍͚ͳ͍ͷ͸໘౗ 37/52

  38. => ͦ͏ͩɺ؀ڥม਺Λ࢖͓͏ 38/52

  39. None
  40. None
  41. None
  42. None

  43. 😱 😱 😱 43/52

  44. ཁ๬1: ؀ڥม਺ͷαϙʔτ 🙏 44/52

  45. None
  46. None
  47. None

  48. 🤔 🤔 🤔 48/52

  49. ཁ๬2: UIͷվળ 🙏 49/52

  50. ·ͱΊ 50/52

  51. ɾLambda@Edge Λར༻ͯ͠ΧφϦΞ ϦϦʔεΛ࣮ݱ͠ɺ҆৺ɾ҆શͳܗͰ ϦϦʔεΛ࣮ࢪͰ͖ΔΑ͏ʹͳͬͨ ɾ͜ΕҎ֎ʹ΋ Lambda@Edge ͸ଟ͘ͷ Ϣʔεέʔεʹ࢖͑ΔػೳͳͷͰɺ ࠓޙ΋ՄೳੑΛ୳͍͖͍ͬͯͨ 51/52

  52. ׬ 52/52

  53. We are hiring!

  54. None
  55. None
  56. None