Strangler-Fig-Pattern-diagram.excalidraw
==⚠ Switch to EXCALIDRAW VIEW in the MORE OPTIONS menu of this document. ⚠==
Strangler Fig Pattern — Migration Phases
Text Elements
Phase 1: All Traffic to Legacy ^phase1label
Client ^client1 Facade / API Gateway ^facade1 Legacy System (100% traffic) ^legacy1 New System (0% traffic) ^new1
Phase 3: Facade Routing Split ^phase3label
Client ^client3 Facade / API Gateway ^facade3 Legacy System (shrinking) ^legacy3 remaining routes ^routes3 migrated routes ^mroutes3 New System (growing) ^new3 ACL ^acl3
Phase 5: Legacy Deleted ^phase5label
Client ^client5 Facade / API Gateway ^facade5 New System (100% traffic) ^new5 Legacy System ^legacy5del DELETED ^deleted5 Done = deleted, not bypassed ^done5note
%%
Drawing
{
"type": "excalidraw",
"version": 2,
"source": "https://excalidraw.com",
"elements": [
{
"id": "phase1-label",
"type": "text",
"x": 60,
"y": 20,
"width": 220,
"height": 24,
"text": "Phase 1: All Traffic to Legacy",
"fontSize": 16,
"fontFamily": 1,
"textAlign": "left",
"verticalAlign": "top",
"strokeColor": "#1e1e1e",
"backgroundColor": "transparent",
"fillStyle": "solid",
"strokeWidth": 1,
"roughness": 1,
"opacity": 100
},
{
"id": "client1",
"type": "rectangle",
"x": 60,
"y": 60,
"width": 100,
"height": 44,
"strokeColor": "#1e1e1e",
"backgroundColor": "#e7f5ff",
"fillStyle": "solid",
"strokeWidth": 2,
"roughness": 1,
"opacity": 100
},
{
"id": "client1-text",
"type": "text",
"x": 90,
"y": 74,
"width": 44,
"height": 20,
"text": "Client",
"fontSize": 14,
"fontFamily": 1,
"textAlign": "center",
"verticalAlign": "middle",
"strokeColor": "#1e1e1e",
"backgroundColor": "transparent",
"fillStyle": "solid",
"strokeWidth": 1,
"roughness": 1,
"opacity": 100
},
{
"id": "facade1",
"type": "rectangle",
"x": 220,
"y": 60,
"width": 160,
"height": 44,
"strokeColor": "#1e1e1e",
"backgroundColor": "#fff9db",
"fillStyle": "solid",
"strokeWidth": 2,
"roughness": 1,
"opacity": 100
},
{
"id": "facade1-text",
"type": "text",
"x": 235,
"y": 68,
"width": 130,
"height": 28,
"text": "Facade / API Gateway",
"fontSize": 13,
"fontFamily": 1,
"textAlign": "center",
"verticalAlign": "middle",
"strokeColor": "#1e1e1e",
"backgroundColor": "transparent",
"fillStyle": "solid",
"strokeWidth": 1,
"roughness": 1,
"opacity": 100
},
{
"id": "legacy1",
"type": "rectangle",
"x": 450,
"y": 50,
"width": 200,
"height": 60,
"strokeColor": "#1e1e1e",
"backgroundColor": "#fff0f6",
"fillStyle": "solid",
"strokeWidth": 2,
"roughness": 1,
"opacity": 100
},
{
"id": "legacy1-text",
"type": "text",
"x": 465,
"y": 62,
"width": 170,
"height": 36,
"text": "Legacy System\n(100% traffic)",
"fontSize": 13,
"fontFamily": 1,
"textAlign": "center",
"verticalAlign": "middle",
"strokeColor": "#1e1e1e",
"backgroundColor": "transparent",
"fillStyle": "solid",
"strokeWidth": 1,
"roughness": 1,
"opacity": 100
},
{
"id": "new1",
"type": "rectangle",
"x": 450,
"y": 130,
"width": 200,
"height": 44,
"strokeColor": "#868e96",
"backgroundColor": "#f8f9fa",
"fillStyle": "solid",
"strokeWidth": 1,
"roughness": 1,
"strokeStyle": "dashed",
"opacity": 60
},
{
"id": "new1-text",
"type": "text",
"x": 465,
"y": 144,
"width": 170,
"height": 20,
"text": "New System (0% traffic)",
"fontSize": 12,
"fontFamily": 1,
"textAlign": "center",
"verticalAlign": "middle",
"strokeColor": "#868e96",
"backgroundColor": "transparent",
"fillStyle": "solid",
"strokeWidth": 1,
"roughness": 1,
"opacity": 60
},
{
"id": "arrow1-client-facade",
"type": "arrow",
"x": 160,
"y": 82,
"width": 58,
"height": 0,
"strokeColor": "#1e1e1e",
"backgroundColor": "transparent",
"fillStyle": "solid",
"strokeWidth": 2,
"roughness": 1,
"opacity": 100,
"points": [[0, 0], [58, 0]],
"startArrowhead": null,
"endArrowhead": "arrow"
},
{
"id": "arrow1-facade-legacy",
"type": "arrow",
"x": 380,
"y": 82,
"width": 68,
"height": 0,
"strokeColor": "#1e1e1e",
"backgroundColor": "transparent",
"fillStyle": "solid",
"strokeWidth": 2,
"roughness": 1,
"opacity": 100,
"points": [[0, 0], [68, 0]],
"startArrowhead": null,
"endArrowhead": "arrow"
},
{
"id": "phase3-label",
"type": "text",
"x": 60,
"y": 220,
"width": 280,
"height": 24,
"text": "Phase 3: Facade Routing Split (with ACL)",
"fontSize": 16,
"fontFamily": 1,
"textAlign": "left",
"verticalAlign": "top",
"strokeColor": "#1e1e1e",
"backgroundColor": "transparent",
"fillStyle": "solid",
"strokeWidth": 1,
"roughness": 1,
"opacity": 100
},
{
"id": "client3",
"type": "rectangle",
"x": 60,
"y": 260,
"width": 100,
"height": 44,
"strokeColor": "#1e1e1e",
"backgroundColor": "#e7f5ff",
"fillStyle": "solid",
"strokeWidth": 2,
"roughness": 1,
"opacity": 100
},
{
"id": "client3-text",
"type": "text",
"x": 90,
"y": 274,
"width": 44,
"height": 20,
"text": "Client",
"fontSize": 14,
"fontFamily": 1,
"textAlign": "center",
"verticalAlign": "middle",
"strokeColor": "#1e1e1e",
"backgroundColor": "transparent",
"fillStyle": "solid",
"strokeWidth": 1,
"roughness": 1,
"opacity": 100
},
{
"id": "facade3",
"type": "rectangle",
"x": 220,
"y": 260,
"width": 160,
"height": 44,
"strokeColor": "#1e1e1e",
"backgroundColor": "#fff9db",
"fillStyle": "solid",
"strokeWidth": 2,
"roughness": 1,
"opacity": 100
},
{
"id": "facade3-text",
"type": "text",
"x": 235,
"y": 268,
"width": 130,
"height": 28,
"text": "Facade / API Gateway",
"fontSize": 13,
"fontFamily": 1,
"textAlign": "center",
"verticalAlign": "middle",
"strokeColor": "#1e1e1e",
"backgroundColor": "transparent",
"fillStyle": "solid",
"strokeWidth": 1,
"roughness": 1,
"opacity": 100
},
{
"id": "legacy3",
"type": "rectangle",
"x": 450,
"y": 248,
"width": 200,
"height": 52,
"strokeColor": "#1e1e1e",
"backgroundColor": "#fff0f6",
"fillStyle": "solid",
"strokeWidth": 2,
"roughness": 1,
"opacity": 100
},
{
"id": "legacy3-text",
"type": "text",
"x": 465,
"y": 258,
"width": 170,
"height": 32,
"text": "Legacy System (shrinking)",
"fontSize": 13,
"fontFamily": 1,
"textAlign": "center",
"verticalAlign": "middle",
"strokeColor": "#1e1e1e",
"backgroundColor": "transparent",
"fillStyle": "solid",
"strokeWidth": 1,
"roughness": 1,
"opacity": 100
},
{
"id": "new3",
"type": "rectangle",
"x": 450,
"y": 320,
"width": 200,
"height": 52,
"strokeColor": "#2f9e44",
"backgroundColor": "#ebfbee",
"fillStyle": "solid",
"strokeWidth": 2,
"roughness": 1,
"opacity": 100
},
{
"id": "new3-text",
"type": "text",
"x": 465,
"y": 330,
"width": 170,
"height": 32,
"text": "New System (growing)",
"fontSize": 13,
"fontFamily": 1,
"textAlign": "center",
"verticalAlign": "middle",
"strokeColor": "#2f9e44",
"backgroundColor": "transparent",
"fillStyle": "solid",
"strokeWidth": 1,
"roughness": 1,
"opacity": 100
},
{
"id": "acl3",
"type": "rectangle",
"x": 680,
"y": 276,
"width": 80,
"height": 44,
"strokeColor": "#9c36b5",
"backgroundColor": "#f8f0fc",
"fillStyle": "solid",
"strokeWidth": 2,
"roughness": 1,
"opacity": 100
},
{
"id": "acl3-text",
"type": "text",
"x": 700,
"y": 289,
"width": 40,
"height": 20,
"text": "ACL",
"fontSize": 14,
"fontFamily": 1,
"textAlign": "center",
"verticalAlign": "middle",
"strokeColor": "#9c36b5",
"backgroundColor": "transparent",
"fillStyle": "solid",
"strokeWidth": 1,
"roughness": 1,
"opacity": 100
},
{
"id": "arrow3-client-facade",
"type": "arrow",
"x": 160,
"y": 282,
"width": 58,
"height": 0,
"strokeColor": "#1e1e1e",
"backgroundColor": "transparent",
"fillStyle": "solid",
"strokeWidth": 2,
"roughness": 1,
"opacity": 100,
"points": [[0, 0], [58, 0]],
"startArrowhead": null,
"endArrowhead": "arrow"
},
{
"id": "arrow3-facade-legacy",
"type": "arrow",
"x": 380,
"y": 272,
"width": 68,
"height": 0,
"strokeColor": "#1e1e1e",
"backgroundColor": "transparent",
"fillStyle": "solid",
"strokeWidth": 2,
"roughness": 1,
"opacity": 100,
"points": [[0, 0], [68, 0]],
"startArrowhead": null,
"endArrowhead": "arrow",
"label": {
"text": "remaining routes",
"fontSize": 11,
"strokeColor": "#1e1e1e"
}
},
{
"id": "arrow3-facade-new",
"type": "arrow",
"x": 380,
"y": 290,
"width": 68,
"height": 56,
"strokeColor": "#2f9e44",
"backgroundColor": "transparent",
"fillStyle": "solid",
"strokeWidth": 2,
"roughness": 1,
"opacity": 100,
"points": [[0, 0], [68, 56]],
"startArrowhead": null,
"endArrowhead": "arrow",
"label": {
"text": "migrated routes",
"fontSize": 11,
"strokeColor": "#2f9e44"
}
},
{
"id": "arrow3-legacy-acl",
"type": "arrow",
"x": 650,
"y": 274,
"width": 28,
"height": 0,
"strokeColor": "#9c36b5",
"backgroundColor": "transparent",
"fillStyle": "solid",
"strokeWidth": 1,
"roughness": 1,
"opacity": 100,
"points": [[0, 0], [28, 0]],
"startArrowhead": "arrow",
"endArrowhead": "arrow"
},
{
"id": "arrow3-new-acl",
"type": "arrow",
"x": 650,
"y": 346,
"width": 28,
"height": -48,
"strokeColor": "#9c36b5",
"backgroundColor": "transparent",
"fillStyle": "solid",
"strokeWidth": 1,
"roughness": 1,
"opacity": 100,
"points": [[0, 0], [28, -48]],
"startArrowhead": "arrow",
"endArrowhead": "arrow"
},
{
"id": "phase5-label",
"type": "text",
"x": 60,
"y": 420,
"width": 260,
"height": 24,
"text": "Phase 5: Legacy Deleted — Migration Done",
"fontSize": 16,
"fontFamily": 1,
"textAlign": "left",
"verticalAlign": "top",
"strokeColor": "#1e1e1e",
"backgroundColor": "transparent",
"fillStyle": "solid",
"strokeWidth": 1,
"roughness": 1,
"opacity": 100
},
{
"id": "client5",
"type": "rectangle",
"x": 60,
"y": 460,
"width": 100,
"height": 44,
"strokeColor": "#1e1e1e",
"backgroundColor": "#e7f5ff",
"fillStyle": "solid",
"strokeWidth": 2,
"roughness": 1,
"opacity": 100
},
{
"id": "client5-text",
"type": "text",
"x": 90,
"y": 474,
"width": 44,
"height": 20,
"text": "Client",
"fontSize": 14,
"fontFamily": 1,
"textAlign": "center",
"verticalAlign": "middle",
"strokeColor": "#1e1e1e",
"backgroundColor": "transparent",
"fillStyle": "solid",
"strokeWidth": 1,
"roughness": 1,
"opacity": 100
},
{
"id": "facade5",
"type": "rectangle",
"x": 220,
"y": 460,
"width": 160,
"height": 44,
"strokeColor": "#1e1e1e",
"backgroundColor": "#fff9db",
"fillStyle": "solid",
"strokeWidth": 2,
"roughness": 1,
"opacity": 100
},
{
"id": "facade5-text",
"type": "text",
"x": 235,
"y": 468,
"width": 130,
"height": 28,
"text": "Facade / API Gateway",
"fontSize": 13,
"fontFamily": 1,
"textAlign": "center",
"verticalAlign": "middle",
"strokeColor": "#1e1e1e",
"backgroundColor": "transparent",
"fillStyle": "solid",
"strokeWidth": 1,
"roughness": 1,
"opacity": 100
},
{
"id": "new5",
"type": "rectangle",
"x": 450,
"y": 452,
"width": 200,
"height": 60,
"strokeColor": "#2f9e44",
"backgroundColor": "#ebfbee",
"fillStyle": "solid",
"strokeWidth": 3,
"roughness": 1,
"opacity": 100
},
{
"id": "new5-text",
"type": "text",
"x": 465,
"y": 464,
"width": 170,
"height": 36,
"text": "New System\n(100% traffic)",
"fontSize": 13,
"fontFamily": 1,
"textAlign": "center",
"verticalAlign": "middle",
"strokeColor": "#2f9e44",
"backgroundColor": "transparent",
"fillStyle": "solid",
"strokeWidth": 1,
"roughness": 1,
"opacity": 100
},
{
"id": "legacy5",
"type": "rectangle",
"x": 450,
"y": 530,
"width": 200,
"height": 52,
"strokeColor": "#e03131",
"backgroundColor": "#fff5f5",
"fillStyle": "solid",
"strokeWidth": 2,
"roughness": 1,
"strokeStyle": "dashed",
"opacity": 100
},
{
"id": "legacy5-text",
"type": "text",
"x": 465,
"y": 540,
"width": 170,
"height": 32,
"text": "Legacy System — DELETED",
"fontSize": 13,
"fontFamily": 1,
"textAlign": "center",
"verticalAlign": "middle",
"strokeColor": "#e03131",
"backgroundColor": "transparent",
"fillStyle": "solid",
"strokeWidth": 1,
"roughness": 1,
"opacity": 100
},
{
"id": "done5-note",
"type": "text",
"x": 450,
"y": 592,
"width": 260,
"height": 20,
"text": "Done = deleted, not bypassed",
"fontSize": 12,
"fontFamily": 1,
"textAlign": "left",
"verticalAlign": "top",
"strokeColor": "#e03131",
"backgroundColor": "transparent",
"fillStyle": "solid",
"strokeWidth": 1,
"roughness": 1,
"opacity": 100
},
{
"id": "arrow5-client-facade",
"type": "arrow",
"x": 160,
"y": 482,
"width": 58,
"height": 0,
"strokeColor": "#1e1e1e",
"backgroundColor": "transparent",
"fillStyle": "solid",
"strokeWidth": 2,
"roughness": 1,
"opacity": 100,
"points": [[0, 0], [58, 0]],
"startArrowhead": null,
"endArrowhead": "arrow"
},
{
"id": "arrow5-facade-new",
"type": "arrow",
"x": 380,
"y": 482,
"width": 68,
"height": 0,
"strokeColor": "#2f9e44",
"backgroundColor": "transparent",
"fillStyle": "solid",
"strokeWidth": 2,
"roughness": 1,
"opacity": 100,
"points": [[0, 0], [68, 0]],
"startArrowhead": null,
"endArrowhead": "arrow"
}
],
"appState": {
"gridSize": null,
"viewBackgroundColor": "#ffffff"
},
"files": {}
}%%