Portrait Mobile, monitoring that moves with the patient

The wearable streams continuous oxygen saturation, pulse rate and dual-vector respiration over hospital wireless, which means occasional packet loss is the baseline reality, not an edge case. Vanilla WebSocket recovery would reconnect after a drop but leave a silent gap in the waveform — clinically unacceptable for a tool a nurse watches to catch patient deterioration. I designed the message protocol with sequence numbers, server-side buffering with replay on reconnect, and an explicit “gap detected” marker that the UI renders whenever replay isn't possible — so the absence becomes visible instead of hidden.

Waveform traces update many times per second across multiple channels. Rendering them through React → DOM → SVG would saturate the main thread under any realistic patient load. They render on Canvas, where draw throughput is much higher and rendering doesn't fight React's reconciler. Lower-frequency overlays — alarm flags, measurement labels, clinician annotations, deterioration markers — render in SVG above the Canvas, because the work there is interaction (clicking a flag to acknowledge, hovering for context) where DOM ergonomics win.

Patient-identifiable information carries rules — where it can be displayed, how long it can be retained in memory, what it can be co-logged with, what gets scrubbed from any client-side log or error report. A typical web architecture assumes the back end has handled all of this, which is fine until a debug overlay, a crash report, or a screenshot for support quietly carries protected data somewhere it shouldn't be. The front-end stack treats it as a first-class constraint: scoped data storage, no retention beyond the visible session, an error-reporter pipeline that scrubs known-protected fields before any payload leaves the browser, and audit-trail markers on every component that displays patient information.