refactor(editor): make turbo renderer a gfx extension (#10818)

This allows for easier debugging via `gfx.turboRenderer`
This commit is contained in:
doodlewind
2025-03-13 07:45:05 +00:00
parent a6fd0a135b
commit 0f062b7157
2 changed files with 23 additions and 18 deletions

View File

@@ -1,14 +1,11 @@
import { ConfigExtensionFactory } from '@blocksuite/block-std';
import { import {
ConfigExtensionFactory, type GfxController,
LifeCycleWatcher, GfxExtension,
LifeCycleWatcherIdentifier, GfxExtensionIdentifier,
StdIdentifier,
} from '@blocksuite/block-std';
import {
GfxControllerIdentifier,
type GfxViewportElement, type GfxViewportElement,
} from '@blocksuite/block-std/gfx'; } from '@blocksuite/block-std/gfx';
import type { Container, ServiceIdentifier } from '@blocksuite/global/di'; import type { Container } from '@blocksuite/global/di';
import { createIdentifier } from '@blocksuite/global/di'; import { createIdentifier } from '@blocksuite/global/di';
import { DisposableGroup } from '@blocksuite/global/disposable'; import { DisposableGroup } from '@blocksuite/global/disposable';
import debounce from 'lodash-es/debounce'; import debounce from 'lodash-es/debounce';
@@ -45,7 +42,9 @@ export const BlockPainterConfigIdentifier =
export const TurboRendererConfigFactory = export const TurboRendererConfigFactory =
ConfigExtensionFactory<TurboRendererConfig>('viewport-turbo-renderer'); ConfigExtensionFactory<TurboRendererConfig>('viewport-turbo-renderer');
export class ViewportTurboRendererExtension extends LifeCycleWatcher { export class ViewportTurboRendererExtension extends GfxExtension {
static override key = 'viewportTurboRenderer';
public state: RenderingState = 'inactive'; public state: RenderingState = 'inactive';
public readonly canvas: HTMLCanvasElement = document.createElement('canvas'); public readonly canvas: HTMLCanvasElement = document.createElement('canvas');
private readonly worker: Worker = new Worker(workerUrl, { type: 'module' }); private readonly worker: Worker = new Worker(workerUrl, { type: 'module' });
@@ -55,8 +54,16 @@ export class ViewportTurboRendererExtension extends LifeCycleWatcher {
private bitmap: ImageBitmap | null = null; private bitmap: ImageBitmap | null = null;
private viewportElement: GfxViewportElement | null = null; private viewportElement: GfxViewportElement | null = null;
static override extendGfx(gfx: GfxController) {
Object.defineProperty(gfx, 'turboRenderer', {
get() {
return gfx.std.get(ViewportTurboRendererIdentifier);
},
});
}
static override setup(di: Container) { static override setup(di: Container) {
di.addImpl(ViewportTurboRendererIdentifier, this, [StdIdentifier]); super.setup(di);
} }
get options(): RendererOptions { get options(): RendererOptions {
@@ -135,10 +142,6 @@ export class ViewportTurboRendererExtension extends LifeCycleWatcher {
this.setState('inactive'); this.setState('inactive');
} }
get gfx() {
return this.std.get(GfxControllerIdentifier);
}
get viewport() { get viewport() {
return this.gfx.viewport; return this.gfx.viewport;
} }
@@ -357,6 +360,6 @@ export class ViewportTurboRendererExtension extends LifeCycleWatcher {
} }
} }
export const ViewportTurboRendererIdentifier = LifeCycleWatcherIdentifier( export const ViewportTurboRendererIdentifier = GfxExtensionIdentifier(
'ViewportTurboRenderer' 'viewportTurboRenderer'
) as ServiceIdentifier<ViewportTurboRendererExtension>; );

View File

@@ -26,7 +26,9 @@ async function init() {
addSampleNotes(doc, 100); addSampleNotes(doc, 100);
doc.load(); doc.load();
const renderer = editor.std.get(ViewportTurboRendererIdentifier); const renderer = editor.std.get(
ViewportTurboRendererIdentifier
) as ViewportTurboRendererExtension;
window.renderer = renderer; window.renderer = renderer;
} }