akanjs 3.1.1 → 3.1.2-rc.0

package/server/routeElementComposer.tsx

@@ -12,6 +12,7 @@ import { Children, cloneElement, isValidElement, type ReactElement, type ReactNo
 import { getExplicitPageConfigKeys, resolvePageState } from "../client/frameConfig";
 import { RouteGuards } from "../client/route/RouteGuards";
 import { resolveHeadResult } from "./head";
+import { RouteShellGate } from "./routeShellGate";
 import {
   type AkanRouteSegmentState,
   createAkanRouteSegments,
@@ -73,12 +74,14 @@ export class RouteElementComposer {
     searchParams,
     navKey,
     notFound,
+    gate,
   }: {
     pathRoute: PathRoute;
     params: Record<string, string>;
     searchParams: Record<string, string | string[]>;
     navKey?: string;
     notFound?: RouteNotFoundInPlace;
+    gate?: RouteShellGate;
   }): ReactNode {
     return RouteElementComposer.composeRenders({
       renders: RouteElementComposer.#getRenderStack(pathRoute),
@@ -87,6 +90,7 @@ export class RouteElementComposer {
       searchParams,
       navKey,
       notFound,
+      gate,
     });
   }
 
@@ -205,6 +209,7 @@ export class RouteElementComposer {
     pathname,
     error,
     digest,
+    gate,
   }: {
     kind: "not-found" | "error";
     route: PathRoute | LayoutFallbackRoute;
@@ -213,6 +218,7 @@ export class RouteElementComposer {
     pathname: string;
     error?: unknown;
     digest?: string;
+    gate?: RouteShellGate;
   }): Promise<ReactNode | null> {
     const layoutStack = [...route.renderRootLayouts, ...route.renderLayouts];
     for (let index = layoutStack.length - 1; index >= 0; index--) {
@@ -225,7 +231,7 @@ export class RouteElementComposer {
         ...layoutStack.slice(0, index + 1),
         RouteElementComposer.#makeFallbackRouteRender({ kind, fallback, pathname, error, digest }),
       ];
-      return RouteElementComposer.composeRenders({ renders, params, searchParams });
+      return RouteElementComposer.composeRenders({ renders, params, searchParams, gate });
     }
     return null;
   }
@@ -238,6 +244,7 @@ export class RouteElementComposer {
     searchParams,
     navKey,
     notFound,
+    gate,
   }: {
     renders: RouteRender[];
     /** Layouts above `renders` that this element leaves out (a patch) but whose `.notFound()` still applies. */
@@ -247,7 +254,10 @@ export class RouteElementComposer {
     searchParams: Record<string, string | string[]>;
     navKey?: string;
     notFound?: RouteNotFoundInPlace;
+    /** Holds the response until every level above the first `.loading()` has rendered. */
+    gate?: RouteShellGate;
   }): ReactNode {
+    const levelGates = gate ? RouteElementComposer.#gateLevels(renders, gate) : [];
     let element: ReactNode = null;
     for (let i = renders.length - 1; i >= 0; i--) {
       const routeRender = renders[i];
@@ -255,16 +265,23 @@ export class RouteElementComposer {
       const loadingFallback = RouteElementComposer.#composeLoadingFallback(renders.slice(i), params);
       const suspenseKey =
         navKey && loadingFallback != null && i === renders.length - 1 ? `akan-loading:${navKey}` : undefined;
+      const levelGate = levelGates[i];
+      const level = (
+        <RouteElementComposer.AsyncRender
+          routeRender={routeRender}
+          params={params}
+          searchParams={searchParams}
+          notFound={notFound ? { ...notFound, owners: [...owners, ...renders.slice(0, i)] } : undefined}
+          gate={levelGate}
+        >
+          {element}
+        </RouteElementComposer.AsyncRender>
+      );
+      
       element = (
         <Suspense key={suspenseKey} fallback={loadingFallback}>
-          <RouteElementComposer.AsyncRender
-            routeRender={routeRender}
-            params={params}
-            searchParams={searchParams}
-            notFound={notFound ? { ...notFound, owners: [...owners, ...renders.slice(0, i)] } : undefined}
-          >
-            {element}
-          </RouteElementComposer.AsyncRender>
+          {level}
+          {routeRender.Loading && levelGate ? <RouteShellGate.Wait until={levelGate.opened} /> : null}
         </Suspense>
       );
       const segment = segments?.[i];
@@ -286,13 +303,16 @@ export class RouteElementComposer {
     params,
     searchParams,
     notFound,
+    gate,
   }: {
     routeRender: RouteRender;
     children: ReactNode;
     params: Record<string, string>;
     searchParams: Record<string, string | string[]>;
     notFound?: RouteNotFoundInPlace & { owners: RouteRender[] };
+    gate?: RouteShellGate;
   }) => {
+    gate?.enter();
     try {
       return RouteElementComposer.#normalizeReactNode(
         await routeRender.render({ children, params, searchParams } as never),
@@ -301,6 +321,8 @@ export class RouteElementComposer {
       if (!notFound || (error as { digest?: unknown } | null)?.digest !== "AKAN_NOT_FOUND") throw error;
       notFound.onNotFound();
       return await RouteElementComposer.#renderNotFoundInPlace(notFound, params, searchParams);
+    } finally {
+      gate?.leave();
     }
   };
 
@@ -380,6 +402,17 @@ export class RouteElementComposer {
     return [...layoutConfigs, ...(pageConfig ? [pageConfig] : [])];
   }
 
+  static #gateLevels(renders: RouteRender[], gate: RouteShellGate): RouteShellGate[] {
+    let current = gate;
+    const gates = renders.map((routeRender) => {
+      if (routeRender?.Loading) current = new RouteShellGate();
+      return current;
+    });
+    for (const levelGate of new Set([gate, ...gates]))
+      levelGate.hold(gates.filter((held, index) => held === levelGate && renders[index]).length);
+    return gates;
+  }
+
   static #composeLoadingFallback(renders: RouteRender[], params: Record<string, string>): ReactNode {
     let element: ReactNode = null;
     for (let i = renders.length - 1; i >= 0; i--) {

package/server/routeShellGate.ts

@@ -0,0 +1,42 @@
+export class RouteShellGate {
+  
+  static Wait = async ({ until }: { until: Promise<null> }) => await until;
+
+  readonly opened: Promise<null>;
+  #open: () => void = () => undefined;
+  #holding = false;
+  #rendering = 0;
+  #activity = 0;
+
+  constructor() {
+    this.opened = new Promise<null>((resolve) => {
+      this.#open = () => resolve(null);
+    });
+  }
+
+  get holding(): boolean {
+    return this.#holding;
+  }
+
+  hold(levels: number): void {
+    this.#holding = levels > 0;
+    if (levels === 0) this.#open();
+  }
+
+  enter(): void {
+    this.#rendering += 1;
+    this.#activity += 1;
+  }
+
+  leave(): void {
+    this.#rendering -= 1;
+    const activity = ++this.#activity;
+    setImmediate(() =>
+      setImmediate(() => {
+        if (this.#rendering > 0 || this.#activity !== activity) return;
+        this.#holding = false;
+        this.#open();
+      }),
+    );
+  }
+}

package/server/routing/apiRouter.ts

@@ -15,6 +15,7 @@ import { SignalResolver } from "../resolver";
 import type { HttpRoutes, SignalRouteOptions, WebsocketRoutes } from "../types";
 import { AppWsData } from "./appWsData";
 import type { HostAllowlist } from "./hostAllowlist";
+import { ServerLimits } from "./serverLimits";
 import { WsUpgrade } from "./wsUpgrade";
 
 export interface HmrStateSource {
@@ -43,6 +44,10 @@ export interface ApiRouteInputs {
   upgradeAppWs: (req: Request, data: AppWsData) => boolean;
   webProxyRunner?: WebProxyRunner | null;
   hostAllowlist?: HostAllowlist | null;
+  bodyLimits?: ServerLimits | null;
+  /** Off behind the gateway, which already counted the chunked body it streams on. */
+  countChunkedBodies?: boolean;
+  idleTimeout?: number;
 }
 
 type RouteValue = NonNullHttpRoutes[keyof NonNullHttpRoutes];
@@ -72,6 +77,9 @@ export class ApiRouter {
     upgradeAppWs,
     webProxyRunner,
     hostAllowlist,
+    bodyLimits,
+    countChunkedBodies = true,
+    idleTimeout = 0,
   }: ApiRouteInputs): NonNullHttpRoutes {
     const endpointEntries = Object.entries(routes ?? {}).map(
       ([p, handler]) =>
@@ -109,7 +117,11 @@ export class ApiRouter {
       served,
       new Set([...endpointEntries.map(([path]) => path), ...Object.keys(renderEnvRoutes ?? {})]),
     );
-    return ApiRouter.#dropForgedForwarding(hostAllowlist ? ApiRouter.#guardHosts(swept, hostAllowlist) : swept);
+    const limited = bodyLimits ? ApiRouter.#limitBodies(swept, bodyLimits, countChunkedBodies) : swept;
+    const routed = ApiRouter.#dropForgedForwarding(
+      hostAllowlist ? ApiRouter.#guardHosts(limited, hostAllowlist) : limited,
+    );
+    return idleTimeout ? ApiRouter.#holdOpen(routed, idleTimeout) : routed;
   }
 
   static buildWebsocketHandlers({
@@ -257,6 +269,57 @@ export class ApiRouter {
     ) as NonNullHttpRoutes;
   }
 
+  static #limitBodies(routes: NonNullHttpRoutes, limits: ServerLimits, countChunked: boolean): NonNullHttpRoutes {
+    return Object.fromEntries(
+      Object.entries(routes).map(([path, route]) => [
+        path,
+        route instanceof Response
+          ? route
+          : ApiRouter.#mapRoute(route, (handler) => (req) => {
+              const refused = limits.refuseDeclared(req);
+              if (refused) return refused;
+              const limit = countChunked && !req.headers.has("content-length") ? limits.bodyLimitOf(req) : null;
+              if (limit === null || !req.body) return handler(req);
+              let exceeded = false;
+              const body = ServerLimits.limitBody(req.body, limit, () => {
+                exceeded = true;
+              });
+              const counted = new Request(req.url, {
+                method: req.method,
+                headers: req.headers,
+                body,
+                signal: req.signal,
+                duplex: "half",
+              } as RequestInit);
+              return (async () => {
+                try {
+                  const response = await handler(copyBunRequestFields(counted, req));
+                  return exceeded ? ServerLimits.payloadTooLarge() : response;
+                } catch (error) {
+                  if (exceeded) return ServerLimits.payloadTooLarge();
+                  throw error;
+                }
+              })();
+            }),
+      ]),
+    ) as NonNullHttpRoutes;
+  }
+
+  static #holdOpen(routes: NonNullHttpRoutes, idleTimeout: number): NonNullHttpRoutes {
+    return Object.fromEntries(
+      Object.entries(routes).map(([path, route]) => [
+        path,
+        route instanceof Response
+          ? route
+          : ApiRouter.#mapRoute(
+              route,
+              (handler) => (req, server?: Bun.Server<unknown>) =>
+                server ? ServerLimits.holdOpen(server, req, idleTimeout, () => handler(req)) : handler(req),
+            ),
+      ]),
+    ) as NonNullHttpRoutes;
+  }
+
   static #guardHosts(routes: NonNullHttpRoutes, allowlist: HostAllowlist): NonNullHttpRoutes {
     return Object.fromEntries(
       Object.entries(routes).map(([path, route]) => [

package/server/routing/serverLimits.ts

@@ -0,0 +1,151 @@
+import fs from "node:fs";
+import { Logger } from "akanjs/common";
+
+type Env = Record<string, string | undefined>;
+
+export class ServerLimits {
+  
+  static readonly maxIdleSeconds = 255;
+  static readonly defaultIdleSeconds = 120;
+  static readonly defaultUploadBodyBytes = 128 * 1024 * 1024;
+  static readonly defaultRequestBodyBytes = 16 * 1024 * 1024;
+  static readonly loopbackHost = "127.0.0.1";
+  static readonly #agentTurnPath = "/runAgentTurn";
+  static readonly #tooLarge = new Error("Request body is over the server's limit");
+  static readonly #logger = new Logger("ServerLimits");
+  static readonly #warned = new Set<string>();
+
+  readonly idleTimeout: number;
+  readonly wsIdleTimeout: number;
+  readonly uploadBodyBytes: number;
+  readonly requestBodyBytes: number | null;
+
+  constructor(env: Env = process.env) {
+    const devHosted = env.AKAN_COMMAND_TYPE === "start";
+    this.idleTimeout = ServerLimits.#seconds(env, "AKAN_IDLE_TIMEOUT", devHosted ? 0 : ServerLimits.defaultIdleSeconds);
+    this.wsIdleTimeout = ServerLimits.#seconds(env, "AKAN_WS_IDLE_TIMEOUT", ServerLimits.defaultIdleSeconds);
+    this.uploadBodyBytes = ServerLimits.#bytes(env, "AKAN_MAX_UPLOAD_BODY", ServerLimits.defaultUploadBodyBytes);
+    const requestBody = env.AKAN_MAX_REQUEST_BODY?.trim();
+    this.requestBodyBytes =
+      requestBody === "0" || requestBody?.toLowerCase() === "off"
+        ? null
+        : Math.min(
+            ServerLimits.#bytes(env, "AKAN_MAX_REQUEST_BODY", ServerLimits.defaultRequestBodyBytes),
+            this.uploadBodyBytes,
+          );
+  }
+
+  static async holdOpen<T extends Response | undefined>(
+    server: Pick<Bun.Server<unknown>, "timeout">,
+    req: Request,
+    idleTimeout: number,
+    handle: () => T | Promise<T>,
+  ): Promise<T> {
+    if (!idleTimeout) return await handle();
+    server.timeout(req, 0);
+    let upgraded = false;
+    try {
+      const response = await handle();
+      upgraded = response === undefined;
+      return response;
+    } finally {
+      if (!upgraded) server.timeout(req, idleTimeout);
+    }
+  }
+
+  static listenHostname(env: Env = process.env, inContainer = ServerLimits.#inContainer(env)): string | undefined {
+    const explicit = env.AKAN_LISTEN_HOST?.trim();
+    if (explicit) return explicit === "*" ? undefined : explicit;
+    return env.AKAN_COMMAND_TYPE === "start" && !inContainer ? ServerLimits.loopbackHost : undefined;
+  }
+
+  static serveOwnerOnly<T>(socketPath: string, serve: () => T): T {
+    const previous = process.umask(0o177);
+    try {
+      return serve();
+    } finally {
+      process.umask(previous);
+      try {
+        fs.chmodSync(socketPath, 0o600);
+      } catch {
+      }
+    }
+  }
+
+  static #inContainer(env: Env): boolean {
+    if (env.KUBERNETES_SERVICE_HOST) return true;
+    return fs.existsSync("/.dockerenv") || fs.existsSync("/run/.containerenv");
+  }
+
+  static #seconds(env: Env, name: string, fallback: number): number {
+    const raw = env[name]?.trim();
+    if (!raw) return fallback;
+    const match = /^(\d+)\s*s?$/i.exec(raw);
+    if (match) return Math.min(Number(match[1]), ServerLimits.maxIdleSeconds);
+    ServerLimits.#warnUnread(name, raw, "seconds such as 30 or 30s", `${fallback} s`);
+    return fallback;
+  }
+
+  static #bytes(env: Env, name: string, fallback: number): number {
+    const raw = env[name]?.trim();
+    if (!raw) return fallback;
+    const match = /^(\d+(?:\.\d+)?)\s*(?:([kmg])(?:i?b)?|b)?$/i.exec(raw);
+    const unit = match?.[2]?.toLowerCase();
+    const scale = unit === "g" ? 1024 ** 3 : unit === "m" ? 1024 ** 2 : unit === "k" ? 1024 : 1;
+    const bytes = match ? Math.floor(Number(match[1]) * scale) : 0;
+    if (bytes > 0) return bytes;
+    ServerLimits.#warnUnread(name, raw, "a size such as 512mb, 1.5g or 16MiB", `${fallback / 1024 ** 2} MiB`);
+    return fallback;
+  }
+
+  static #warnUnread(name: string, raw: string, expected: string, fallback: string) {
+    const key = `${name}=${raw}`;
+    if (ServerLimits.#warned.has(key)) return;
+    ServerLimits.#warned.add(key);
+    ServerLimits.#logger.warn(`${name}="${raw}" is not ${expected}; using ${fallback}.`);
+  }
+
+  bodyLimitOf(req: Request): number | null {
+    if (this.requestBodyBytes === null || req.method === "GET" || req.method === "HEAD") return null;
+    const type = req.headers.get("content-type")?.toLowerCase() ?? "";
+    if (type.startsWith("multipart/form-data")) return null;
+    return new URL(req.url).pathname.endsWith(ServerLimits.#agentTurnPath) ? null : this.requestBodyBytes;
+  }
+
+  refuseDeclared(req: Request): Response | null {
+    const limit = this.bodyLimitOf(req);
+    const declared = req.headers.get("content-length");
+    if (limit === null || declared === null) return null;
+    return Number(declared) > limit ? ServerLimits.payloadTooLarge() : null;
+  }
+
+  static limitBody(
+    body: ReadableStream<Uint8Array>,
+    limit: number,
+    onExceeded?: () => void,
+  ): ReadableStream<Uint8Array> {
+    let seen = 0;
+    return body.pipeThrough(
+      new TransformStream<Uint8Array, Uint8Array>({
+        transform(chunk, controller) {
+          seen += chunk.byteLength;
+          if (seen <= limit) return controller.enqueue(chunk);
+          onExceeded?.();
+          controller.error(ServerLimits.#tooLarge);
+        },
+      }),
+    );
+  }
+
+  static payloadTooLarge(): Response {
+    return new Response("Payload Too Large", {
+      status: 413,
+      headers: { "content-type": "text/plain; charset=utf-8", "cache-control": "no-store", connection: "close" },
+    });
+  }
+
+  static isPayloadTooLarge(error: unknown): boolean {
+    if (error === ServerLimits.#tooLarge) return true;
+    return !!error && typeof error === "object" && (error as { cause?: unknown }).cause === ServerLimits.#tooLarge;
+  }
+}

package/server/routing/soloAppRoutes.ts

@@ -1,4 +1,5 @@
 import type { AkanChildRole, AkanMetricsReport } from "akanjs/service";
+import { SignalContext } from "akanjs/signal";
 import { AppInfo } from "../ops/appInfo";
 import type { OpsRoute } from "../ops/opsRoute";
 import { StatusAccess } from "../ops/statusAccess";
@@ -14,7 +15,7 @@ export interface SoloAppStatus {
 
 export const createSoloAppRoutes = (
   read: () => SoloAppStatus,
-  logStream: { handle(req: Request): Response } | null = null,
+  logStream: { handle(req: Request, client?: string | null): Response } | null = null,
   ops: OpsRoute | null = null,
   access = StatusAccess.fromEnv(),
 ): HttpRoutes => {
@@ -32,22 +33,32 @@ export const createSoloAppRoutes = (
   return {
     "/_akan/app/health": {
       GET: (req: Request) =>
-        access.health(req, () => ({ status: read().status, pid: process.pid, solo: true, children: [child()] })),
+        access.health(
+          req,
+          () => ({ status: read().status, pid: process.pid, solo: true, children: [child()] }),
+          SignalContext.clientIpOf(req),
+        ),
     },
     "/_akan/app/metrics": {
       GET: (req: Request) =>
-        access.metrics(req, () => ({
-          rooms: 0,
-          sockets: 0,
-          solo: true,
-          gateway: null,
-          proxyHop: null,
-          children: [{ ...child(), metrics: read().metrics }],
-        })),
+        access.metrics(
+          req,
+          () => ({
+            rooms: 0,
+            sockets: 0,
+            solo: true,
+            gateway: null,
+            proxyHop: null,
+            children: [{ ...child(), metrics: read().metrics }],
+          }),
+          SignalContext.clientIpOf(req),
+        ),
     },
     [AppInfo.publicPath]: { GET: () => AppInfo.handlePublic() },
     "/_akan/bench/ping": { GET: () => new Response("ok") },
-    ...(logStream ? { "/_akan/app/logs": { GET: (req: Request) => logStream.handle(req) } } : {}),
-    ...(ops ? { "/_akan/ops/*": (req: Request) => ops.handle(req) } : {}),
+    ...(logStream
+      ? { "/_akan/app/logs": { GET: (req: Request) => logStream.handle(req, SignalContext.clientIpOf(req)) } }
+      : {}),
+    ...(ops ? { "/_akan/ops/*": (req: Request) => ops.handle(req, SignalContext.clientIpOf(req)) } : {}),
   };
 };

package/server/rscClient.tsx

@@ -365,10 +365,11 @@ function forgetPagesOfAnotherAccount(): void {
 
 function Root(): ReactNode {
   const [thenable, setThenable] = useState<RscThenable>(initialThenable);
-  const [scrollRequest, setScrollRequest] = useState<{ scrollY: number } | null>(null);
+  const [scrollRequest, setScrollRequest] = useState<{ scrollY: number; hash?: string } | null>(null);
 
   useLayoutEffect(() => {
-    if (scrollRequest) scrollRestoration.scrollTo(scrollRequest.scrollY);
+    if (scrollRequest?.hash) scrollRestoration.scrollToHash(scrollRequest.hash, scrollRequest.scrollY);
+    else if (scrollRequest) scrollRestoration.scrollTo(scrollRequest.scrollY);
   }, [scrollRequest]);
 
   globalThis.__AKAN_RSC_CLEAR_CACHE__ = () => {
@@ -458,7 +459,8 @@ function Root(): ReactNode {
     let ownsEntry = !!options.replace;
     const replaceOnRedirect = () => ownsEntry;
     const scrollY = options.scrollY ?? ((options.scrollToTop ?? true) ? 0 : undefined);
-    const requestScroll = scrollY === undefined ? undefined : () => setScrollRequest({ scrollY });
+    const hash = options.scrollY === undefined ? new URL(target).hash : "";
+    const requestScroll = scrollY === undefined ? undefined : () => setScrollRequest({ scrollY, hash });
     try {
       let nextNode = rscCache.get(target);
       let notFound = false;

package/server/rscScrollRestoration.ts

@@ -1,4 +1,5 @@
 const RESTORE_WINDOW_MS = 2000;
+const FRAGMENT_WAIT_MS = 10_000;
 const PERSIST_DELAY_MS = 200;
 const userScrollEvents = ["wheel", "touchstart", "keydown", "pointerdown"] as const;
 
@@ -68,7 +69,55 @@ export class RscScrollRestoration {
     const observer = new ResizeObserver(() => {
       if (Math.abs(window.scrollY - scrollY) > 1) window.scrollTo(0, scrollY);
     });
-    const timer = setTimeout(() => cancel(), RESTORE_WINDOW_MS);
+    observer.observe(document.body);
+    this.#holdWhile(observer, RESTORE_WINDOW_MS);
+  }
+
+  scrollToHash(hash: string, fallbackScrollY = 0) {
+    this.#cancelPending?.();
+    const id = RscScrollRestoration.#fragmentIdOf(hash);
+    const shownTarget = () => {
+      const target = id ? document.getElementById(id) : null;
+      return target?.closest("[hidden]") ? null : target;
+    };
+    const target = shownTarget();
+    if (target) {
+      target.scrollIntoView();
+      return;
+    }
+    window.scrollTo(0, fallbackScrollY);
+    if (!id || typeof MutationObserver === "undefined") return;
+    const observer = new MutationObserver(() => {
+      const appeared = shownTarget();
+      if (!appeared) return;
+      cancel();
+      appeared.scrollIntoView();
+    });
+    observer.observe(document.documentElement, { childList: true, subtree: true });
+    const cancel = this.#holdWhile(observer, FRAGMENT_WAIT_MS);
+  }
+
+  restoreDocumentLoad() {
+    if (window.history.scrollRestoration === "manual") {
+      this.#manual = true;
+      const { scrollY } = RscScrollRestoration.#entryOf(window.history.state);
+      if (scrollY !== undefined) {
+        this.scrollTo(scrollY);
+        return;
+      }
+    }
+    
+    if (window.location.hash && window.scrollY === 0 && !RscScrollRestoration.#isRevisit())
+      this.scrollToHash(window.location.hash);
+  }
+
+  static #isRevisit(): boolean {
+    const [entry] = (performance.getEntriesByType?.("navigation") ?? []) as PerformanceNavigationTiming[];
+    return entry?.type === "reload" || entry?.type === "back_forward";
+  }
+
+  #holdWhile(observer: { disconnect: () => void }, windowMs: number): () => void {
+    const timer = setTimeout(() => cancel(), windowMs);
     const cancel = () => {
       observer.disconnect();
       clearTimeout(timer);
@@ -76,15 +125,8 @@ export class RscScrollRestoration {
       if (this.#cancelPending === cancel) this.#cancelPending = null;
     };
     for (const type of userScrollEvents) window.addEventListener(type, cancel, { capture: true, passive: true });
-    observer.observe(document.body);
     this.#cancelPending = cancel;
-  }
-
-  restoreDocumentLoad() {
-    if (window.history.scrollRestoration !== "manual") return;
-    this.#manual = true;
-    const { scrollY } = RscScrollRestoration.#entryOf(window.history.state);
-    if (scrollY !== undefined) this.scrollTo(scrollY);
+    return cancel;
   }
 
   #schedulePersist() {
@@ -123,6 +165,15 @@ export class RscScrollRestoration {
     window.history.replaceState({ ...state, __akanRouter: { ...state.__akanRouter, ...fields } }, "");
   }
 
+  static #fragmentIdOf(hash: string): string {
+    const raw = hash.startsWith("#") ? hash.slice(1) : hash;
+    try {
+      return decodeURIComponent(raw);
+    } catch {
+      return raw;
+    }
+  }
+
   static #mintKey() {
     return `${Date.now().toString(36)}${Math.random().toString(36).slice(2, 10)}`;
   }