{"type":"excalidraw","version":2,"source":"https://AwesomeSystemDesign.dev","elements":[{"angle":0,"strokeColor":"#6577aa","backgroundColor":"#eef1fc","fillStyle":"solid","strokeWidth":1.5,"strokeStyle":"solid","roughness":0.7,"opacity":100,"version":1,"versionNonce":1,"isDeleted":false,"groupIds":["step-1"],"frameId":null,"roundness":null,"boundElements":[{"type":"text","id":"shape-1"}],"updated":0,"link":null,"locked":false,"id":"shape-0","type":"rectangle","seed":41,"x":16,"y":16,"width":288,"height":236.20000000000002,"customData":{"revealStep":1}},{"angle":0,"strokeColor":"#394557","backgroundColor":"transparent","fillStyle":"solid","strokeWidth":1.5,"strokeStyle":"solid","roughness":0.7,"opacity":100,"version":1,"versionNonce":1,"isDeleted":false,"groupIds":["step-1"],"frameId":null,"roundness":null,"boundElements":null,"updated":0,"link":null,"locked":false,"id":"shape-1","type":"text","seed":114,"x":36,"y":34,"width":248,"height":200.20000000000002,"fontSize":22,"fontFamily":1,"text":"UI Layer\n\n- Controls\n- Progress\n- Quality\nselector\n- Subtitles","originalText":"UI Layer\n\n- Controls\n- Progress\n- Quality\nselector\n- Subtitles","textAlign":"left","verticalAlign":"middle","containerId":"shape-0","lineHeight":1.3,"autoResize":false,"customData":{"revealStep":1}},{"angle":0,"strokeColor":"#6577aa","backgroundColor":"#eef1fc","fillStyle":"solid","strokeWidth":1.5,"strokeStyle":"solid","roughness":0.7,"opacity":100,"version":1,"versionNonce":1,"isDeleted":false,"groupIds":["step-2"],"frameId":null,"roundness":null,"boundElements":[{"type":"text","id":"shape-3"}],"updated":0,"link":null,"locked":false,"id":"shape-2","type":"rectangle","seed":187,"x":16,"y":296.20000000000005,"width":288,"height":264.8,"customData":{"revealStep":2}},{"angle":0,"strokeColor":"#394557","backgroundColor":"transparent","fillStyle":"solid","strokeWidth":1.5,"strokeStyle":"solid","roughness":0.7,"opacity":100,"version":1,"versionNonce":1,"isDeleted":false,"groupIds":["step-2"],"frameId":null,"roundness":null,"boundElements":null,"updated":0,"link":null,"locked":false,"id":"shape-3","type":"text","seed":260,"x":36,"y":314.20000000000005,"width":248,"height":228.8,"fontSize":22,"fontFamily":1,"text":"Buffer Manager\n\n- Prefetch next\n2-3 segments\n- Buffer health\nmonitoring\n- Evict old\nsegments","originalText":"Buffer Manager\n\n- Prefetch next\n2-3 segments\n- Buffer health\nmonitoring\n- Evict old\nsegments","textAlign":"left","verticalAlign":"middle","containerId":"shape-2","lineHeight":1.3,"autoResize":false,"customData":{"revealStep":2}},{"angle":0,"strokeColor":"#6577aa","backgroundColor":"#eef1fc","fillStyle":"solid","strokeWidth":1.5,"strokeStyle":"solid","roughness":0.7,"opacity":100,"version":1,"versionNonce":1,"isDeleted":false,"groupIds":["step-3"],"frameId":null,"roundness":null,"boundElements":[{"type":"text","id":"shape-5"}],"updated":0,"link":null,"locked":false,"id":"shape-4","type":"rectangle","seed":333,"x":16,"y":605,"width":288,"height":264.8,"customData":{"revealStep":3}},{"angle":0,"strokeColor":"#394557","backgroundColor":"transparent","fillStyle":"solid","strokeWidth":1.5,"strokeStyle":"solid","roughness":0.7,"opacity":100,"version":1,"versionNonce":1,"isDeleted":false,"groupIds":["step-3"],"frameId":null,"roundness":null,"boundElements":null,"updated":0,"link":null,"locked":false,"id":"shape-5","type":"text","seed":406,"x":36,"y":623,"width":248,"height":228.8,"fontSize":22,"fontFamily":1,"text":"ABR Controller\n\n- Bandwidth\nestimation\n- Quality\nselection\n- Startup\nstrategy","originalText":"ABR Controller\n\n- Bandwidth\nestimation\n- Quality\nselection\n- Startup\nstrategy","textAlign":"left","verticalAlign":"middle","containerId":"shape-4","lineHeight":1.3,"autoResize":false,"customData":{"revealStep":3}},{"angle":0,"strokeColor":"#45536b","backgroundColor":"transparent","fillStyle":"solid","strokeWidth":1.5,"strokeStyle":"solid","roughness":0.7,"opacity":100,"version":1,"versionNonce":1,"isDeleted":false,"groupIds":["step-4"],"frameId":null,"roundness":null,"boundElements":null,"updated":0,"link":null,"locked":false,"id":"shape-6","type":"text","seed":479,"x":24,"y":913.8,"width":272,"height":26,"fontSize":20,"fontFamily":1,"text":"Connection 1","originalText":"Connection 1","textAlign":"left","verticalAlign":"middle","containerId":null,"lineHeight":1.3,"autoResize":false,"customData":{"revealStep":4}},{"angle":0,"strokeColor":"#6577aa","backgroundColor":"#eef1fc","fillStyle":"solid","strokeWidth":1.5,"strokeStyle":"solid","roughness":0.7,"opacity":100,"version":1,"versionNonce":1,"isDeleted":false,"groupIds":["step-4"],"frameId":null,"roundness":null,"boundElements":[{"type":"text","id":"shape-8"},{"type":"arrow","id":"shape-9"}],"updated":0,"link":null,"locked":false,"id":"shape-7","type":"rectangle","seed":552,"x":16,"y":951.8,"width":288,"height":68,"customData":{"revealStep":4}},{"angle":0,"strokeColor":"#394557","backgroundColor":"transparent","fillStyle":"solid","strokeWidth":1.5,"strokeStyle":"solid","roughness":0.7,"opacity":100,"version":1,"versionNonce":1,"isDeleted":false,"groupIds":["step-4"],"frameId":null,"roundness":null,"boundElements":null,"updated":0,"link":null,"locked":false,"id":"shape-8","type":"text","seed":625,"x":36,"y":971.5,"width":248,"height":28.6,"fontSize":22,"fontFamily":1,"text":"ABR Controller","originalText":"ABR Controller","textAlign":"left","verticalAlign":"middle","containerId":"shape-7","lineHeight":1.3,"autoResize":false,"customData":{"revealStep":4}},{"angle":0,"strokeColor":"#6577aa","backgroundColor":"transparent","fillStyle":"solid","strokeWidth":2,"strokeStyle":"solid","roughness":0.4,"opacity":100,"version":1,"versionNonce":1,"isDeleted":false,"groupIds":["step-4"],"frameId":null,"roundness":null,"boundElements":null,"updated":0,"link":null,"locked":false,"id":"shape-9","type":"arrow","seed":698,"x":36,"y":1033.8,"width":0,"height":28,"points":[[0,0],[0,28]],"lastCommittedPoint":null,"startBinding":{"elementId":"shape-7","focus":0,"gap":14},"endBinding":{"elementId":"shape-10","focus":0,"gap":14},"startArrowhead":null,"endArrowhead":"arrow","elbowed":false,"customData":{"revealStep":4}},{"angle":0,"strokeColor":"#628572","backgroundColor":"#edf5ee","fillStyle":"solid","strokeWidth":1.5,"strokeStyle":"solid","roughness":0.7,"opacity":100,"version":1,"versionNonce":1,"isDeleted":false,"groupIds":["step-4"],"frameId":null,"roundness":null,"boundElements":[{"type":"text","id":"shape-11"},{"type":"arrow","id":"shape-9"}],"updated":0,"link":null,"locked":false,"id":"shape-10","type":"rectangle","seed":771,"x":16,"y":1075.8,"width":288,"height":236.20000000000002,"customData":{"revealStep":4}},{"angle":0,"strokeColor":"#394557","backgroundColor":"transparent","fillStyle":"solid","strokeWidth":1.5,"strokeStyle":"solid","roughness":0.7,"opacity":100,"version":1,"versionNonce":1,"isDeleted":false,"groupIds":["step-4"],"frameId":null,"roundness":null,"boundElements":null,"updated":0,"link":null,"locked":false,"id":"shape-11","type":"text","seed":844,"x":36,"y":1093.8,"width":248,"height":200.20000000000002,"fontSize":22,"fontFamily":1,"text":"Media Source\nExtensions\n(MSE API)\n\nFeeds decoded\nsegments to <video>\nelement for rendering","originalText":"Media Source\nExtensions\n(MSE API)\n\nFeeds decoded\nsegments to <video>\nelement for rendering","textAlign":"left","verticalAlign":"middle","containerId":"shape-10","lineHeight":1.3,"autoResize":false,"customData":{"revealStep":4}},{"angle":0,"strokeColor":"#45536b","backgroundColor":"transparent","fillStyle":"solid","strokeWidth":1.5,"strokeStyle":"solid","roughness":0.7,"opacity":100,"version":1,"versionNonce":1,"isDeleted":false,"groupIds":["step-4"],"frameId":null,"roundness":null,"boundElements":null,"updated":0,"link":null,"locked":false,"id":"shape-12","type":"text","seed":917,"x":24,"y":1340,"width":272,"height":26,"fontSize":20,"fontFamily":1,"text":"Connection 2","originalText":"Connection 2","textAlign":"left","verticalAlign":"middle","containerId":null,"lineHeight":1.3,"autoResize":false,"customData":{"revealStep":4}},{"angle":0,"strokeColor":"#6577aa","backgroundColor":"#eef1fc","fillStyle":"solid","strokeWidth":1.5,"strokeStyle":"solid","roughness":0.7,"opacity":100,"version":1,"versionNonce":1,"isDeleted":false,"groupIds":["step-4"],"frameId":null,"roundness":null,"boundElements":[{"type":"text","id":"shape-14"},{"type":"arrow","id":"shape-15"}],"updated":0,"link":null,"locked":false,"id":"shape-13","type":"rectangle","seed":990,"x":16,"y":1378,"width":288,"height":68,"customData":{"revealStep":4}},{"angle":0,"strokeColor":"#394557","backgroundColor":"transparent","fillStyle":"solid","strokeWidth":1.5,"strokeStyle":"solid","roughness":0.7,"opacity":100,"version":1,"versionNonce":1,"isDeleted":false,"groupIds":["step-4"],"frameId":null,"roundness":null,"boundElements":null,"updated":0,"link":null,"locked":false,"id":"shape-14","type":"text","seed":1063,"x":36,"y":1397.7,"width":248,"height":28.6,"fontSize":22,"fontFamily":1,"text":"Buffer Manager","originalText":"Buffer Manager","textAlign":"left","verticalAlign":"middle","containerId":"shape-13","lineHeight":1.3,"autoResize":false,"customData":{"revealStep":4}},{"angle":0,"strokeColor":"#6577aa","backgroundColor":"transparent","fillStyle":"solid","strokeWidth":2,"strokeStyle":"solid","roughness":0.4,"opacity":100,"version":1,"versionNonce":1,"isDeleted":false,"groupIds":["step-4"],"frameId":null,"roundness":null,"boundElements":null,"updated":0,"link":null,"locked":false,"id":"shape-15","type":"arrow","seed":1136,"x":36,"y":1460,"width":0,"height":28,"points":[[0,0],[0,28]],"lastCommittedPoint":null,"startBinding":{"elementId":"shape-13","focus":0,"gap":14},"endBinding":{"elementId":"shape-16","focus":0,"gap":14},"startArrowhead":null,"endArrowhead":"arrow","elbowed":false,"customData":{"revealStep":4}},{"angle":0,"strokeColor":"#628572","backgroundColor":"#edf5ee","fillStyle":"solid","strokeWidth":1.5,"strokeStyle":"solid","roughness":0.7,"opacity":100,"version":1,"versionNonce":1,"isDeleted":false,"groupIds":["step-4"],"frameId":null,"roundness":null,"boundElements":[{"type":"text","id":"shape-17"},{"type":"arrow","id":"shape-15"}],"updated":0,"link":null,"locked":false,"id":"shape-16","type":"rectangle","seed":1209,"x":16,"y":1502,"width":288,"height":236.20000000000002,"customData":{"revealStep":4}},{"angle":0,"strokeColor":"#394557","backgroundColor":"transparent","fillStyle":"solid","strokeWidth":1.5,"strokeStyle":"solid","roughness":0.7,"opacity":100,"version":1,"versionNonce":1,"isDeleted":false,"groupIds":["step-4"],"frameId":null,"roundness":null,"boundElements":null,"updated":0,"link":null,"locked":false,"id":"shape-17","type":"text","seed":1282,"x":36,"y":1520,"width":248,"height":200.20000000000002,"fontSize":22,"fontFamily":1,"text":"Media Source\nExtensions\n(MSE API)\n\nFeeds decoded\nsegments to <video>\nelement for rendering","originalText":"Media Source\nExtensions\n(MSE API)\n\nFeeds decoded\nsegments to <video>\nelement for rendering","textAlign":"left","verticalAlign":"middle","containerId":"shape-16","lineHeight":1.3,"autoResize":false,"customData":{"revealStep":4}},{"angle":0,"strokeColor":"#6577aa","backgroundColor":"#eef1fc","fillStyle":"solid","strokeWidth":1.5,"strokeStyle":"solid","roughness":0.7,"opacity":100,"version":1,"versionNonce":1,"isDeleted":false,"groupIds":["step-5"],"frameId":null,"roundness":null,"boundElements":[{"type":"text","id":"shape-19"}],"updated":0,"link":null,"locked":false,"id":"shape-18","type":"rectangle","seed":1355,"x":16,"y":1782.2,"width":288,"height":836.8000000000001,"customData":{"revealStep":5}},{"angle":0,"strokeColor":"#394557","backgroundColor":"transparent","fillStyle":"solid","strokeWidth":1.5,"strokeStyle":"solid","roughness":0.7,"opacity":100,"version":1,"versionNonce":1,"isDeleted":false,"groupIds":["step-5"],"frameId":null,"roundness":null,"boundElements":null,"updated":0,"link":null,"locked":false,"id":"shape-19","type":"text","seed":1428,"x":36,"y":1800.2,"width":248,"height":800.8000000000001,"fontSize":22,"fontFamily":1,"text":"Client-Side Video\nPlayer\n\nBuffer strategy:\n- Maintain 30s of\nforward buffer\n- Start playback\nafter 2-3 segments\nbuffered (~6-18s)\n- Prefetch: always\nhave next 2-3\nsegments downloading\n- On seek: flush\nbuffer, start\nfetching from new\nposition\n\nStartup optimization:\n- Start at lowest\nquality for first 2\nsegments\n- Switch to\nestimated best\nquality for segment\n3+\n- This gives\nsub-2-second\nstartup time","originalText":"Client-Side Video\nPlayer\n\nBuffer strategy:\n- Maintain 30s of\nforward buffer\n- Start playback\nafter 2-3 segments\nbuffered (~6-18s)\n- Prefetch: always\nhave next 2-3\nsegments downloading\n- On seek: flush\nbuffer, start\nfetching from new\nposition\n\nStartup optimization:\n- Start at lowest\nquality for first 2\nsegments\n- Switch to\nestimated best\nquality for segment\n3+\n- This gives\nsub-2-second\nstartup time","textAlign":"left","verticalAlign":"middle","containerId":"shape-18","lineHeight":1.3,"autoResize":false,"customData":{"revealStep":5}},{"angle":0,"strokeColor":"#628572","backgroundColor":"#edf5ee","fillStyle":"solid","strokeWidth":1.5,"strokeStyle":"solid","roughness":0.7,"opacity":100,"version":1,"versionNonce":1,"isDeleted":false,"groupIds":["step-6"],"frameId":null,"roundness":null,"boundElements":[{"type":"text","id":"shape-21"}],"updated":0,"link":null,"locked":false,"id":"shape-20","type":"rectangle","seed":1501,"x":16,"y":2663,"width":288,"height":150.4,"customData":{"revealStep":6}},{"angle":0,"strokeColor":"#394557","backgroundColor":"transparent","fillStyle":"solid","strokeWidth":1.5,"strokeStyle":"solid","roughness":0.7,"opacity":100,"version":1,"versionNonce":1,"isDeleted":false,"groupIds":["step-6"],"frameId":null,"roundness":null,"boundElements":null,"updated":0,"link":null,"locked":false,"id":"shape-21","type":"text","seed":1574,"x":36,"y":2681,"width":248,"height":114.4,"fontSize":22,"fontFamily":1,"text":"Video Player\n\n<video> element\n(hardware decode)","originalText":"Video Player\n\n<video> element\n(hardware decode)","textAlign":"left","verticalAlign":"middle","containerId":"shape-20","lineHeight":1.3,"autoResize":false,"customData":{"revealStep":6}}],"appState":{"viewBackgroundColor":"#fbfbf8","gridSize":null},"files":{}}