refactor(editor): generic layout type support for turbo renderer (#10766)

This PR refactored the turbo renderer architecture to support multiple block layout types.

- New base class `BlockLayoutPainter` and `BlockLayoutProvider` are introduced for writing extendable per-block layout querying and painting logic.
- Paragraph-specific lines are all moved into dedicated classes (`ParagraphLayoutProvider` and `ParagraphLayoutPainter`) under the `/variants/paragraph` dir.
- The `renderer-utils.ts` doesn't contain paragraph-specific logic now.
- The `text-utils.ts` is also now scoped for paragraph only.
- Worker messages are now strongly typed.

Upcoming PR should further implement the block registration system using extension API. The `variants` dir could still exist, since there will be similar rendering logic that can be reused among block types (i.e., between paragraph block and list block).
This commit is contained in:
doodlewind
2025-03-13 05:18:11 +00:00
parent c1c750d782
commit c023b724d0
18 changed files with 578 additions and 252 deletions

View File

@@ -24,7 +24,6 @@ import { MemberSearchService } from '@affine/core/modules/permissions';
import { WorkspaceService } from '@affine/core/modules/workspace';
import track from '@affine/track';
import type { DocTitle } from '@blocksuite/affine/fragments/doc-title';
import { ViewportTurboRendererExtension } from '@blocksuite/affine/gfx/turbo-renderer';
import type { DocMode } from '@blocksuite/affine/model';
import type { Store } from '@blocksuite/affine/store';
import {
@@ -69,6 +68,7 @@ import {
type ReferenceReactRenderer,
} from '../extensions/reference-renderer';
import { patchSideBarService } from '../extensions/side-bar-service';
import { patchTurboRendererExtension } from '../extensions/turbo-renderer';
import { patchUserExtensions } from '../extensions/user';
import { patchUserListExtensions } from '../extensions/user-list';
import { BiDirectionalLinkPanel } from './bi-directional-link-panel';
@@ -169,7 +169,7 @@ const usePatchSpecs = (mode: DocMode) => {
]
: [],
mode === 'edgeless' && enableTurboRenderer
? [ViewportTurboRendererExtension]
? patchTurboRendererExtension()
: [],
].flat()
);

View File

@@ -0,0 +1,22 @@
import {
ParagraphLayoutHandlerExtension,
ParagraphPaintConfigExtension,
} from '@blocksuite/affine/blocks/paragraph';
import {
TurboRendererConfigFactory,
ViewportTurboRendererExtension,
} from '@blocksuite/affine/gfx/turbo-renderer';
export function patchTurboRendererExtension() {
return [
ParagraphLayoutHandlerExtension,
ParagraphPaintConfigExtension,
TurboRendererConfigFactory({
options: {
zoomThreshold: 1,
debounceTime: 1000,
},
}),
ViewportTurboRendererExtension,
];
}