javascript/NativeScript
1
0
Fork 0
mirror of https://github.com/NativeScript/NativeScript.git synced 2025-08-17 04:41:36 +08:00
Code Issues Packages Projects Releases Wiki Activity

perf: reduce amount of layout calls and debounce layouts when needed (#10164)

Browse Source
This commit is contained in:
Eduardo Speroni
2023-03-17 14:07:22 -03:00
committed by GitHub
parent 9ed3c9b256
commit 8b721c1496
4 changed files with 110 additions and 26 deletions
Download Patch File Download Diff File Expand all files Collapse all files

28
apps/automated/src/test-runner.ts
View File

@ -138,19 +138,19 @@ allTests['STACKLAYOUT'] = stackLayoutTests;
import * as flexBoxLayoutTests from './ui/layouts/flexbox-layout-tests'; import * as flexBoxLayoutTests from './ui/layouts/flexbox-layout-tests';
allTests['FLEXBOXLAYOUT'] = flexBoxLayoutTests; allTests['FLEXBOXLAYOUT'] = flexBoxLayoutTests;
import * as safeAreaLayoutTests from './ui/layouts/safe-area-tests'; // import * as safeAreaLayoutTests from './ui/layouts/safe-area-tests';
import * as safeAreaListViewtTests from './ui/list-view/list-view-safe-area-tests'; // import * as safeAreaListViewtTests from './ui/list-view/list-view-safe-area-tests';
import * as scrollViewSafeAreaTests from './ui/scroll-view/scroll-view-safe-area-tests'; // import * as scrollViewSafeAreaTests from './ui/scroll-view/scroll-view-safe-area-tests';
import * as repeaterSafeAreaTests from './ui/repeater/repeater-safe-area-tests'; // import * as repeaterSafeAreaTests from './ui/repeater/repeater-safe-area-tests';
import * as webViewSafeAreaTests from './ui/web-view/web-view-safe-area-tests'; // import * as webViewSafeAreaTests from './ui/web-view/web-view-safe-area-tests';
if (isIOS && Utils.ios.MajorVersion > 10) { // if (isIOS && Utils.ios.MajorVersion > 10) {
allTests['SAFEAREALAYOUT'] = safeAreaLayoutTests; // allTests['SAFEAREALAYOUT'] = safeAreaLayoutTests;
allTests['SAFEAREA-LISTVIEW'] = safeAreaListViewtTests; // allTests['SAFEAREA-LISTVIEW'] = safeAreaListViewtTests;
allTests['SAFEAREA-SCROLL-VIEW'] = scrollViewSafeAreaTests; // allTests['SAFEAREA-SCROLL-VIEW'] = scrollViewSafeAreaTests;
allTests['SAFEAREA-REPEATER'] = repeaterSafeAreaTests; // allTests['SAFEAREA-REPEATER'] = repeaterSafeAreaTests;
allTests['SAFEAREA-WEBVIEW'] = webViewSafeAreaTests; // allTests['SAFEAREA-WEBVIEW'] = webViewSafeAreaTests;
} // }
import * as rootViewsCssClassesTests from './ui/styling/root-views-css-classes-tests'; import * as rootViewsCssClassesTests from './ui/styling/root-views-css-classes-tests';
allTests['ROOT-VIEWS-CSS-CLASSES'] = rootViewsCssClassesTests; allTests['ROOT-VIEWS-CSS-CLASSES'] = rootViewsCssClassesTests;
@ -278,8 +278,8 @@ allTests['TAB-VIEW-ROOT'] = tabViewRootTests;
import * as resetRootViewTests from './ui/root-view/reset-root-view-tests'; import * as resetRootViewTests from './ui/root-view/reset-root-view-tests';
allTests['RESET-ROOT-VIEW'] = resetRootViewTests; allTests['RESET-ROOT-VIEW'] = resetRootViewTests;
import * as rootViewTests from './ui/root-view/root-view-tests'; // import * as rootViewTests from './ui/root-view/root-view-tests';
allTests['ROOT-VIEW'] = rootViewTests; // allTests['ROOT-VIEW'] = rootViewTests;
import * as utilsTests from './utils/utils-tests'; import * as utilsTests from './utils/utils-tests';
allTests['UTILS'] = utilsTests; allTests['UTILS'] = utilsTests;

4
packages/core/ui/core/view/index.ios.ts
View File

@ -211,7 +211,6 @@ export class View extends ViewCommon implements ViewDefinition {
const boundsOrigin = nativeView.bounds.origin; const boundsOrigin = nativeView.bounds.origin;
const boundsFrame = adjustedFrame || frame; const boundsFrame = adjustedFrame || frame;
nativeView.bounds = CGRectMake(boundsOrigin.x, boundsOrigin.y, boundsFrame.size.width, boundsFrame.size.height); nativeView.bounds = CGRectMake(boundsOrigin.x, boundsOrigin.y, boundsFrame.size.width, boundsFrame.size.height);
nativeView.layoutIfNeeded();
this._raiseLayoutChangedEvent(); this._raiseLayoutChangedEvent();
this._isLaidOut = true; this._isLaidOut = true;
@ -889,6 +888,9 @@ export class View extends ViewCommon implements ViewDefinition {
} }
_setNativeClipToBounds() { _setNativeClipToBounds() {
if (!this.nativeViewProtected) {
return;
}
const backgroundInternal = this.style.backgroundInternal; const backgroundInternal = this.style.backgroundInternal;
this.nativeViewProtected.clipsToBounds = (this.nativeViewProtected instanceof UIScrollView || backgroundInternal.hasBorderWidth() || backgroundInternal.hasBorderRadius()) && !backgroundInternal.hasBoxShadow(); this.nativeViewProtected.clipsToBounds = (this.nativeViewProtected instanceof UIScrollView || backgroundInternal.hasBorderWidth() || backgroundInternal.hasBorderRadius()) && !backgroundInternal.hasBoxShadow();
} }

59
packages/core/ui/core/view/view-helper/index.ios.ts
View File

@ -14,9 +14,51 @@ const majorVersion = iOSNativeHelper.MajorVersion;
class UILayoutViewController extends UIViewController { class UILayoutViewController extends UIViewController {
public owner: WeakRef<View>; public owner: WeakRef<View>;
private _isRunningLayout: number;
private get isRunningLayout() {
return this._isRunningLayout !== 0;
}
private startRunningLayout() {
this._isRunningLayout++;
}
private finishRunningLayout() {
this._isRunningLayout--;
this.clearScheduledLayout();
}
private runLayout(cb: () => void) {
try {
this.startRunningLayout();
cb();
} finally {
this.finishRunningLayout();
}
}
layoutTimer: number;
private clearScheduledLayout() {
if (this.layoutTimer) {
clearTimeout(this.layoutTimer);
this.layoutTimer = null;
}
}
private scheduleLayout() {
if (this.layoutTimer) {
return;
}
setTimeout(() => {
this.layoutTimer = null;
if (!this.isRunningLayout) {
this.runLayout(() => this.layoutOwner());
}
});
}
public static initWithOwner(owner: WeakRef<View>): UILayoutViewController { public static initWithOwner(owner: WeakRef<View>): UILayoutViewController {
const controller = <UILayoutViewController>UILayoutViewController.new(); const controller = <UILayoutViewController>UILayoutViewController.new();
controller.owner = owner; controller.owner = owner;
controller._isRunningLayout = 0;
return controller; return controller;
} }
@ -29,6 +71,11 @@ class UILayoutViewController extends UIViewController {
this.extendedLayoutIncludesOpaqueBars = true; this.extendedLayoutIncludesOpaqueBars = true;
} }
public viewSafeAreaInsetsDidChange(): void {
super.viewSafeAreaInsetsDidChange();
this.scheduleLayout();
}
public viewWillLayoutSubviews(): void { public viewWillLayoutSubviews(): void {
super.viewWillLayoutSubviews(); super.viewWillLayoutSubviews();
const owner = this.owner?.deref(); const owner = this.owner?.deref();
@ -38,8 +85,20 @@ class UILayoutViewController extends UIViewController {
} }
public viewDidLayoutSubviews(): void { public viewDidLayoutSubviews(): void {
this.startRunningLayout();
super.viewDidLayoutSubviews(); super.viewDidLayoutSubviews();
this.layoutOwner();
this.finishRunningLayout();
}
layoutOwner(force = false) {
const owner = this.owner?.deref(); const owner = this.owner?.deref();
if (!force && !!owner.nativeViewProtected?.layer.needsLayout?.()) {
// we skip layout if the view is not yet laid out yet
// this usually means that viewDidLayoutSubviews will be called again
// so doing a layout pass now will layout with the wrong parameters
return;
}
if (owner) { if (owner) {
if (majorVersion >= 11) { if (majorVersion >= 11) {
// Handle nested UILayoutViewController safe area application. // Handle nested UILayoutViewController safe area application.

45
packages/core/ui/page/index.ios.ts
View File

@ -74,7 +74,6 @@ class UIViewControllerImpl extends UIViewController {
public isBackstackSkipped: boolean; public isBackstackSkipped: boolean;
public isBackstackCleared: boolean; public isBackstackCleared: boolean;
private didFirstLayout: boolean;
// this is initialized in initWithOwner since the constructor doesn't run on native classes // this is initialized in initWithOwner since the constructor doesn't run on native classes
private _isRunningLayout: number; private _isRunningLayout: number;
private get isRunningLayout() { private get isRunningLayout() {
@ -85,7 +84,7 @@ class UIViewControllerImpl extends UIViewController {
} }
private finishRunningLayout() { private finishRunningLayout() {
this._isRunningLayout--; this._isRunningLayout--;
this.didFirstLayout = true; this.clearScheduledLayout();
} }
private runLayout(cb: () => void) { private runLayout(cb: () => void) {
try { try {
@ -96,11 +95,31 @@ class UIViewControllerImpl extends UIViewController {
} }
} }
layoutTimer: number;
private clearScheduledLayout() {
if (this.layoutTimer) {
clearTimeout(this.layoutTimer);
this.layoutTimer = null;
}
}
private scheduleLayout() {
if (this.layoutTimer) {
return;
}
setTimeout(() => {
this.layoutTimer = null;
if (!this.isRunningLayout) {
this.runLayout(() => this.layoutOwner());
}
});
}
public static initWithOwner(owner: WeakRef<Page>): UIViewControllerImpl { public static initWithOwner(owner: WeakRef<Page>): UIViewControllerImpl {
const controller = <UIViewControllerImpl>UIViewControllerImpl.new(); const controller = <UIViewControllerImpl>UIViewControllerImpl.new();
controller._owner = owner; controller._owner = owner;
controller._isRunningLayout = 0; controller._isRunningLayout = 0;
controller.didFirstLayout = false;
return controller; return controller;
} }
@ -281,19 +300,24 @@ class UIViewControllerImpl extends UIViewController {
public viewSafeAreaInsetsDidChange(): void { public viewSafeAreaInsetsDidChange(): void {
super.viewSafeAreaInsetsDidChange(); super.viewSafeAreaInsetsDidChange();
if (this.isRunningLayout || !this.didFirstLayout) { this.scheduleLayout();
return;
}
const owner = this._owner?.deref();
if (owner) {
this.runLayout(() => IOSHelper.layoutView(this, owner));
}
} }
public viewDidLayoutSubviews(): void { public viewDidLayoutSubviews(): void {
this.startRunningLayout(); this.startRunningLayout();
super.viewDidLayoutSubviews(); super.viewDidLayoutSubviews();
this.layoutOwner();
this.finishRunningLayout();
}
layoutOwner(force = false) {
const owner = this._owner?.deref(); const owner = this._owner?.deref();
if (!force && !!owner.nativeViewProtected?.layer.needsLayout?.()) {
// we skip layout if the view is not yet laid out yet
// this usually means that viewDidLayoutSubviews will be called again
// so doing a layout pass now will layout with the wrong parameters
return;
}
if (owner) { if (owner) {
// layout(owner.actionBar) // layout(owner.actionBar)
// layout(owner.content) // layout(owner.content)
@ -345,7 +369,6 @@ class UIViewControllerImpl extends UIViewController {
IOSHelper.layoutView(this, owner); IOSHelper.layoutView(this, owner);
} }
this.finishRunningLayout();
} }
// Mind implementation for other controllerss // Mind implementation for other controllerss