smig/excalidraw
1
0
Fork 0
mirror of https://github.com/excalidraw/excalidraw.git synced 2025-05-03 10:00:07 -04:00
Code Issues Projects Releases Packages Wiki Activity Actions

feat: throttle scene rendering to animation framerate (#5422)

Browse source
This commit is contained in:
David Luzar 2022-07-07 11:47:37 +02:00 • committed by GitHub
parent c725f84334
commit b6bb74d08d
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
11 changed files with 89 additions and 51 deletions
Download patch file Download diff file Expand all files Collapse all files

34
src/components/App.tsx
View file

@ -166,7 +166,7 @@ import {
isAndroid,
} from "../keys";
import { distance2d, getGridPoint, isPathALoop } from "../math";
import { renderScene } from "../renderer";
import { renderSceneThrottled } from "../renderer/renderScene";
import { invalidateShapeForElement } from "../renderer/renderElement";
import {
calculateScrollCenter,
@ -1193,7 +1193,8 @@ class App extends React.Component<AppProps, AppState> {
element.id !== this.state.editingElement.id
);
});
const { atLeastOneVisibleElement, scrollBars } = renderScene(
renderSceneThrottled(
renderingElements,
this.state,
this.state.selectionElement,
@ -1216,24 +1217,25 @@ class App extends React.Component<AppProps, AppState> {
isExporting: false,
renderScrollbars: !this.device.isMobile,
},
({ atLeastOneVisibleElement, scrollBars }) => {
if (scrollBars) {
currentScrollBars = scrollBars;
}
const scrolledOutside =
// hide when editing text
isTextElement(this.state.editingElement)
? false
: !atLeastOneVisibleElement && renderingElements.length > 0;
if (this.state.scrolledOutside !== scrolledOutside) {
this.setState({ scrolledOutside });
}
this.scheduleImageRefresh();
},
);
if (scrollBars) {
currentScrollBars = scrollBars;
}
const scrolledOutside =
// hide when editing text
isTextElement(this.state.editingElement)
? false
: !atLeastOneVisibleElement && renderingElements.length > 0;
if (this.state.scrolledOutside !== scrolledOutside) {
this.setState({ scrolledOutside });
}
this.history.record(this.state, this.scene.getElementsIncludingDeleted());
this.scheduleImageRefresh();
// Do not notify consumers if we're still loading the scene. Among other
// potential issues, this fixes a case where the tab isn't focused during
// init, which would trigger onChange with empty elements, which would then