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
リアーキテクチャに伴うサービスの無停止切り替え事例の紹介
Search
warawara28
June 10, 2025
Technology
70
0
Share
リアーキテクチャに伴うサービスの無停止切り替え事例の紹介
20250307_タイミー共催セミナー_リアーキテクチャに伴うサービスの無停止切り替え事例の紹介
https://timeedev.connpass.com/event/344976/
warawara28
June 10, 2025
Other Decks in Technology
See All in Technology
ルール・ロール・ツールを創る / Creating Rules, Roles and Tools
ks91
PRO
0
170
イベントで大活躍する電子ペーパー名札 〜その3〜 / ビジュアルプログラミングIoTLT vol.23
you
PRO
0
140
TSKaigi 2026 - enumよ、さようなら
teamlab
PRO
3
550
A Harness for Behaviour: how to get AI to generate code that does what we intend, or "TDD in the age of AI"
xpmatteo
0
430
管理アカウント単一運用からAWS Organizationsに移行するの大変で滅
hiramax
0
250
AIのために、AIを使った、Effect-TSからの脱却 〜テストを活用した安全なリファクタリングの進め方〜
bitkey
PRO
1
580
JavaScript実装の自作プログラミング言語をTypeScript実装に移行した話
keisukeikeda
1
160
Claude Codeですべての日常業務を爆速化しよう!
minorun365
PRO
15
13k
AI とサービス・デザイン / AI and Service Design
ks91
PRO
0
170
権限管理設計を完全に理解した
rsugi
2
210
コーディングエージェントはTypeScriptの 型エラーをどう自己修正しているのか
melonps
4
490
類似画像検索モデルの開発ノウハウ
lycorptech_jp
PRO
4
870
Featured
See All Featured
Hiding What from Whom? A Critical Review of the History of Programming languages for Music
tomoyanonymous
2
820
How To Speak Unicorn (iThemes Webinar)
marktimemedia
1
460
Crafting Experiences
bethany
1
160
Helping Users Find Their Own Way: Creating Modern Search Experiences
danielanewman
31
3.2k
The SEO Collaboration Effect
kristinabergwall1
1
460
30 Presentation Tips
portentint
PRO
1
300
Automating Front-end Workflow
addyosmani
1370
210k
Introduction to Domain-Driven Design and Collaborative software design
baasie
1
800
Game over? The fight for quality and originality in the time of robots
wayneb77
1
180
Six Lessons from altMBA
skipperchong
29
4.2k
Designing for humans not robots
tammielis
254
26k
How STYLIGHT went responsive
nonsquared
100
6.1k
Transcript
リアーキテクチャに伴う サービスの無停止切り替え事例の紹介 株式会社ジーニー 小河原優貴
小河原 優貴 Webチャットサービスの開発チームマネージャー 経歴:ジーニー→メルカリ→フリーランス→ジーニー 自己紹介 こ がわら ゆうき @warawara28 kgwryk28
• 事例1: 管理画面のリプレース • 事例2: メッセージ配信基盤のリアーキテクチャ 目次
事例1: 管理画面のリプレース
管理画面のリプレース:構成 変更前の構成 SPA + REST API 構成 Routing SPA (React)
REST API (Python/Django)
管理画面のリプレース:課題 1. ライブラリの全面刷新が必要 2. 技術負債が多く、機能開発の工数が増大 例 ・UIで使用しているテンプレート、シナリオ画面のライブラリを変更したい ・新機能開発をする際に既存機能、ライブラリが流用できない ・脆弱性対応のため、問題のあるライブラリのバージョンアップが必要 ・開発環境で使用するパッケージを変更して開発効率を上げたい
個別で対応した結果をまとめると、最終的には 実質ほぼ作り直し リファクタで対応するか、全てを捨ててリプレースするのか半年悩んだ
管理画面のリプレース:方針 1. 開発スコープを絞る a. REST APIは変更せず、SPAのみリプレースする。 b. 技術スタックはTypeScript/Reactをそのまま使用。 c. 移行中はUIのレイアウトを変更しない
2. 半年以上かけた段階的な移行 a. 既存ユーザーに配慮して周知・共有を行いながら、トラブル防止のため段階的な移行を行う 3. 移行中も機能開発は継続 a. 新機能は新管理画面に実装。旧管理画面の追加の機能開発は行わずコードフリーズした 旧管理画面を稼働しながら、新管理画面にリプレースする 決定方針
管理画面のリプレース:移行の流れ 移行の流れ 1. 新管理画面をリリース バージョニング+パスルーティングで振分 Routing 旧SPA REST API 新SPA
/v2/* /v1/* /v1/api/*
管理画面のリプレース:移行の流れ 移行の流れ 2. 新旧管理画面の遷移リンクを追加 (両方の画面を使えるようにする) その後デフォルトの画面を新SPAに変更 (ログイン後は新SPAが表示される) Routing 旧SPA REST
API 新SPA /v2/* /v1/* /v1/api/* 旧SPAへのリンク 新SPAへのリンク
管理画面のリプレース:移行の流れ 移行の流れ 3. 遷移リンクを削除後、 旧管理画面へのルーティングを削除 (サービスアウト) Routing REST API 新SPA
/v2/* /v1/api/* 旧SPAを削除 リンクを削除
事例紹介(管理画面) AFTER BEFORE
管理画面のリプレース:成果 AFTER BEFORE 開発環境 パッケージ数:2366 モジュールハンドラ:webpack ローカル起動時間:30s ホットリロード:20s ビルド時間:53s 開発環境
パッケージ数:518 -78%! モジュールハンドラ:vite ローカル起動時間:~1s 30倍~! ホットリロード:~1s 20倍~! ビルド時間:17s 3.1倍!
管理画面のリプレース:成果 AFTER BEFORE 機能開発 リードタイム(平均):0.7ヶ月 -46%! チケット消化数(平均):16個 1.6倍! 機能開発 リードタイム(平均):1.3ヶ月
チケット消化数(平均):10個
事例2: メッセージ配信基盤のリアーキテクチャ
変更前のアーキテクチャ
変更後のアーキテクチャ
管理画面のリプレース:構成 バックエンドで処理されたメッセージが配信キューに送信 配信キューから配信サーバーがメッセージを取得してクライアントに配信 (WebSocketによる双方向通信で実現) 処理ワーカー 配信サーバー クライアント roomid: aaa クライアント
roomid: bbb 配信サーバー 処理ワーカー roomid: aaaに送信するメッセージ roomid: bbbに送信するメッセージ roomid: bbbのメッセージは捨てる roomid: aaaのメッセージは捨てる 配信キュー
メッセージ配信基盤:課題 1. 配信サーバーのスケーラビリティが低い問題 a. 全体のメッセージ処理負荷をサーバー毎に分散できない メッセージ処理負荷が増えても、スケーリングしやすい設計にしたい
管理画面のリプレース:方針 配信サーバーがルーム単位でメッセージ取得できるようにする 決定方針 1. 配信キューを Valkey(Redis)を利用した Pub/Subに置き換える a. 配信サーバーはクライアントの接続ルーム単位でチャネルをSubscribeする 他のルームのメッセージを受信しなくて良くなる
2. 送信側でDouble Writeを利用、受信側は両方受信しながら切り替える a. デプロイ後のロールバックを考慮 3. 段階的なリリース
管理画面のリプレース:移行の流れ(1/6) 配信サーバーは配信キュー内の全てのメッセージを受信する。 (クライアントに配信しないメッセージは無視) roomid: aaaに送信するメッセージ roomid: bbbに送信するメッセージ 処理ワーカー 配信サーバー クライアント
roomid: aaa クライアント roomid: bbb 配信サーバー 処理ワーカー roomid: bbbのメッセージは捨てる roomid: aaaのメッセージは捨てる 配信キュー
管理画面のリプレース:移行の流れ(2/6) Valkey(Redis)を用意して、ワーカーはキューとValkey(Redis)に同一メッセージをDouble Write roomid: aaaに送信するメッセージ roomid: bbbに送信するメッセージ 処理ワーカー クライアント roomid:
aaa クライアント roomid: bbb 処理ワーカー roomid: bbbのメッセージは捨てる roomid: aaaのメッセージは捨てる 配信サーバー 配信サーバー Valkey(Redis) subscriberがいない場合捨てられる 配信キュー
管理画面のリプレース:移行の流れ(3/6) 配信サーバーでValkey(Redis)に対してSubscribeを行い、メッセージを両方受信するようにする ・Valkey(Redis)のメッセージ :受け取って捨てる ・SQSのメッセージ :受け取って利用する or 別のルームのメッセージは捨てる roomid: aaaに送信するメッセージ
roomid: bbbに送信するメッセージ 処理ワーカー 配信サーバー クライアント roomid: aaa クライアント roomid: bbb 配信キュー 配信サーバー 処理ワーカー roomid: bbbのメッセージは捨てる roomid: aaaのメッセージは捨てる Valkey(Redis) Valkey経由のメッセージも捨てる Valkey経由のメッセージも捨てる
管理画面のリプレース:移行の流れ(4/6) 配信サーバーでメッセージの受信元を キューからValkey(Redis) に切り替える ・Valkey(Redis)のメッセージ :捨てる ・SQSのメッセージ :利用する or 捨てる
roomid: aaaに送信するメッセージ roomid: bbbに送信するメッセージ 処理ワーカー 配信サーバー クライアント roomid: aaa クライアント roomid: bbb 配信キュー 配信サーバー 処理ワーカー Valkey(Redis) SQS経由のメッセージは捨てる SQS経由のメッセージは捨てる
管理画面のリプレース:移行の流れ(5/6) 送信側でSNS/SQSに送信するのを停止する (SQSにメッセージが流れなくなる) roomid: aaaに送信するメッセージ roomid: bbbに送信するメッセージ 処理ワーカー 配信サーバー クライアント
roomid: aaa クライアント roomid: bbb 配信キュー 配信サーバー 処理ワーカー Valkey(Redis)
管理画面のリプレース:移行の流れ(6/6) 配信キューを削除して切り替え完了 roomid: aaaに送信するメッセージ roomid: bbbに送信するメッセージ 処理ワーカー 配信サーバー クライアント roomid:
aaa クライアント roomid: bbb 配信サーバー 処理ワーカー Valkey(Redis)
事例紹介(メッセージ配信サーバーのCPU負荷) AFTER BEFORE
まとめ ・既存仕様を把握、課題を明確化しておく ・対処の選択肢を複数リストアップしてから判断する リファクタリングやコードの修正などで解決できないか? 他の選択肢と投資対効果をしっかり比較する 議論内容、比較軸の検討などはADRとして残しています ・実施する場合、やらないことを決めておく 社内過去事例として、リプレースが全ての問題を解決する魔法のプロジェクトになってしまい 失敗したことがあります
ご清聴ありがとうございました