@3dsource/angular-unreal-module 0.0.146-dev.6 → 0.0.146-dev.8

package/fesm2022/3dsource-angular-unreal-module.mjs

@@ -444,6 +444,7 @@ const initialState = {
     isAfkTimerVisible: false,
     afkCountdown: 0,
     cirrusConnected: false,
+    adopted: false,
     establishingConnection: false,
     isReconnecting: false,
     viewportReady: false,
@@ -580,7 +581,11 @@ const unrealReducer = createReducer(initialState, on(changeStatusMainVideoOnScen
         },
     };
 }), on(initSignalling, (state) => {
-    return { ...state, disconnectReason: DisconnectReason.None };
+    return {
+        ...state,
+        adopted: false,
+        disconnectReason: DisconnectReason.None,
+    };
 }), on(reconnectPeerSuccess, (state) => {
     return { ...state, isReconnecting: false };
 }), on(setSignalingName, (state, { instanceName }) => {
@@ -647,6 +652,7 @@ const unrealReducer = createReducer(initialState, on(changeStatusMainVideoOnScen
     return {
         ...state,
         cirrusConnected: true,
+        adopted: true,
         ssData: ssData ?? state.ssData,
         awsInstance: {
             ...state.awsInstance,
@@ -677,6 +683,7 @@ const unrealReducer = createReducer(initialState, on(changeStatusMainVideoOnScen
     return {
         ...state,
         cirrusConnected: false,
+        adopted: false,
         dataChannelConnected: false,
         viewportReady: false,
         isVideoPlaying: false,
@@ -3668,6 +3675,7 @@ class StreamAdoptionService {
         this.store.dispatch(streamAdopted({
             machineId: parked.machineId ?? null,
             ssData: parked.ssData ?? null,
+            timings: parked.timings ?? null,
         }));
         // Hand the live socket over without re-sending `requestStream`, reusing the
         // script's correlationId (the one `requestStream` was already sent with).
@@ -4224,24 +4232,6 @@ class UnrealEffects {
             // defers `connectToSignaling`, which is what normally sets this.
             ignoreElements(), startWith(setEstablishingConnection({ value: true })))));
         });
-        // Adoption skips `connectToSignaling → getRegion`, so the region-resolving
-        // telemetry phase never fires. Replay the region waterfall (start → end →
-        // resolved) from the cached winner the prefetch reused — a near-zero-length
-        // phase that still carries the ping samples. No live ping sweep; if there is
-        // no cache the resolved event just carries empty values.
-        this.regionTelemetryOnAdopt$ = createEffect(() => {
-            return this.actions$.pipe(ofType(streamAdopted), mergeMap(() => {
-                const cached = this.regionsPingService.readCachedWinner();
-                return [
-                    regionPingFetchStart(),
-                    regionPingFetchEnd(),
-                    regionResolved({
-                        region: cached?.region_code ?? '',
-                        pingsMs: cached?.result ?? [],
-                    }),
-                ];
-            }));
-        });
     }
     canPeerReconnect() {
         return RECONNECT_CONFIG.enabled && this.signallingService.isConnected();
@@ -5543,6 +5533,19 @@ const QP_RED_THRESHOLD = 35;
 const FPS_LOW_RATIO = 0.7; // p50 fps below 70% of target
 const UNLIMITED_REFERENCE_FPS = 60;
 const SAMPLE_WINDOW_MS = 5000;
+/**
+ * Catalog phase ids the prefetch establishes invisibly. For an adopted
+ * connection their live closers are suppressed and the phases are emitted by
+ * {@link StreamStatusTelemetryService2.emitAdoptedConnection} instead, timed
+ * from the prefetch's own marks and anchored at the moment Angular reached the
+ * connect call (session start) — so the waterfall shows the time the prefetch
+ * actually SAVED, not the prefetch's page-load-parallel raw timeline.
+ */
+const PREFETCHED_PHASE_IDS = new Set([
+    'region-resolving',
+    'signaling-connection',
+    'webrtc-negotiation',
+]);
 // Persistent per-browser identifier — survives page reloads. Used to group
 // multiple sessions of the same anonymous user for funnel / retention analysis.
 const USER_ID_STORAGE_KEY = 'source3d.streamTelemetry.userId';
@@ -5573,6 +5576,17 @@ class StreamStatusTelemetryService2 {
         this.disconnectReason$ = this.store.selectSignal(unrealFeature.selectDisconnectReason);
         this.errorMessage$ = this.store.selectSignal(unrealFeature.selectErrorMessage);
         this.viewPortReady$ = this.store.selectSignal(unrealFeature.selectViewportReady);
+        /**
+         * Synchronous adoption flag. The `streamAdopted` reducer sets it BEFORE any
+         * action subscriber runs, so the connection-phase closers (which fire inside
+         * the same dispatch, e.g. `ssinfo-received` off the `ssData` state change)
+         * can read it and defer to the prefetch-timed attribution emitted by
+         * {@link emitAdoptedConnection} instead of recording the live wall-clock.
+         */
+        this.adopted$ = this.store.selectSignal(unrealFeature.selectAdopted);
+        /** Streamer identity for the adopted signaling phase params. */
+        this.ssData$ = this.store.selectSignal(unrealFeature.selectSsData);
+        this.awsInstance$ = this.store.selectSignal(unrealFeature.selectAwsInstance);
         this.session = null;
         /**
          * Whether a session has already started during the current page lifetime.
@@ -5965,6 +5979,13 @@ class StreamStatusTelemetryService2 {
                     if (!this.session)
                         return;
                     if (isCloser) {
+                        // Adopted connections receive the region / signaling / webrtc
+                        // phases from `emitAdoptedConnection` (timed from the prefetch's
+                        // own marks). Skip the live closer for those, so the whole
+                        // pre-adoption wait isn't dumped onto whichever connection closer
+                        // happens to fire first at the adoption instant.
+                        if (this.adopted$() && PREFETCHED_PHASE_IDS.has(bucket.id))
+                            return;
                         this.emitPhaseEnded(bucket, bucketIdx, value);
                         return;
                     }
@@ -5975,6 +5996,12 @@ class StreamStatusTelemetryService2 {
                 }));
             });
         });
+        // Adopted connection: emit the region / signaling / webrtc phases timed
+        // from the prefetch marks, anchored at session start (see method doc). The
+        // live closers for these phases are suppressed (PREFETCHED_PHASE_IDS).
+        sub.add(this.actions$
+            .pipe(ofType(streamAdopted))
+            .subscribe(({ timings }) => this.emitAdoptedConnection(timings)));
         const bootstrapInfo = this.collectBootstrapInfo();
         this.emitLifecycle('stream.session_started', {
             sessionId: id,
@@ -6092,6 +6119,127 @@ class StreamStatusTelemetryService2 {
             overlays,
         });
     }
+    /**
+     * Emit the region / signaling / webrtc phases for an ADOPTED connection.
+     *
+     * The prefetch script established the connection in PARALLEL with page load,
+     * so the phases are positioned at their real (anchor-relative) spans — shifted
+     * LEFT to overlap the HTML-loading / route-idle rows — rather than sequentially
+     * after them. That's the whole point of the prefetch: the handshake already
+     * happened while the page was loading. Each phase ships:
+     *  - `duration` — the real sub-step time the prefetch spent.
+     *  - `spanStartMs` — anchor-relative start, so the viewer left-shifts the bar.
+     *  - `adoptionAtMs` — where Angular took over (the next phase, Unreal
+     *    communication, resumes here on the sequential timeline).
+     *  - savings params: `prefetchConnectMs` (full handshake), `prefetchSavedMs`
+     *    (done before Angular was ready), `adoptionWaitMs` (real connect→adopted
+     *    wait), `adoptionOverheadMs` (prefetch-ready → adopted gap).
+     */
+    emitAdoptedConnection(timings) {
+        const s = this.session;
+        if (!s)
+            return;
+        const t = timings ?? {};
+        const now = performance.now();
+        // Everything in anchor-relative ms — the same scale the viewer renders on
+        // (and the prefetch marks share the page `performance` clock).
+        const toMs = (perf) => Math.round(perf - s.anchorPerf);
+        const startMs = toMs(t['prefetch_start'] ?? s.startedAtPerf);
+        const wsOpenMs = Math.max(startMs, toMs(t['ws_open'] ?? t['prefetch_start'] ?? s.startedAtPerf));
+        const readyMs = Math.max(wsOpenMs, toMs(t['ready'] ?? t['dc_open'] ?? t['ws_open'] ?? s.startedAtPerf));
+        const adoptionAtMs = toMs(now);
+        const sessionStartMs = toMs(s.startedAtPerf);
+        const sigDur = wsOpenMs - startMs;
+        const webDur = readyMs - wsOpenMs;
+        const connectMs = readyMs - startMs;
+        // Savings, anchored at the moment Angular reached the connect call.
+        const savings = {
+            prefetched: true,
+            prefetchConnectMs: connectMs,
+            // How much of the handshake finished before Angular was ready (the win).
+            prefetchSavedMs: Math.max(0, Math.min(connectMs, sessionStartMs - startMs)),
+            // The real wait Angular experienced (connect call → adopted).
+            adoptionWaitMs: Math.max(0, adoptionAtMs - sessionStartMs),
+            // Gap between the prefetch being ready and Angular adopting it.
+            adoptionOverheadMs: Math.max(0, adoptionAtMs - readyMs),
+        };
+        // Region (phaseNo 1) — served from the ping cache during prefetch (~0),
+        // positioned at the prefetch start; ship the samples.
+        const region = this.readRegionCache();
+        this.emitAdoptedPhase(0, startMs, 0, adoptionAtMs, {
+            region: region?.region_code ?? '',
+            pingsMs: region?.result.length ? `${region.result.join(', ')} ms` : null,
+        });
+        // Signaling (phaseNo 2) — [prefetch_start → ws_open]; streamer identity +
+        // savings; ws-connected marker sits at the phase's own end.
+        this.emitAdoptedPhase(1, startMs, sigDur, adoptionAtMs, {
+            ...this.adoptedSignalingParams(),
+            ...savings,
+            prefetchSignalingMs: sigDur,
+        }, [{ id: 'signaling-ws-connected', time: wsOpenMs }]);
+        // WebRTC negotiation (phaseNo 3) — [ws_open → ready].
+        this.emitAdoptedPhase(2, wsOpenMs, webDur, adoptionAtMs, {
+            iceCandidateCount: 0,
+            prefetchWebrtcMs: webDur,
+        });
+        // Unreal communication chains from the adoption moment (real wall-clock).
+        s.lastMilestonePerf = now;
+    }
+    /**
+     * Emit one adopted phase positioned at its real `spanStartMs` (left-shifted
+     * to overlap page load) with its real prefetch `duration`. `prefetched`,
+     * `spanStartMs` and `adoptionAtMs` ride as top-level wire fields the viewer
+     * uses to lay the bar out; the rest become display params.
+     */
+    emitAdoptedPhase(bucketIdx, spanStartMs, durationMs, adoptionAtMs, extras, milestones = []) {
+        const s = this.session;
+        if (!s)
+            return;
+        const bucket = this.phaseCatalog[bucketIdx];
+        this.track('stream.phase_ended', {
+            sessionId: s.id,
+            phaseNo: bucketIdx + 1,
+            id: bucket.id,
+            color: bucket.color,
+            duration: durationMs,
+            prefetched: true,
+            spanStartMs,
+            adoptionAtMs,
+            milestones,
+            params: toPhaseParams({ ...extras, prefetched: true }),
+            overlays: [],
+        });
+    }
+    /** Streamer identity params for the adopted signaling phase — mirrors the
+     *  `ssinfo-received` closer's shape (client / instanceName / …ssData). */
+    adoptedSignalingParams() {
+        const aws = this.awsInstance$();
+        const ssData = this.ssData$();
+        return {
+            client: aws?.wsUrl ?? null,
+            instanceName: aws?.instanceName ?? null,
+            ...(ssData ?? {}),
+        };
+    }
+    /** Read the region-ping cache the prefetch reused (localStorage), so the
+     *  adopted region phase can still report the winning region + samples. */
+    readRegionCache() {
+        try {
+            const raw = localStorage.getItem(REGION_PING_CACHE_KEY);
+            if (!raw)
+                return null;
+            const parsed = JSON.parse(raw);
+            return {
+                region_code: typeof parsed.region_code === 'string' ? parsed.region_code : '',
+                result: Array.isArray(parsed.result)
+                    ? parsed.result.filter((n) => typeof n === 'number')
+                    : [],
+            };
+        }
+        catch {
+            return null;
+        }
+    }
     handleWindow(samples) {
         if (!this.session)
             return;