Bridge lifecycle

Every HUD goes through the same six-step handshake. Knowing where you are in the sequence makes timing bugs easy to spot.

Sequence

1. UE   Create/Add HUD widget          → CEF starts loading URL
2. UE   Page DOM ready                 → BindUObject("bridge", component)
                                        window.ue.bridge is now callable
3. UE   Page fully loaded              → injects 'ue5-bridge-ready' CustomEvent
                                        carrying { version: "1", initialState: {...} }
4. Web  Receives 'ue5-bridge-ready'    → calls window.ue.bridge.onreactready()
5. UE   OnReactReady() fires           → flushes queued events
                                        OnReactReadyEvent BP delegate fires
6. ★ Bridge is live — events flow both ways ★

The event queue

React may parse and execute before UE finishes injecting window.ue.bridge. Any Push* calls during that window would be lost without buffering.

• All UE → React events sent before step 5 are queued.
• The queue is flushed in order the moment React calls onreactready().
• Max size is MaxEventQueueSize in Project Settings → Plugins → Unreal React Bridge, default 100.
• When the queue is full, the oldest event is dropped and OnBridgeError fires with EventQueueFull.

LoadURL restarts the sequence

Calling LoadURL() on a HUD widget tears down the page and re-runs steps 1–6. Bind OnReactReadyEvent if you need to re-push state on navigation.

Watch out

WARNING

UE → React before step 4 is queued (good) or dropped if the queue is full (warn). Increase MaxEventQueueSize if you push large initial bursts.

WARNING

React calling send before step 4 is a no-op. The SDK guards this internally — if you write your own bridge wrapper, gate calls behind ue5-bridge-ready.

WARNING

OnBridgeError(FBridgeErrorInfo) fires on ReactNotReady, JSONParseError, JavaScriptError, EventQueueFull, and more. Always bind it during development.

Reference: Bridge Protocol v1 · Types.