fix(docs): prevent modern layout starvation

Author: DR-Univer

packages/docs-ui/src/services/__tests__/doc-layout-coordinator.service.spec.ts

@@ -489,6 +489,85 @@ describe('DocLayoutCoordinatorService', () => {
         coordinator.dispose();
     });
 
+    it('keeps Worker background layout moving when the browser has no idle period', async () => {
+        const requestIdle = vi.fn(() => 1);
+        vi.stubGlobal('requestIdleCallback', requestIdle);
+        let identity: IDocLayoutMountIdentity = {
+            unitId: 'doc-worker-background',
+            mountId: '',
+            mountEpoch: 0,
+            viewportEpoch: 0,
+        };
+        const executorService = {
+            startLayout: vi.fn(async (requestIdentity: IDocLayoutMountIdentity): Promise<IDocLayoutStartResult> => {
+                identity = requestIdentity;
+                return {
+                    status: DocLayoutSessionStatus.ACCEPTED,
+                    step: {
+                        ...requestIdentity,
+                        progress: createProgress({
+                            generation: 7,
+                            mode: 'continuous',
+                            didPublish: true,
+                            anchorReady: true,
+                            processedBlockCount: 63,
+                            totalBlockCount: 6_264,
+                        }),
+                        publication: null,
+                        modelRevision: 3,
+                        metricsRevision: 5,
+                    },
+                };
+            }),
+            stepLayout: vi.fn(async () => ({
+                ...identity,
+                progress: createProgress({
+                    generation: 7,
+                    mode: 'continuous',
+                    didPublish: true,
+                    anchorReady: true,
+                    complete: true,
+                    processedBlockCount: 6_264,
+                    totalBlockCount: 6_264,
+                }),
+                publication: null,
+                modelRevision: 3,
+                metricsRevision: 5,
+            })),
+            publishBacklog: vi.fn(async () => ({
+                ...identity,
+                progress: createProgress({
+                    generation: 7,
+                    mode: 'continuous',
+                    anchorReady: true,
+                    processedBlockCount: 63,
+                    totalBlockCount: 6_264,
+                }),
+                publication: null,
+                modelRevision: 3,
+                metricsRevision: 5,
+            })),
+            cancelLayout: vi.fn(async () => {}),
+            disposeLayoutMount: vi.fn(async () => {}),
+        };
+        const coordinator = new DocLayoutCoordinatorService();
+
+        coordinator.scheduleWorker(
+            'doc-worker-background',
+            { beginExternalLayout: vi.fn(), cancelExternalLayout: vi.fn() },
+            executorService,
+            { reason: 'initial' },
+            undefined,
+            { onProgress: vi.fn() },
+            vi.fn()
+        );
+        await vi.runAllTimersAsync();
+
+        expect(requestIdle).not.toHaveBeenCalled();
+        expect(executorService.stepLayout).toHaveBeenCalledTimes(1);
+        coordinator.dispose();
+    });
+
     it('keeps an external presentation barrier until Worker pages are published', async () => {
         const requestAnimationFrameSpy = vi.fn((callback: FrameRequestCallback) =>
             window.setTimeout(() => callback(performance.now()), 0));

packages/docs-ui/src/services/doc-layout-coordinator.service.ts

@@ -21,6 +21,7 @@ import { DocLayoutSessionStatus } from '@univerjs/docs';
 
 const FOREGROUND_BUDGET_MS = 8;
 const WORKER_FOREGROUND_BUDGET_MS = 32;
+const WORKER_BACKGROUND_BUDGET_MS = 128;
 const BACKGROUND_BUDGET_MS = 12;
 const BACKGROUND_YIELD_MS = 4;
 const BACKGROUND_RESUME_DELAY_MS = 4;
@@ -429,7 +430,22 @@ export class DocLayoutCoordinatorService extends Disposable {
         this._scheduledLayout.nextBackgroundDelayMs = BACKGROUND_YIELD_MS;
         this._fallbackTimerId = setTimeout(() => {
             this._fallbackTimerId = null;
-            if (this._scheduledLayout == null) {
+            const scheduledLayout = this._scheduledLayout;
+            if (scheduledLayout == null) {
+                return;
+            }
+
+            // Worker computation does not consume the main thread's idle budget.
+            // Waiting for requestIdleCallback here can starve forever while the
+            // loading skeleton keeps Canvas animating. Preserve the timer boundary
+            // and input-pending check, then let the Worker advance independently;
+            // its geometry is still committed only inside a visual frame.
+            if (scheduledLayout.executor === 'worker') {
+                if (hasPendingUserInput()) {
+                    this._scheduleBackground();
+                    return;
+                }
+                this._runSlice(WORKER_BACKGROUND_BUDGET_MS, true);
                 return;
             }
 

packages/engine-render/src/components/docs/layout/__tests__/doc-skeleton.spec.ts

@@ -1282,6 +1282,68 @@ describe('doc skeleton', () => {
         univer.dispose();
     });
 
+    it('does not report a page backlog for continuous layout', () => {
+        const univer = new Univer();
+        const localeService = univer.__getInjector().get(LocaleService);
+        const content = Array.from(
+            { length: 100 },
+            (_, index) => `Continuous paragraph ${index} remains in one document flow.\r`
+        ).join('');
+        const documentModel = createDocumentModelWithStyle(content, {});
+        documentModel.updateDocumentStyle({ documentFlavor: DocumentFlavor.MODERN });
+        const skeleton = DocumentSkeleton.create(new DocumentViewModel(documentModel), localeService);
+
+        const generation = skeleton.startIncrementalLayout({ reason: 'initial' });
+        const first = skeleton.stepIncrementalLayout(generation, 0);
+        const backlog = skeleton.publishIncrementalLayoutBacklog(generation);
+
+        expect(first.didPublish).toBe(true);
+        expect(backlog.didPublish).toBe(false);
+        expect(backlog.processedBlockCount).toBe(first.processedBlockCount);
+        expect(backlog.publicationRevision).toBe(first.publicationRevision);
+
+        skeleton.dispose();
+        univer.dispose();
+    });
+
+    it('merges legacy section identities into one continuous modern page', () => {
+        const first = `First modern section${DataStreamTreeTokenType.PARAGRAPH}${DataStreamTreeTokenType.SECTION_BREAK}`;
+        const second = `Second modern section${DataStreamTreeTokenType.PARAGRAPH}${DataStreamTreeTokenType.SECTION_BREAK}`;
+        const univer = new Univer();
+        const localeService = univer.__getInjector().get(LocaleService);
+        const documentModel = new DocumentDataModel({
+            id: 'modern-legacy-sections',
+            body: {
+                dataStream: `${first}${second}`,
+                paragraphs: [
+                    { startIndex: first.length - 2, paragraphId: 'first-paragraph' },
+                    { startIndex: first.length + second.length - 2, paragraphId: 'second-paragraph' },
+                ],
+                sectionBreaks: [
+                    { sectionId: 'legacy-first-section', startIndex: first.length - 1 },
+                    { sectionId: 'legacy-second-section', startIndex: first.length + second.length - 1 },
+                ],
+            },
+            documentStyle: {
+                documentFlavor: DocumentFlavor.MODERN,
+                pageSize: { width: 320, height: 400 },
+            },
+        });
+        const skeleton = DocumentSkeleton.create(new DocumentViewModel(documentModel), localeService);
+
+        const generation = skeleton.startIncrementalLayout({ reason: 'initial' });
+        let progress = skeleton.stepIncrementalLayout(generation, 0);
+        for (let step = 0; step < 20 && !progress.complete; step++) {
+            progress = skeleton.stepIncrementalLayout(generation, 0);
+        }
+
+        expect(progress).toMatchObject({ complete: true, mode: 'continuous', pageCount: 1 });
+        expect(skeleton.getSkeletonData()?.pages).toHaveLength(1);
+
+        skeleton.dispose();
+        univer.dispose();
+    });
+
     it('drains pages sequentially when the final block creates a multi-page tail', () => {
         const univer = new Univer();
         const localeService = univer.__getInjector().get(LocaleService);

packages/engine-render/src/components/docs/layout/doc-skeleton.ts

@@ -605,12 +605,12 @@ function removeDupPages(ctx: ILayoutContext) {
     });
 }
 
-function mergeContinuousDuplicatePages(pages: IDocumentSkeletonPage[]) {
+function mergeContinuousDuplicatePages(pages: IDocumentSkeletonPage[], mergeAll = false) {
     for (let index = 1; index < pages.length;) {
         const previousPage = pages[index - 1];
         const page = pages[index];
 
-        if (previousPage.pageNumber !== page.pageNumber || previousPage.sectionId !== page.sectionId) {
+        if (!mergeAll && (previousPage.pageNumber !== page.pageNumber || previousPage.sectionId !== page.sectionId)) {
             index++;
             continue;
         }
@@ -1725,6 +1725,12 @@ export class DocumentSkeleton extends Skeleton {
      * completed. It never advances shaping or pagination work.
      */
     publishIncrementalLayoutBacklog(generation: number): IDocumentLayoutProgress {
+        const state = this._activeLayout;
+        if (state?.generation === generation && state.mode === 'continuous') {
+            const progress = this._getLayoutProgress(state);
+            this._layoutProgress$.next(progress);
+            return progress;
+        }
         return this._stepIncrementalLayout(generation, 0, false);
     }
 
@@ -1883,7 +1889,7 @@ export class DocumentSkeleton extends Skeleton {
         // layout is in progress. Final layout merges them before publication; do
         // the same on cloned foreground pages so the temporary page list has the
         // same physical-page identity as the previous complete skeleton.
-        mergeContinuousDuplicatePages(activePages);
+        mergeContinuousDuplicatePages(activePages, state.mode === 'continuous');
 
         const flowPages = [...stablePages, ...activePages];
         const currentPriorityPageIndex = state.priorityAnchor == null
@@ -3984,8 +3990,14 @@ export class DocumentSkeleton extends Skeleton {
             evenAndOddHeaders,
         } = sectionBreakConfig;
         const explicitPageNumberStart = viewModel.getSectionBreak(sectionNode.endIndex)?.pageNumberStart;
-        const effectiveSectionType = getEffectiveSectionType(sectionType);
         const layoutAnchor = state.layoutAnchor;
+        // Modern documents have one logical flow. Imported legacy section
+        // metadata must append to that flow instead of creating physical page
+        // fragments. Keep the anchored first section on its established restore
+        // path; after the anchor is consumed, subsequent sections are continuous.
+        const effectiveSectionType = state.mode === 'continuous' && layoutAnchor == null
+            ? SectionType.CONTINUOUS
+            : getEffectiveSectionType(sectionType);
 
         let curSkeletonPage = getLastPage(allSkeletonPages);
         let reuseNextColumn = false;
@@ -4164,7 +4176,7 @@ export class DocumentSkeleton extends Skeleton {
         const { ctx } = state;
         const { skeleton } = ctx;
         removeDupPages(ctx);
-        mergeContinuousDuplicatePages(skeleton.pages);
+        mergeContinuousDuplicatePages(skeleton.pages, state.mode === 'continuous');
         if (state.mode === 'continuous') {
             updateBlockIndex(skeleton.pages, -1, ctx.docsConfig.documentCompatibilityPolicy);
             updateInlineDrawingCoordsAndBorder(ctx, skeleton.pages);
@@ -4458,7 +4470,10 @@ export class DocumentSkeleton extends Skeleton {
             this._iteratorCount = 0;
             removeDupPages(ctx);
             updateBlockIndex(skeleton.pages, -1, ctx.docsConfig.documentCompatibilityPolicy);
-            mergeContinuousDuplicatePages(skeleton.pages);
+            mergeContinuousDuplicatePages(
+                skeleton.pages,
+                ctx.dataModel.documentStyle.documentFlavor === DocumentFlavor.MODERN
+            );
             // Calculate inline drawing position and update.
             updateInlineDrawingCoordsAndBorder(ctx, skeleton.pages);
             for (const hSkeMap of skeleton.skeHeaders.values()) {

packages/engine-render/src/components/docs/layout/document-layout-page-patch.ts

@@ -294,6 +294,37 @@ function collectFlowLineEnds(page: IDocumentSkeletonPage): number[] {
     return lineEnds;
 }
 
+function countFlowLines(page: IDocumentSkeletonPage): number {
+    let lineCount = 0;
+    for (const section of page.sections) {
+        for (const column of section.columns) {
+            lineCount += column.lines.length;
+        }
+    }
+    return lineCount;
+}
+
+function collectFlowLineEndsFromCursor(
+    page: IDocumentSkeletonPage,
+    cursor: IDocumentSkeletonFlowCursor
+): number[] {
+    const lineEnds: number[] = [];
+    for (let sectionIndex = cursor.sectionIndex; sectionIndex < page.sections.length; sectionIndex++) {
+        const section = page.sections[sectionIndex];
+        const firstColumnIndex = sectionIndex === cursor.sectionIndex ? cursor.columnIndex : 0;
+        for (let columnIndex = firstColumnIndex; columnIndex < section.columns.length; columnIndex++) {
+            const column = section.columns[columnIndex];
+            const firstLineIndex = sectionIndex === cursor.sectionIndex && columnIndex === cursor.columnIndex
+                ? cursor.lineIndex
+                : 0;
+            for (let lineIndex = firstLineIndex; lineIndex < column.lines.length; lineIndex++) {
+                lineEnds.push(column.lines[lineIndex].ed);
+            }
+        }
+    }
+    return lineEnds;
+}
+
 function findFlowLineIndex(lineEnds: number[], offset: number): number {
     const index = lineEnds.findIndex((lineEnd) => lineEnd >= offset);
     return index < 0 ? lineEnds.length : index;
@@ -344,17 +375,31 @@ export function serializeDocumentSkeletonContinuousBlock(
     previousSnapshot: IDocumentSkeletonContinuousSnapshot | null,
     replacementOffset?: number
 ): { block: IDocumentSkeletonContinuousBlockPatch; snapshot: IDocumentSkeletonContinuousSnapshot } {
-    const currentLineEnds = collectFlowLineEnds(currentPage);
     const previousLineCount = previousSnapshot?.lineEnds.length ?? 0;
-    const replacementLineIndex = previousSnapshot == null
-        ? 0
-        : replacementOffset == null
-            ? Math.max(0, Math.min(previousLineCount, currentLineEnds.length) - 1)
+    let currentLineEnds: number[];
+    let replacementLineIndex: number;
+    let cursor: IDocumentSkeletonFlowCursor;
+    if (previousSnapshot != null && replacementOffset == null) {
+        replacementLineIndex = Math.max(0, Math.min(previousLineCount, countFlowLines(currentPage)) - 1);
+        cursor = resolveFlowCursor(currentPage, replacementLineIndex);
+        const appendedLineEnds = collectFlowLineEndsFromCursor(currentPage, cursor);
+        currentLineEnds = previousSnapshot.lineEnds;
+        currentLineEnds.splice(
+            replacementLineIndex,
+            currentLineEnds.length - replacementLineIndex,
+            ...appendedLineEnds
+        );
+    } else {
+        currentLineEnds = collectFlowLineEnds(currentPage);
+        const replacementStart = replacementOffset ?? 0;
+        replacementLineIndex = previousSnapshot == null
+            ? 0
             : Math.min(
-                findFlowLineIndex(previousSnapshot.lineEnds, replacementOffset),
-                findFlowLineIndex(currentLineEnds, replacementOffset)
+                findFlowLineIndex(previousSnapshot.lineEnds, replacementStart),
+                findFlowLineIndex(currentLineEnds, replacementStart)
             );
-    const cursor = resolveFlowCursor(currentPage, replacementLineIndex);
+        cursor = resolveFlowCursor(currentPage, replacementLineIndex);
+    }
     const section = currentPage.sections[cursor.sectionIndex];
     const column = section?.columns[cursor.columnIndex];
     if (section == null || column == null) {