This commit is contained in:
zsviczian 2023-04-03 21:41:48 +02:00
parent f994e5d71d
commit f77975cee5
2 changed files with 5 additions and 15 deletions

View File

@ -1361,6 +1361,7 @@ class App extends React.Component<AppProps, AppState> {
document.querySelector(".excalidraw")!, document.querySelector(".excalidraw")!,
).getPropertyValue("--color-selection"); ).getPropertyValue("--color-selection");
if(!this.state.shouldCacheIgnoreZoom) console.log(`renderScene`);
renderScene( renderScene(
{ {
elements: renderingElements, elements: renderingElements,
@ -1386,23 +1387,19 @@ class App extends React.Component<AppProps, AppState> {
renderScrollbars: !this.device.isMobile, renderScrollbars: !this.device.isMobile,
}, },
callback: ({ atLeastOneVisibleElement, scrollBars }) => { callback: ({ atLeastOneVisibleElement, scrollBars }) => {
if(!this.state.shouldCacheIgnoreZoom) console.log(`callback 1`);
if (scrollBars) { if (scrollBars) {
currentScrollBars = scrollBars; currentScrollBars = scrollBars;
} }
if(!this.state.shouldCacheIgnoreZoom) console.log(`callback 2`);
const scrolledOutside = const scrolledOutside =
// hide when editing text // hide when editing text
isTextElement(this.state.editingElement) isTextElement(this.state.editingElement)
? false ? false
: !atLeastOneVisibleElement && renderingElements.length > 0; : !atLeastOneVisibleElement && renderingElements.length > 0;
if(!this.state.shouldCacheIgnoreZoom) console.log(`callback 3`, scrolledOutside, this.state.scrolledOutside);
if (this.state.scrolledOutside !== scrolledOutside) { if (this.state.scrolledOutside !== scrolledOutside) {
this.setState({ scrolledOutside }); this.setState({ scrolledOutside });
} }
if(!this.state.shouldCacheIgnoreZoom) console.log(`callback 4`); this.scheduleImageRefresh();
//this.scheduleImageRefresh(); if(!this.state.shouldCacheIgnoreZoom) setTimeout(()=>console.log(`after renderScene`));
if(!this.state.shouldCacheIgnoreZoom) console.log(`callback 5`);
}, },
}, },
THROTTLE_NEXT_RENDER && window.EXCALIDRAW_THROTTLE_RENDER === true, THROTTLE_NEXT_RENDER && window.EXCALIDRAW_THROTTLE_RENDER === true,

View File

@ -427,7 +427,7 @@ export const _renderScene = ({
console.error(error); console.error(error);
} }
}); });
if(!appState.shouldCacheIgnoreZoom) console.log(`rendered all elements`);
if (editingLinearElement) { if (editingLinearElement) {
renderLinearPointHandles( renderLinearPointHandles(
context, context,
@ -475,7 +475,7 @@ export const _renderScene = ({
locallySelectedElements[0] as NonDeleted<ExcalidrawLinearElement>, locallySelectedElements[0] as NonDeleted<ExcalidrawLinearElement>,
); );
} }
if(!appState.shouldCacheIgnoreZoom) console.log(`checkpoint 1`);
if ( if (
appState.selectedLinearElement && appState.selectedLinearElement &&
appState.selectedLinearElement.hoverPointIndex >= 0 appState.selectedLinearElement.hoverPointIndex >= 0
@ -637,10 +637,8 @@ export const _renderScene = ({
} }
context.restore(); context.restore();
} }
if(!appState.shouldCacheIgnoreZoom) console.log(`checkpoint 2`);
// Reset zoom // Reset zoom
context.restore(); context.restore();
if(!appState.shouldCacheIgnoreZoom) console.log(`checkpoint 3`);
// Paint remote pointers // Paint remote pointers
for (const clientId in renderConfig.remotePointerViewportCoords) { for (const clientId in renderConfig.remotePointerViewportCoords) {
let { x, y } = renderConfig.remotePointerViewportCoords[clientId]; let { x, y } = renderConfig.remotePointerViewportCoords[clientId];
@ -788,9 +786,7 @@ export const _renderScene = ({
}); });
context.restore(); context.restore();
} }
if(!appState.shouldCacheIgnoreZoom) console.log(`checkpoint 4`);
context.restore(); context.restore();
if(!appState.shouldCacheIgnoreZoom) console.log(`checkpoint 5`);
return { atLeastOneVisibleElement: visibleElements.length > 0, scrollBars }; return { atLeastOneVisibleElement: visibleElements.length > 0, scrollBars };
}; };
@ -805,7 +801,6 @@ const renderSceneThrottled = throttleRAF(
callback?: (data: ReturnType<typeof _renderScene>) => void; callback?: (data: ReturnType<typeof _renderScene>) => void;
}) => { }) => {
const ret = _renderScene(config); const ret = _renderScene(config);
if(!config.appState.shouldCacheIgnoreZoom) console.log(`renderScene 2 throttled`, config.callback)
config.callback?.(ret); config.callback?.(ret);
}, },
{ trailing: true }, { trailing: true },
@ -827,12 +822,10 @@ export const renderScene = <T extends boolean = false>(
throttle?: T, throttle?: T,
): T extends true ? void : ReturnType<typeof _renderScene> => { ): T extends true ? void : ReturnType<typeof _renderScene> => {
if (throttle) { if (throttle) {
if(!config.appState.shouldCacheIgnoreZoom) console.log(`renderScene 1 throttled`, throttle)
renderSceneThrottled(config); renderSceneThrottled(config);
return undefined as T extends true ? void : ReturnType<typeof _renderScene>; return undefined as T extends true ? void : ReturnType<typeof _renderScene>;
} }
const ret = _renderScene(config); const ret = _renderScene(config);
if(!config.appState.shouldCacheIgnoreZoom) console.log(`renderScene 1 not throttled`, config.callback)
config.callback?.(ret); config.callback?.(ret);
return ret as T extends true ? void : ReturnType<typeof _renderScene>; return ret as T extends true ? void : ReturnType<typeof _renderScene>;
}; };