Jayden/AFFiNE-Mirror
1
0
Fork 0
mirror of https://github.com/toeverything/AFFiNE.git synced 2026-02-15 05:37:32 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix(editor): handle resize in turbo renderer (#10465)

Browse Source
This commit is contained in:
doodlewind
2025-02-27 04:18:37 +00:00
parent be94f3fc17
commit 8cec22cc64
1 changed files with 21 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files

31
blocksuite/affine/shared/src/viewport-renderer/viewport-renderer.ts
View File

@@ -28,8 +28,8 @@ interface Tile {
zoom: number;
}
// With high enough zoom, fallback to DOM rendering
const zoomThreshold = 1;
const zoomThreshold = 1; // With high enough zoom, fallback to DOM rendering
const debounceTime = 1000; // During this period, fallback to DOM
const debug = false; // Toggle for debug logs
export class ViewportTurboRendererExtension extends LifeCycleWatcher {
@@ -66,6 +66,10 @@ export class ViewportTurboRendererExtension extends LifeCycleWatcher {
this.viewportElement = element;
syncCanvasSize(this.canvas, this.std.host);
this.setState('pending');
this.disposables.add(
this.viewport.sizeUpdated.on(() => this.handleResize())
);
this.disposables.add(
this.viewport.viewportUpdated.on(() => {
this.refresh().catch(console.error);
@@ -134,7 +138,7 @@ export class ViewportTurboRendererExtension extends LifeCycleWatcher {
() => {
this.refresh().catch(console.error);
},
1000, // During this period, fallback to DOM
debounceTime,
{ leading: false, trailing: true }
);
@@ -257,6 +261,13 @@ export class ViewportTurboRendererExtension extends LifeCycleWatcher {
this.state = newState;
}
canOptimize(): boolean {
const isReady = this.state === 'ready';
const isBelowZoomThreshold = this.viewport.zoom <= zoomThreshold;
const result = isReady && isBelowZoomThreshold;
return result;
}
private updateOptimizedBlocks() {
requestAnimationFrame(() => {
if (!this.viewportElement || !this.layoutCache) return;
@@ -281,13 +292,6 @@ export class ViewportTurboRendererExtension extends LifeCycleWatcher {
this.debugLog('Cleared optimized blocks');
}
canOptimize(): boolean {
const isReady = this.state === 'ready';
const isBelowZoomThreshold = this.viewport.zoom <= zoomThreshold;
const result = isReady && isBelowZoomThreshold;
return result;
}
private toggleOptimization(value: boolean) {
if (
this.viewportElement &&
@@ -297,4 +301,11 @@ export class ViewportTurboRendererExtension extends LifeCycleWatcher {
this.debugLog(`${value ? 'Enabled' : 'Disabled'} optimization`);
}
}
private handleResize() {
this.debugLog('Container resized, syncing canvas size');
syncCanvasSize(this.canvas, this.std.host);
this.invalidate();
this.debouncedRefresh();
}
}