@mindexec/cli 0.2.431 → 0.2.433

package/wwwroot/_content/MindExecution.Shared/js/mind-map-lod-renderer.js

@@ -924,10 +924,10 @@
             // Create initial texture array
             this._createTextureArray();
 
-            // Line data cache & texture (for actual text-based lines)
-            this.maxInstances = 10000;
-            this.lineDataCache = new Map(); // nodeId -> { signature, lineCount, lineLengths }
-            this.lineDataArray = new Uint8Array(this.maxInstances * MAX_LINE_SAMPLES);
+            this.maxInstances = 10000;
+            this.lineDataCache = new Map();
+            this.lineTextureRows = window.MindMapRenderPlan?.initialLineTextureRows?.(this.maxInstances) || this.maxInstances;
+            this.lineDataArray = new Uint8Array(this.lineTextureRows * MAX_LINE_SAMPLES);
             this.lineDataTexture = null;
             this.lineDataDirty = true;
             this._lastInstanceCount = 0;
@@ -1211,7 +1211,7 @@
                 return this.imageAtlasFreeSlots.pop();
             }
 
-            if (this.imageAtlasNextSlot >= IMAGE_LOD_ATLAS_MAX_SLOTS) {
+            if (this.imageAtlasNextSlot >= (this.imageAtlasMaxSlots || IMAGE_LOD_ATLAS_MAX_SLOTS)) {
                 return -1;
             }
 
@@ -1219,9 +1219,10 @@
         }
 
         _getImageAtlasUvRect(slotIndex) {
-            const col = slotIndex % IMAGE_LOD_ATLAS_COLUMNS;
-            const row = Math.floor(slotIndex / IMAGE_LOD_ATLAS_COLUMNS);
-            const invAtlas = 1 / IMAGE_LOD_ATLAS_SIZE;
+            const columns = this.imageAtlasColumns || IMAGE_LOD_ATLAS_COLUMNS;
+            const col = slotIndex % columns;
+            const row = Math.floor(slotIndex / columns);
+            const invAtlas = 1 / (this.imageAtlasSize || IMAGE_LOD_ATLAS_SIZE);
             const inset = 1.0;
             return [
                 (col * IMAGE_LOD_THUMBNAIL_SIZE + inset) * invAtlas,
@@ -1232,7 +1233,7 @@
         }
 
         _getImagePlaceholderUvRect() {
-            const invAtlas = 1 / IMAGE_LOD_ATLAS_SIZE;
+            const invAtlas = 1 / (this.imageAtlasSize || IMAGE_LOD_ATLAS_SIZE);
             return [invAtlas, invAtlas, invAtlas, invAtlas];
         }
 
@@ -1583,8 +1584,9 @@
                 return false;
             }
 
-            const col = slot.slotIndex % IMAGE_LOD_ATLAS_COLUMNS;
-            const row = Math.floor(slot.slotIndex / IMAGE_LOD_ATLAS_COLUMNS);
+            const columns = this.imageAtlasColumns || IMAGE_LOD_ATLAS_COLUMNS;
+            const col = slot.slotIndex % columns;
+            const row = Math.floor(slot.slotIndex / columns);
             const x = col * IMAGE_LOD_THUMBNAIL_SIZE;
             const y = row * IMAGE_LOD_THUMBNAIL_SIZE;
             const size = IMAGE_LOD_THUMBNAIL_SIZE;
@@ -1712,8 +1714,8 @@
             if (!this.lineDataTexture) {
                 this.lineDataTexture = new THREE.DataTexture(
                     this.lineDataArray,
-                    MAX_LINE_SAMPLES,
-                    this.maxInstances,
+                    MAX_LINE_SAMPLES,
+                    this.lineTextureRows,
                     THREE.RedFormat,
                     THREE.UnsignedByteType
                 );
@@ -1734,14 +1736,7 @@
                     atlasContext.fillRect(0, 0, IMAGE_LOD_ATLAS_SIZE, IMAGE_LOD_ATLAS_SIZE);
                 }
                 this.imageAtlasTexture = new THREE.CanvasTexture(this.imageAtlasCanvas);
-                this.imageAtlasTexture.colorSpace = THREE.SRGBColorSpace;
-                this.imageAtlasTexture.minFilter = THREE.LinearFilter;
-                this.imageAtlasTexture.magFilter = THREE.LinearFilter;
-                this.imageAtlasTexture.wrapS = THREE.ClampToEdgeWrapping;
-                this.imageAtlasTexture.wrapT = THREE.ClampToEdgeWrapping;
-                this.imageAtlasTexture.flipY = false;
-                this.imageAtlasTexture.generateMipmaps = false;
-                this.imageAtlasTexture.needsUpdate = true;
+                window.MindMapRenderPlan?.configureImageAtlasTexture?.(this.imageAtlasTexture, THREE);
             }
 
             const nodeVertexShader = `
@@ -1954,6 +1949,7 @@
                 polygonOffsetUnits: -10.0
             });
 
+            const imageAtlasOutputColorChunk = window.MindMapRenderPlan?.getImageAtlasOutputColorChunk?.(THREE) || '';
             const imageLodMaterial = new THREE.ShaderMaterial({
                 uniforms: {
                     uImageAtlas: { value: this.imageAtlasTexture },
@@ -2014,7 +2010,7 @@
                         color = mix(color, borderColor, borderMask * (vSelected > 0.5 ? 0.92 : 0.36));
 
                         gl_FragColor = vec4(color, 1.0);
-                        #include <colorspace_fragment>
+                        ${imageAtlasOutputColorChunk}
                     }
                 `,
                 transparent: false,
@@ -2154,7 +2150,7 @@
             const lineMaterial = new THREE.ShaderMaterial({
                 uniforms: {
                     uLineDataTex: { value: this.lineDataTexture },
-                    uLineDataSize: { value: new THREE.Vector2(MAX_LINE_SAMPLES, this.maxInstances) },
+                    uLineDataSize: { value: new THREE.Vector2(MAX_LINE_SAMPLES, this.lineTextureRows) },
                     uLineHeightPx: { value: LINE_HEIGHT_PX },
                     uLinePaddingPx: { value: LINE_PADDING_PX },
                     uLineHalfThicknessPx: { value: LOD_TEXT_LINE_HALF_THICKNESS_SCREEN_PX },
@@ -2727,43 +2723,6 @@
             this._startFullResHandoff(previousBand || this._fullResHandoffPreviousBand || 'MID', 'pending-css', this._fullResPanHandoffMaxMs);
         }
 
-        _collectResidentModeCss3dCleanupIds(nodeObjectsById) {
-            const ids = new Set();
-            if (!nodeObjectsById?.forEach) {
-                return ids;
-            }
-
-            nodeObjectsById.forEach((entry, key) => {
-                if (!entry?.cssObject || isLivePortalCssLodModel(entry?.model)) {
-                    return;
-                }
-
-                const element = entry.cssObject.element || null;
-                const isAttached = !!entry.cssObject.parent;
-                const isDisplayed = !!element &&
-                    element.style.display !== 'none' &&
-                    element.style.visibility !== 'hidden' &&
-                    element.style.opacity !== '0';
-                const isVisible = entry.cssObject.visible === true || isAttached || isDisplayed;
-                if (!isVisible) {
-                    return;
-                }
-
-                const nodeId = String(
-                    entry.model?.id ||
-                    entry.model?.Id ||
-                    entry.glObject?.userData?.nodeId ||
-                    entry.cssObject?.userData?.nodeId ||
-                    key ||
-                    ''
-                ).trim();
-                if (nodeId) {
-                    ids.add(nodeId);
-                }
-            });
-
-            return ids;
-        }
         // ▲▲▲ [New] ▲▲▲
 
         // ═══════════════════════════════════════════════════════════════════════
@@ -3455,7 +3414,7 @@
         }
 
         hasResidentDirtyWork(camera = this._module?.camera, module = this._module) {
-            return this.getResidentDirtyState(camera, module).dirty === true;
+            return window.MindMapRenderPlan?.hasResidentDirtyWork?.(this, camera, module, getLodBandForCameraZ, buildLodSelectionKey, isAnimatedGifImageModel) === true;
         }
 
         willLodBandChange(camera) {
@@ -3756,7 +3715,7 @@
                 }
             }
 
-            for (const nodeId of Array.from(this._lodImageCssFallbackNodeIds)) {
+            for (const nodeId of window.MindMapRenderPlan?.fallbackBatch?.(this,this._lodImageCssFallbackNodeIds)||Array.from(this._lodImageCssFallbackNodeIds)) {
                 if (nextFallbackIds.has(nodeId)) {
                     continue;
                 }
@@ -3779,7 +3738,7 @@
             }
 
             let hiddenCount = 0;
-            for (const nodeId of Array.from(this._lodImageCssFallbackNodeIds)) {
+            for (const nodeId of window.MindMapRenderPlan?.fallbackBatch?.(this,this._lodImageCssFallbackNodeIds)||Array.from(this._lodImageCssFallbackNodeIds)) {
                 const entry = nodeObjectsById?.get?.(nodeId) || null;
                 if (entry) {
                     this._hideCssMediaLodFallback(entry);
@@ -4053,17 +4012,10 @@
         }
 
         _clearFullResImageVisuals(nodeObjectsById) {
-            if (!this._fullResImageVisualIds || this._fullResImageVisualIds.size === 0) return;
-
-            for (const nodeId of this._fullResImageVisualIds) {
-                const entry = nodeObjectsById?.get?.(nodeId) || null;
-                if (entry) this._hideImageLodFullVisual(entry);
-            }
-
-            this._fullResImageVisualIds.clear();
+            window.MindMapRenderPlan?.clearFullResImageVisuals?.(this, nodeObjectsById);
         }
 
-        _syncFullResImageVisuals(visibleIds, nodeObjectsById, module, lodBand) {
+        _syncFullResImageVisuals(visibleIds, nodeObjectsById, module, lodBand, selectionKey = '') {
             if (this.isInLODMode !== false || !nodeObjectsById) {
                 this._clearFullResImageVisuals(nodeObjectsById);
                 return;
@@ -4093,7 +4045,10 @@
                 if (!entry) continue;
 
                 if (supportsCss3dNodeModel(entry?.model)) {
-                    this._syncCssImageBodyBridge(entry, module);
+                    if (window.MindMapRenderPlan?.restoreParkedFullResCss?.(
+                        this, entry, module, nodeObjectsById, selectionKey, lodBand, nodeId) !== true) {
+                        this._syncCssImageBodyBridge(entry, module);
+                    }
                     continue;
                 }
 
@@ -4554,6 +4509,7 @@
         }
 
         _restoreVisibleCss3dHighDetailForNear(nodeObjectsById, module, lodBand) {
+            // Full-res: NEAR / NORMAL. MID/FAR use resident instances.
             if ((lodBand !== 'NEAR' && lodBand !== 'NORMAL') || !nodeObjectsById) {
                 return 0;
             }
@@ -4697,6 +4653,7 @@
             }
 
             entry.cssObject = cssObject;
+            window.MindMapRenderPlan?.cachePreparedResidentCss?.(this, entry, module, module.nodeObjectsById);
             return true;
         }
 
@@ -4706,8 +4663,7 @@
                 !Array.isArray(prioritizedVisible) ||
                 !nodeObjectsById ||
                 !module ||
-                this.isLoading ||
-                module.isZooming === true) {
+                this.isLoading) {
                 return;
             }
 
@@ -4718,12 +4674,12 @@
                 if (!nodeId || this._css3dPrewarmQueuedIds.has(nodeId)) continue;
 
                 const entry = nodeObjectsById.get(nodeId);
-                if (!entry || entry.cssObject || !supportsCss3dNodeModel(entry.model)) continue;
+                if (!entry || (entry.cssObject && entry.isCssDirty !== true) || !supportsCss3dNodeModel(entry.model)) continue;
                 if (allowPanTextPrewarm && !isTextLikeModel(entry.model)) continue;
                 if (shouldShowAgentConsoleInLodBand(lodBand) && hasAgentConsoleOpenForEntry(entry)) continue;
 
                 this._css3dPrewarmQueuedIds.add(nodeId);
-                this._css3dPrewarmQueue.push({ nodeId, module });
+                this._css3dPrewarmQueue.push({ nodeId, module, nodeObjectsById, entry });
             }
 
             if (this._css3dPrewarmQueue.length > 0 && !this._css3dPrewarmProcessing) {
@@ -4749,6 +4705,7 @@
                     const module = this._module || null;
                     const allowPanTextPrewarm = module?.isPanning === true && module?.isZooming !== true;
                     if ((module?.isPanning === true && !allowPanTextPrewarm) || module?.isZooming === true) {
+                        shouldContinue = this._css3dPrewarmQueue.length > 0;
                         return;
                     }
 
@@ -4774,11 +4731,17 @@
 
                         this._css3dPrewarmQueuedIds.delete(nodeId);
                         const itemModule = item.module || this._module;
+                        if (itemModule !== this._module || item.nodeObjectsById !== itemModule?.nodeObjectsById) continue;
                         const entry = itemModule?.nodeObjectsById?.get(nodeId);
-                        if (!entry || entry.cssObject || !supportsCss3dNodeModel(entry.model)) continue;
+                        if (!entry || entry !== item.entry || (entry.cssObject && entry.isCssDirty !== true) || !supportsCss3dNodeModel(entry.model)) continue;
                         if (allowPanTextPrewarm && !isTextLikeModel(entry.model)) continue;
 
-                        this._ensureHiddenCss3dObject(entry, itemModule);
+                        if (!entry.cssObject && !this._ensureHiddenCss3dObject(entry, itemModule)) continue;
+                        if (entry.isCssDirty === true && window.MindMapCss3DManager?.syncCss3dContent) {
+                            window.MindMapCss3DManager.syncCss3dContent(entry.model, entry.cssObject);
+                            entry.isCssDirty = false;
+                        }
+                        window.MindMapRenderPlan?.cachePreparedResidentCss?.(this, entry, itemModule, item.nodeObjectsById);
                         count++;
                     }
 
@@ -5071,6 +5034,7 @@
             if (!entry || !isCssMediaFallbackModel(entry?.model)) {
                 return false;
             }
+            if (window.MindMapRenderPlan?.reuseActiveCssMediaFallback?.(this,entry,module)) return true;
 
             if (!entry.cssObject?.element && !this._ensureHiddenCss3dObject(entry, module)) {
                 return false;
@@ -5187,6 +5151,12 @@
             const isNodeSelected = nodeId
                 ? isNodeSelectedForLod(nodeId, multiSelectedIds, selectedNodeId)
                 : false;
+            const hasInteractiveOwner = module?.draggedNodeId === nodeId || this._getCurrentHoveredNodeId(module) === nodeId;
+            if (contentType === 'image' && !isAnimatedGifImageModel(entry.model) &&
+                this._hasActiveImageLodInstance(nodeId) && !isNodeSelected && !hasInteractiveOwner) {
+                this._hideCssMediaLodFallback(entry, { forceMediaGlFallback: true });
+                return false;
+            }
             const shouldKeep = contentType === 'image'
                 ? (entry.isVisibleInFrustum === true || isNodeSelected === true)
                 : entry.isVisibleInFrustum === true;
@@ -5206,7 +5176,7 @@
 
             const allowImageCssFallbacks = this._shouldUseCssImageFallbackInResidentLod(module, lodBand);
 
-            for (const nodeId of Array.from(this._lodImageCssFallbackNodeIds)) {
+            for (const nodeId of window.MindMapRenderPlan?.fallbackBatch?.(this, this._lodImageCssFallbackNodeIds) || []) {
                 const entry = nodeObjectsById.get(nodeId) || null;
                 if (!entry || !isCssMediaFallbackModel(entry.model)) {
                     this._lodImageCssFallbackNodeIds.delete(nodeId);
@@ -5345,39 +5315,7 @@
         }
 
         hasPendingNearCssWarmup(module) {
-            if (this.isInLODMode !== false) {
-                return false;
-            }
-
-            if (this._css3dProcessing || this._css3dQueuedMap.size > 0 || this._hasCss3dQueueItems()) {
-                return true;
-            }
-
-            if (this._nearEntryBoostFrames > 0) {
-                return true;
-            }
-
-            const moduleRef = module || this._module || null;
-            const visibleIds = this._getNearVisibleIds(moduleRef);
-            const nodeObjectsById = moduleRef?.nodeObjectsById || null;
-            if (!visibleIds || !nodeObjectsById || visibleIds.size === 0) {
-                return false;
-            }
-
-            for (const nodeId of visibleIds) {
-                if (this._nearCssVisibleIds.has(nodeId)) {
-                    continue;
-                }
-
-                const entry = nodeObjectsById.get(nodeId);
-                if (!entry?.glObject || !supportsCss3dNodeModel(entry.model)) {
-                    continue;
-                }
-
-                return true;
-            }
-
-            return false;
+            return window.MindMapRenderPlan?.hasPendingNearCssWarmup?.(this, module, buildLodSelectionKey, isCss3dRendererEnabled, supportsCss3dNodeModel) === true;
         }
 
 
@@ -5702,40 +5640,8 @@
             return { warmMax, queueMax, perIdle, budgetMs };
         }
 
-        _getAdaptiveNearEntryBoostFrames(visibleCount = 0, module = this._module) {
-            const avgFrameTime = Number(module?._avgFrameTime || 16);
-            const fps = Number(module?._currentFps || 60);
-            let frames = 12;
-
-            if (visibleCount >= 72) {
-                frames = 16;
-            }
-            if (visibleCount >= 144) {
-                frames = 20;
-            }
-            if (visibleCount >= 240) {
-                frames = 24;
-            }
-
-            if (avgFrameTime > 22 || fps < 42) {
-                frames = Math.max(10, frames - 4);
-            }
-
-            return frames;
-        }
-
-        _getAdaptiveNearCssActivationConfig(visibleCount = 0, module = this._module, isNearBoostFrame = false) {
-            const visibleBudget = Number.isFinite(Number(visibleCount))
-                ? Math.max(1, Math.ceil(Number(visibleCount)))
-                : Number.MAX_SAFE_INTEGER;
-
-            // NEAR/NORMAL is the readable full-res CSS3D path. Splitting activation
-            // across frames makes some nodes move or reveal later than others, which
-            // is visually worse than a bounded one-tick activation cost.
-            return {
-                maxPerFrame: visibleBudget,
-                budgetMs: Number.MAX_SAFE_INTEGER
-            };
+        _getAdaptiveNearCssActivationConfig(visibleCount = 0) {
+            return { maxPerFrame: Math.max(1, Math.ceil(Number(visibleCount) || 1)), budgetMs: Number.MAX_SAFE_INTEGER };
         }
 
         updateLOD(camera, nodeObjectsById, module) {
@@ -5826,8 +5732,8 @@
                     if (this.instancedImageMesh) this.instancedImageMesh.visible = false;
                     return;
                 }
+                window.MindMapRenderPlan?.scheduleResidentLinePrewarm?.(this, module, nodeObjectsById);
 
-                // Explicit bands: NEAR(DOM overlay + CSS3D), MID(resident nodes+lines), FAR(nodes only)
                 const shouldUseLOD = lodBand === 'MID' || lodBand === 'FAR';
                 perfMode = shouldUseLOD ? 'lod' : 'fullres';
                 const isLodPanFrame = shouldUseLOD &&
@@ -5890,13 +5796,12 @@
                     this._markCss3dSyncNeeded(true);
                 }
 
-                // State changed? Only toggle visibility on state change
-                // Also force transition when mode is unknown (after reset/re-activation).
                 if (modeChanged) {
-                    const tModeStart = performance.now(); // ▼ [Timing]
+                    const transitionPlan = window.MindMapRenderPlan;
+                    transitionPlan?.beginResidentCssTransition?.(
+                        this, module, nodeObjectsById, previousLodBand, lodBand, lodSelectionKey);
                     this.isInLODMode = shouldUseLOD;
                     this._updateMeshVisibility(); // Use helper to respect loading state
-                    console.log(`[LODRenderer] Mode switched to: ${shouldUseLOD ? 'LOD' : 'FULL-RES'} (Band=${lodBand}, Z=${cameraZ.toFixed(0)})`);
 
                     if (this.isInLODMode) {
                         this._lodVisualEpoch++;
@@ -5904,14 +5809,14 @@
                     }
 
                     if (shouldUseLOD) {
-                        // LOD: instanced nodes are visible, halo is enabled in MID/FAR.
                         this._finishFullResHandoff('enter-lod');
                         this._clearFullResImageVisuals(nodeObjectsById);
+                        if ((this.imageInstanceData?.nodeIds?.length || 0) > 0) {
+                            perfTime('lodImageInstances', () => this._applyImageInstanceData());
+                        }
                         this._fullResMotionHiddenGlIds.clear();
                         this._currentLodBand = lodBand;
-                        if (lodBand === 'MID') {
-                            this._markLineDetailsDirty();
-                        }
+                        transitionPlan?.ensureResidentLineDetails?.(this, lodBand);
                         if (this.instancedHaloMesh) this.instancedHaloMesh.visible = shouldShowInstancedHaloInLodBand(lodBand);
                     this.instancedMesh.visible = true;
                     if (this.isLoading) {
@@ -5923,7 +5828,6 @@
                         this._syncInstancedImageMeshVisibility();
                     }
 
-                        // Keep the resident MID/FAR instance buffers; only real node mutations mark them dirty.
                         const cssIdsToHide = new Set(this._nearCssVisibleIds);
                         for (let i = this._css3dQueueCursor || 0; i < this._css3dQueue.length; i++) {
                             const item = this._css3dQueue[i];
@@ -5933,17 +5837,14 @@
                             cssIdsToHide.add(nodeId);
                         }
                         const currentNodeMap = this._module?.nodeObjectsById;
-                        for (const nodeId of this._collectResidentModeCss3dCleanupIds(currentNodeMap)) {
-                            cssIdsToHide.add(nodeId);
-                        }
+                        const activeCssOwnerId = module?.draggedNodeId || this._getCurrentHoveredNodeId(module);
+                        for (const nodeId of this._activeFullResCssNodeIds) cssIdsToHide.add(nodeId);
                         this._clearCss3dQueue();
                         this._clearCss3dPrewarmQueue();
                         this._css3dProcessing = false;
                         this._nearCssVisibleIds.clear();
                         this._lastNearCssNoWorkKey = '';
 
-                        // Hide only CSS3D nodes that were actually on-screen; the LOD cleanup queue
-                        // catches any stale off-screen DOM without blocking the wheel transition.
                         const visibleIds = this._getNearVisibleIds(module);
                         const prioritizedWarm = currentNodeMap && visibleIds
                             ? this._getNearVisiblePriority(visibleIds, currentNodeMap, camera)
@@ -5951,14 +5852,35 @@
                         this._primeWarmCss3dCache(prioritizedWarm, currentNodeMap, lodBand);
                         this._queueCss3dPrewarm(prioritizedWarm, currentNodeMap, module, lodBand);
                         if (currentNodeMap && cssIdsToHide.size > 0) {
-                            const hideStart = performance.now();
                             perfTime('lodCleanup', () => {
                                 for (const nodeId of cssIdsToHide) {
                                     const entry = currentNodeMap.get(nodeId);
                                     if (!entry) continue;
                                     const model = entry.model;
                                     const isLivePortalCss = isLivePortalCssLodModel(model);
+                                    const isTextLike = isTextLikeModel(model);
                                     const shouldKeepConsoleProxy = false;
+                                    if (!isLivePortalCss && isTextLike) {
+                                        transitionPlan?.parkFullResCss?.(
+                                            this, entry, module, currentNodeMap, lodSelectionKey, 'text');
+                                        if (entry.glObject) this._hideTextLodFullVisual(entry);
+                                        this._setGlowVisibility(entry, false);
+                                        continue;
+                                    }
+                                    const contentType = getNodeContentType(model);
+                                    const isNodeSelected = isNodeSelectedForLod(nodeId, multiSelectedIds, selectedNodeId);
+                                    if (!isLivePortalCss && contentType === 'image' &&
+                                        transitionPlan?.parkReadyResidentImage?.(
+                                            this, entry, module, currentNodeMap, lodSelectionKey, nodeId,
+                                            isAnimatedGifImageModel(model), isNodeSelected, activeCssOwnerId === nodeId)) continue;
+                                    const element = entry.cssObject?.element || null;
+                                    if (!isLivePortalCss && isCssMediaFallbackModel(model) &&
+                                        entry.cssObject?.visible === true && element && element.style.display !== 'none') {
+                                        this._lodImageCssFallbackNodeIds.add(nodeId);
+                                        entry.currentType = 'GL';
+                                        if (entry.glObject) this._hideGlBodyOnly(entry);
+                                        continue;
+                                    }
                                     if (entry.cssObject?.element) {
                                         this._hideAgentConsoleLodProxy(entry);
                                     }
@@ -5979,16 +5901,11 @@
                                         entry.currentType = 'GL';
                                     }
 
-                                    // Text-like nodes: hide GL body (InstancedMesh renders them)
-                                    const isTextLike = isTextLikeModel(model);
-                                    const contentType = getNodeContentType(model);
                                     const isImage = isImageLodProxyModel(model);
-                                    const isNodeSelected = isNodeSelectedForLod(nodeId, multiSelectedIds, selectedNodeId);
                                     if (!isLivePortalCss && isTextLike && entry.glObject) {
                                         this._hideTextLodFullVisual(entry);
                                     } else if (isImage) {
                                         if (shouldKeepCssMediaFallback) {
-                                            // Visible media stays on the CSS fallback path until its resident proxy is ready.
                                         } else {
                                             if (contentType === 'image' && !isCss3dRendererEnabled(module)) {
                                                 this._syncImageLodTransitionVisual(entry, lodBand, isNodeSelected, module);
@@ -6000,8 +5917,11 @@
 
                                     this._setGlowVisibility(entry, false);
                                 }
+                                if (module) {
+                                    module._css3dVisualChangedThisFrame = true;
+                                    module._css3dVisualChangedSinceLastRender = true;
+                                }
                             });
-                            console.log(`[LODRenderer] CSS3D hidden synchronously in ${(performance.now() - hideStart).toFixed(1)}ms (${cssIdsToHide.size} active)`);
                         }
 
                         if (module?.renderDebugFlags?.enableCss3dWillChange === true &&
@@ -6016,8 +5936,6 @@
 
                     } else {
                         perfTime('fullResSetup', () => {
-                            // Full-res: NEAR / NORMAL. MID/FAR use resident instances.
-                            const tNearStart = performance.now();
                             if (this.instancedHaloMesh) this.instancedHaloMesh.visible = false;
                             if (this.instancedConsoleMesh) this.instancedConsoleMesh.visible = false;
                             this._startFullResHandoff(previousLodBand, 'enter-full-res', this._fullResHandoffMaxMs);
@@ -6044,15 +5962,13 @@
                             this._lastNearCssNoWorkKey = '';
                             const nearVisibleIds = this._getNearVisibleIds(module);
                             this._clearWarmCss3dCache(this._module?.nodeObjectsById, nearVisibleIds);
-                            this._nearEntryBoostFrames = this._getAdaptiveNearEntryBoostFrames(nearVisibleIds?.size || 0, module);
+                            this._nearEntryBoostFrames = 0;
                             this._lodCleanupPending = true;
 
                             if (module?.renderDebugFlags?.enableCss3dWillChange === true &&
                                 window.MindMapCss3DManager?.setWillChange) {
                                 window.MindMapCss3DManager.setWillChange(true, module);
                             }
-                            const tModeEnd = performance.now();
-                            console.log(`[LODRenderer] ⏱️ Full-res band=${lodBand}: setup ${(tModeEnd - tNearStart).toFixed(1)}ms (visible-only CSS3D activation)`);
                             // ▲▲▲ [FIX] ▲▲▲
                         });
                     }
@@ -6091,8 +6007,12 @@
                 // ▼▼▼ [Fix] Keep CSS3D visibility synced while panning in near mode ▼▼▼
                 if (!this.isInLODMode) {
                     this._currentLodBand = lodBand;
-                    this._restoreVisibleCss3dHighDetailForNear(nodeObjectsById, module, lodBand);
                     const visibleIds = this._getNearVisibleIds(module);
+                    const renderPlan = window.MindMapRenderPlan;
+                    const css3dEnabled = isCss3dRendererEnabled(module);
+                    const stableFullResKey = renderPlan?.buildFullResKey(lodBand, visibilityVersion, lodSelectionKey, nodeObjectsById.size, visibleIds?.size || 0, this._nearCssVisibleIds.size, this._activeFullResCssNodeIds.size, css3dEnabled, module, this);
+                    if (visibleIds?.size > 0 && renderPlan?.shouldSkipStableFullRes(this, module, stableFullResKey, bandChangedWithoutModeSwitch)) return;
+                    this._restoreVisibleCss3dHighDetailForNear(nodeObjectsById, module, lodBand);
                     if (!visibleIds || visibleIds.size === 0) {
                         perfTime('fullResHandoff', () => {
                             this._activeFullResCssNodeIds.clear();
@@ -6117,7 +6037,7 @@
                     }
 
                     perfTime('fullResImages', () => {
-                        this._syncFullResImageVisuals(visibleIds, nodeObjectsById, module, lodBand);
+                        this._syncFullResImageVisuals(visibleIds, nodeObjectsById, module, lodBand, lodSelectionKey);
                     });
 
                     const prioritizedVisible = this._getNearVisiblePriority(visibleIds, nodeObjectsById, camera);
@@ -6172,17 +6092,8 @@
                         return;
                     }
 
-                    const nearCssNoWorkKey = `${lodBand}|${visibilityVersion}|${nodeObjectsById.size}|${this._nearCssVisibleIds.size}|${allowedCssIds.size}`;
-                    if (this._lastNearCssNoWorkKey === nearCssNoWorkKey &&
-                        !this._hasCss3dQueueItems() &&
-                        this._css3dQueuedMap.size === 0 &&
-                        this._css3dProcessing !== true &&
-                        this._nearEntryBoostFrames <= 0 &&
-                        this._fullResHandoffActive !== true &&
-                        cssReadinessDrift !== true &&
-                        !bandChangedWithoutModeSwitch) {
-                        return;
-                    }
+                    const nearCssNoWorkKey = renderPlan?.buildFullResKey(lodBand, visibilityVersion, lodSelectionKey, nodeObjectsById.size, visibleIds.size, this._nearCssVisibleIds.size, allowedCssIds.size, css3dEnabled, module, this);
+                    if (renderPlan?.commitStableFullRes(this, module, nearCssNoWorkKey, bandChangedWithoutModeSwitch, cssReadinessDrift)) return;
 
                     let hasNearCssWork =
                         this._hasCss3dQueueItems() ||
@@ -6260,9 +6171,13 @@
                             // visible CSS3D surface in-place so the expanded NORMAL
                             // band cannot show a blank low-detail shell while a
                             // deferred queue waits for motion/cooldown.
-                            this._showNodeCss3d(entry, module);
+                            if (renderPlan?.restoreParkedFullResCss?.(
+                                this, entry, module, nodeObjectsById, lodSelectionKey, lodBand, nodeId) !== true) {
+                                this._showNodeCss3d(entry, module);
+                            }
                             processedCount++;
                         }
+                        renderPlan?.completeFullResTransition?.(this, allowedCssIds.size);
                     });
 
                     perfTime('fullResHandoff', () => {
@@ -6425,6 +6340,10 @@
                     });
                 }
 
+                const committedResidentTextCount = window.MindMapRenderPlan?.syncCommittedResidentTextCount?.(
+                    this, hasResidentLodInstances, FORCE_RESIDENT_INSTANCES_IN_MID_FAR === true) ?? -1;
+                if (committedResidentTextCount >= 0) totalTextLikeCount = committedResidentTextCount;
+
                 const nextVisibleSubsetMode = shouldUseLOD && this._shouldUseVisibleSubsetLod(totalTextLikeCount, lodBand);
                 if (this._lodUsesVisibleSubset !== nextVisibleSubsetMode) {
                     this._lodUsesVisibleSubset = nextVisibleSubsetMode;
@@ -6450,9 +6369,7 @@
                         } else if (lodBand === 'MID') {
                             this._setInstancedBaseColor(0xffffff);
                             this._setInstancedDefaultBorderColor(0xd1d5db);
-                            if (previousResidentBand === 'FAR') {
-                                this._markLineDetailsDirty();
-                            }
+                            if (previousResidentBand === 'FAR') window.MindMapRenderPlan?.ensureResidentLineDetails?.(this, lodBand);
                         }
                     }
                     const shouldSyncTemplateCss3d =
@@ -6590,7 +6507,7 @@
                         }
                         this._updateInstanceData(nodeObjectsById);
                         this._applyInstanceData();
-                        this._lineDetailsPatchPending = false;
+                        this._lineDetailsPatchPending = this._residentLineFallbackUsed === true;
                         if (fullBuildReason !== 'line-details') {
                             this._noteResidentFullBuild(fullBuildReason, lodBand);
                         }
@@ -6660,8 +6577,9 @@
             }
         }
 
-        _updateInstanceData(nodeObjectsById) {
-            const positions = [];
+        _updateInstanceData(nodeObjectsById) {
+            this._residentLineFallbackUsed = false;
+            const positions = [];
             const sizes = [];
             const selections = [];
             const seeds = [];
@@ -6872,8 +6790,10 @@
                         }
                     }
                 } else {
-                    // Build actual line length data from text
-                    const lineData = this._getLineDataForNode(model, entry.lodSeed, w, h, entry);
+                    const lineData = window.MindMapRenderPlan?.resolveResidentLineData?.(
+                        this, entry, w, h, this._residentBuilt === true,
+                        MAX_LINE_SAMPLES, LINE_HEIGHT_PX, LINE_PADDING_PX
+                    ) || this._getLineDataForNode(model, entry.lodSeed, w, h, entry);
                     lineCounts.push(lineData.lineCount);
                     lineHeights.push(lineData.lineHeightPx || LINE_HEIGHT_PX);
                     linePaddings.push(lineData.paddingX || LINE_PADDING_PX, lineData.paddingY || LINE_PADDING_PX);
@@ -6912,7 +6832,7 @@
             this._cachedImageNodeCount = imageNodeIds.length;
         }
 
-        _updateImageInstanceData(nodeObjectsById) {
+        _updateImageInstanceData(nodeObjectsById, prepareOnly = false) {
             const imagePositions = [];
             const imageSizes = [];
             const imageSelections = [];
@@ -6939,13 +6859,13 @@
 
                 if (contentType === 'image' &&
                     this._shouldUseCssImageFallbackInResidentLod(this._module, this._currentLodBand)) {
-                    this._hideImageLodFullVisual(entry);
+                    if (!prepareOnly) this._hideImageLodFullVisual(entry);
                     return;
                 }
 
                 const obj = entry.glObject || entry.cssObject;
                 if (!obj) {
-                    this._hideImageLodFullVisual(entry);
+                    if (!prepareOnly) this._hideImageLodFullVisual(entry);
                     return;
                 }
 
@@ -6956,7 +6876,7 @@
                     entry.isVisibleInFrustum === true ||
                     isNodeSelected === true;
                 if (!shouldKeepImageInstance) {
-                    this._hideImageLodFullVisual(entry);
+                    if (!prepareOnly) this._hideImageLodFullVisual(entry);
                     return;
                 }
 
@@ -6971,7 +6891,7 @@
                     if (!isRetryDeferred && isLoadPending) {
                         imageBatchPendingIds.add(nodeId);
                     }
-                    if (contentType === 'image') {
+                    if (!prepareOnly && contentType === 'image') {
                         this._syncImageLodTransitionVisual(
                             entry,
                             this._currentLodBand || 'MID',
@@ -6979,7 +6899,7 @@
                             this._module,
                             interactionState
                         );
-                    } else {
+                    } else if (!prepareOnly) {
                         this._syncCssMediaLodFallback(entry, this._module);
                     }
                     return;
@@ -6995,10 +6915,10 @@
                 imageUvRects.push(uvRect[0], uvRect[1], uvRect[2], uvRect[3]);
                 imageNodeIds.push(nodeId);
                 this._imageNodeIdToIndex.set(nodeId, imageNodeIds.length - 1);
-                if (contentType !== 'image') {
+                if (!prepareOnly && contentType !== 'image') {
                     this._hideCssMediaLodFallback(entry);
                 }
-                this._hideImageLodFullVisual(entry);
+                if (!prepareOnly) this._hideImageLodFullVisual(entry);
             });
 
             if (imageBatchPendingIds.size > 0) {
@@ -7163,35 +7083,7 @@
         }
 
         _hasAnimatedGifCssFallbackCandidates(module = this._module) {
-            const nodeObjectsById = module?.nodeObjectsById || this._module?.nodeObjectsById || null;
-            if (!nodeObjectsById) {
-                return false;
-            }
-
-            const candidateIds = [];
-            const pushId = (value) => {
-                const id = String(value || '').trim();
-                if (id) candidateIds.push(id);
-            };
-
-            module?._visibleIds?.forEach?.(pushId);
-            module?._prevVisibleIds?.forEach?.(pushId);
-            pushId(module?.selectedNodeIdJs);
-            module?.multiSelectedNodeIds?.forEach?.(pushId);
-            this._lodImageCssFallbackNodeIds?.forEach?.(pushId);
-
-            const seenIds = new Set();
-            for (const nodeId of candidateIds) {
-                if (seenIds.has(nodeId)) continue;
-                seenIds.add(nodeId);
-
-                const entry = nodeObjectsById.get(nodeId) || null;
-                if (isAnimatedGifImageModel(entry?.model)) {
-                    return true;
-                }
-            }
-
-            return false;
+            return window.MindMapRenderPlan?.hasAnimatedGifCssFallbackCandidates?.(this, module, isAnimatedGifImageModel) === true;
         }
 
         _shouldPreserveCssMediaFallbackForInteraction(entry, module = this._module) {
@@ -7589,6 +7481,7 @@
             }
 
             const nodeIds = Array.isArray(this.instanceData?.nodeIds) ? this.instanceData.nodeIds : [];
+            if (window.MindMapRenderPlan?.areResidentLinesPrepared?.(this, nodeObjectsById, nodeIds) === false) return false;
             const lineCounts = this.instanceData?.lineCounts || [];
             const lineLengths = this.instanceData?.lineLengths || [];
             const lineHeights = this.instanceData?.lineHeights || [];
@@ -7614,7 +7507,8 @@
                 const model = entry.model;
                 const w = model.width || 400;
                 const h = model.height || 200;
-                const lineData = this._getLineDataForNode(model, entry.lodSeed, w, h, entry);
+                const lineData = window.MindMapRenderPlan?.getPreparedLineData?.(this, entry, w, h) ||
+                    this._getLineDataForNode(model, entry.lodSeed, w, h, entry);
                 const base = i * MAX_LINE_SAMPLES;
 
                 lineCounts[i] = lineData.lineCount || 0;
@@ -8410,18 +8304,16 @@
             const consoleCount = consolePositions.length / 3;
             const imageCount = imagePositions.length / 3;
 
-            // Resize buffers if needed (simple resize strategy: if full, create bigger)
-            // For now assuming 10000 is enough, or it will just slice (visual glitch but no crash)
-            const max = positionAttr.count;
+            const max = positionAttr.count;
             if (count > max) {
                 console.warn('[LODRenderer] Buffer overflow, need to resize (omitted for safety)');
             }
 
             const safeCount = Math.min(count, max);
+            window.MindMapRenderPlan?.ensureLineTextureCapacity?.(this, safeCount, MAX_LINE_SAMPLES);
             let lineRowsRewritten = false;
             const suspendLineDetailsForPan = this._isPanLineDetailSuspended();
 
-            // Update attribute data
             for (let i = 0; i < safeCount; i++) {
                 positionAttr.setXYZ(i, positions[i * 3], positions[i * 3 + 1], positions[i * 3 + 2]);
                 sizeAttr.setXY(i, sizes[i * 2], sizes[i * 2 + 1]);