fix(electron): show the main window once its document has loaded; enforce J1 IPC and mutation counters (#1828)

* fix(electron): show the main window once its document has loaded; enforce J1 IPC and mutation counters

Re-lands #1788, which merged into #1782's branch after #1782 had already
reached master, so none of it is on master.

The hidden main window was shown on ready-to-show only. On Linux under
X11, when the startup scripts run before the window's first frame, the
next frame comes about a second later: nothing is on screen and the
splash's requestAnimationFrame waits, so J1's first card came ~940 ms
after load instead of ~480 ms in most runner launches (18 bridge calls /
1,031-1,033 DOM mutations instead of 15 / 558).

The window is now shown at ready-to-show or the main frame's
did-finish-load, whichever comes first, with the splash colour as its
background so showing before the first paint does not flash. The journey
gate keeps the app's did-finish-load listeners away from its about:blank
detour, as it already does for ready-to-show.

Three dispatched runs on this branch (37192092882, 37192097790,
37192103151) read 15 calls and 558 mutations in all 18 iterations,
stable: true. Both become baselines (slack 0), and the Performance
journeys job checks them with check-journey-ratchet.mjs --only.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>

* chore(perf): record the evidence PR of the J1 runtime baselines

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>

---------

Co-authored-by: Claude Opus 5.5 <noreply@anthropic.com>
Co-authored-by: 4gray <fourgray@proton.me>

apps/electron-backend/src/app/services/main-window-first-show.spec.ts

@@ -0,0 +1,71 @@
+import { EventEmitter } from 'events';
+import {
+    type FirstShowWindow,
+    showMainWindowWhenLoaded,
+} from './main-window-first-show';
+
+function createWindow(): FirstShowWindow &
+    EventEmitter & {
+        webContents: EventEmitter;
+        destroyed: boolean;
+    } {
+    const window = Object.assign(new EventEmitter(), {
+        destroyed: false,
+        webContents: new EventEmitter(),
+        isDestroyed(): boolean {
+            return window.destroyed;
+        },
+    });
+    return window;
+}
+
+describe('showMainWindowWhenLoaded', () => {
+    it('shows the window at did-finish-load when ready-to-show has not fired', () => {
+        // The Linux race: the hidden window gets no frame for its first
+        // paint, so ready-to-show (and the splash's animation frame) would
+        // wait about a second after the document has loaded.
+        const window = createWindow();
+        const show = jest.fn();
+        showMainWindowWhenLoaded(window, show);
+
+        window.webContents.emit('did-finish-load');
+
+        expect(show).toHaveBeenCalledTimes(1);
+    });
+
+    it('shows the window at ready-to-show when that comes first', () => {
+        const window = createWindow();
+        const show = jest.fn();
+        showMainWindowWhenLoaded(window, show);
+
+        window.emit('ready-to-show');
+
+        expect(show).toHaveBeenCalledTimes(1);
+    });
+
+    it('shows the window only once and detaches the other listener', () => {
+        const window = createWindow();
+        const show = jest.fn();
+        showMainWindowWhenLoaded(window, show);
+
+        window.webContents.emit('did-finish-load');
+        window.emit('ready-to-show');
+        // A reload loads the document again; the window is already shown.
+        window.webContents.emit('did-finish-load');
+
+        expect(show).toHaveBeenCalledTimes(1);
+        expect(window.listenerCount('ready-to-show')).toBe(0);
+        expect(window.webContents.listenerCount('did-finish-load')).toBe(0);
+    });
+
+    it('does not show a window that was destroyed before it loaded', () => {
+        const window = createWindow();
+        const show = jest.fn();
+        showMainWindowWhenLoaded(window, show);
+
+        window.destroyed = true;
+        window.emit('ready-to-show');
+
+        expect(show).not.toHaveBeenCalled();
+    });
+});

apps/electron-backend/src/app/services/main-window-first-show.ts

@@ -0,0 +1,52 @@
+/**
+ * When the hidden main window is first shown.
+ *
+ * The window is created with `show: false` and used to be shown on
+ * `ready-to-show` only. That event needs the window's first visually
+ * non-empty paint, and a hidden window does not always get a frame for it:
+ * on Linux under X11, when the startup scripts run before that frame, the
+ * next one comes about a second later. Until then nothing is on screen and
+ * the renderer gets no animation frames, so the splash that `main.ts`
+ * removes in a `requestAnimationFrame` stays even after the dashboard has
+ * rendered (J1 on the CI runner: about 450 ms later to the first card, in
+ * roughly one launch out of three, see docs/architecture/performance-journeys.md).
+ *
+ * The window is therefore shown at whichever comes first: `ready-to-show`
+ * or the main frame's `did-finish-load`. At `did-finish-load` the inline
+ * splash is parsed and styled, and the window's `backgroundColor` matches
+ * it, so showing before the first paint does not flash.
+ */
+
+/** Matches `#initial-splash` in `apps/web/src/index.html`. */
+export const MAIN_WINDOW_BACKGROUND_COLOR = '#1f1f23';
+
+type OnceEmitter = {
+    once(event: string, listener: () => void): unknown;
+    removeListener(event: string, listener: () => void): unknown;
+};
+
+export type FirstShowWindow = OnceEmitter & {
+    isDestroyed(): boolean;
+    readonly webContents: OnceEmitter;
+};
+
+/** Calls `show` once, at `ready-to-show` or `did-finish-load`, whichever comes first. */
+export function showMainWindowWhenLoaded(
+    window: FirstShowWindow,
+    show: () => void
+): void {
+    let shown = false;
+    const showOnce = (): void => {
+        if (shown) {
+            return;
+        }
+        shown = true;
+        window.removeListener('ready-to-show', showOnce);
+        window.webContents.removeListener('did-finish-load', showOnce);
+        if (!window.isDestroyed()) {
+            show();
+        }
+    };
+    window.once('ready-to-show', showOnce);
+    window.webContents.once('did-finish-load', showOnce);
+}