Lock in $30 Savings on PRO—Offer Ends Soon! ⏳

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

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

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
760
AWS re:Invent 2019 / Hackathon for Good 参加録
Avatar for Edward Fox edwardkenfox
2
590
Repro basketball club
Avatar for Edward Fox edwardkenfox
0
260
Introduction to UX Optimizer
Avatar for Edward Fox edwardkenfox
0
120
フロントエンド開発の落とし穴 / Fallacies of Client Side Programming (2019ver)
Avatar for Edward Fox edwardkenfox
0
340
僕とprototypeとJSONで / Me and prototype down by the JSON
Avatar for Edward Fox edwardkenfox
0
150
クライアントサイド開発の落とし穴 / Fallacies of Client Side Programming
Avatar for Edward Fox edwardkenfox
0
460
Beacon API ことはじめ 〜そしてkeepalive fetchへ〜 / Beacon API The Basics
Avatar for Edward Fox edwardkenfox
0
1.2k
window.windowとは何か / What is window window
Avatar for Edward Fox edwardkenfox
1
230

Other Decks in Technology

See All in Technology
S3を正しく理解するための内部構造の読解
Avatar for NRI Netcom nrinetcom
PRO
3
220
AI駆動開発における設計思想 認知負荷を下げるフロントエンドアーキテクチャ/ 20251211 Teppei Hanai
Avatar for SHIFT EVOLVE shift_evolve
PRO
2
460
年間40件以上の登壇を続けて見えた「本当の発信力」/ 20251213 Masaki Okuda
Avatar for SHIFT EVOLVE shift_evolve
PRO
1
150
たまに起きる外部サービスの障害に備えたり備えなかったりする話
Avatar for Sohei Iwahori egmc
0
340
ActiveJobUpdates
Avatar for Kuniaki IGARASHI igaiga
1
270
AIの長期記憶と短期記憶の違いについてAgentCoreを例に深掘ってみた
Avatar for やくも yakumo
4
470
モダンデータスタックの理想と現実の間で～1.3億人Vポイントデータ基盤の現在地とこれから～
Avatar for タロウ taromatsui_cccmkhd
1
180
AWS Security Agentの紹介/introducing-aws-security-agent
Avatar for tomoki10 tomoki10
0
360
ESXi のAIOps だ！2025冬
Avatar for Unno Wataru unnowataru
0
130
SQLだけでマイグレーションしたい！
Avatar for MakKi makki_d
0
1.1k
今年のデータ・ML系アップデートと気になるアプデのご紹介
Avatar for Nayuta S. nayuts
1
610
障害対応訓練、その前に
Avatar for coconala_engineer coconala_engineer
0
140

Featured

See All Featured
Automating Front-end Workflow
Avatar for Addy Osmani addyosmani
1371
200k
Thoughts on Productivity
Avatar for Jon Yablonski jonyablonski
73
5k
SERP Conf. Vienna - Web Accessibility: Optimizing for Inclusivity and SEO
Avatar for Sara Fernández Carmona sarafernandezseo
1
1.3k
Intergalactic Javascript Robots from Outer Space
Avatar for Vicent Martí tanoku
273
27k
How GitHub (no longer) Works
Avatar for Zach Holman holman
316
140k
Building Flexible Design Systems
Avatar for Yesenia Perez-Cruz yeseniaperezcruz
330
39k
Site-Speed That Sticks
Avatar for Harry Roberts csswizardry
13
1k
Information Architects: The Missing Link in Design Systems
Avatar for Michelle Chin soysaucechin
0
710
Distributed Sagas: A Protocol for Coordinating Microservices
Avatar for Caitie McCaffrey caitiem20
333
22k
Evolution of real-time – Irina Nazarova, EuRuKo, 2024
Avatar for Irina Nazarova irinanazarova
9
1.1k
A Modern Web Designer's Workflow
Avatar for Chris Coyier chriscoyier
698
190k
What Being in a Rock Band Can Teach Us About Real World SEO
Avatar for Ade Holder 427marketing
0
140

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