fix(cbz): attach resize observer via callback ref + drop vh from scroll-mode geometry deps — fixes constant per-page gaps and refetch storm on mobile

frontend/src/readers/CbzReader.tsx

@@ -106,22 +106,26 @@ export default function CbzReader({ book, initialLocator, initialPercent, chrome
   const [mode, setMode] = useStoredMode();
   const fitH = mode === "fit";
 
+  // vh 只在适高模式参与几何;滚动模式里地址栏收展改 vh 不得重建(会丢全部实测页高→页间错位+重挂图请求风暴)
   const ph = useMemo(
     () => new PageHeights(count, fitH ? vh : width * ratio.current),
-    [count, width, vh, fitH],
+    [count, width, fitH ? vh : 0],
   );
 
-  // 容器尺寸自适应(尺寸变化后重建 PageHeights,阅读位置以当前滚动值为准)
-  useEffect(() => {
-    const el = boxRef.current;
+  // 容器尺寸自适应:回调 ref 在滚动盒真正挂载时才观测(等页数请求期间的早退渲染里没有这个节点)
+  const roRef = useRef<ResizeObserver | null>(null);
+  function attachBox(el: HTMLDivElement | null) {
+    boxRef.current = el;
+    roRef.current?.disconnect();
+    roRef.current = null;
     if (!el) return;
     const ro = new ResizeObserver(() => {
       setWidth(Math.min(el.clientWidth, MAX_W));
       setVh(el.clientHeight);
     });
     ro.observe(el);
-    return () => ro.disconnect();
-  }, []);
+    roRef.current = ro;
+  }
 
   // 首次拿到 count 后恢复进度页
   useEffect(() => {
@@ -222,7 +226,7 @@ export default function CbzReader({ book, initialLocator, initialPercent, chrome
       }}
     >
       <div
-        ref={boxRef}
+        ref={attachBox}
         onScroll={onScroll}
         onClick={onZoneClick}
         className={"h-full overflow-y-auto" + (mode !== "scroll" ? " snap-y snap-proximity" : "")}