perf: faster nativeView accessors (#10279)

farfromrefug · NathanWalker · web-flow · commit b7d02c9c8616 · 2023-05-01T14:56:13.000-07:00
`this.nativeViewProtected` is faster than `this.ios`

Co-authored-by: Nathan Walker &lt;walkerrunpdx@gmail.com&gt;
diff --git a/packages/core/ui/core/view/index.ios.ts b/packages/core/ui/core/view/index.ios.ts
@@ -897,13 +897,13 @@ export class View extends ViewCommon implements ViewDefinition {
 		if (!updateSuspended) {
 			CATransaction.begin();
 		}
-
-		if (this.nativeViewProtected) {
+		const view = this.nativeViewProtected;
+		if (view) {
 			if (value instanceof UIColor) {
-				this.nativeViewProtected.backgroundColor = value;
+				view.backgroundColor = value;
 			} else {
 				iosBackground.createBackgroundUIColor(this, (color: UIColor) => {
-					this.nativeViewProtected.backgroundColor = color;
+					view.backgroundColor = color;
 				});
 				this._setNativeClipToBounds();
 			}
@@ -917,9 +917,10 @@ export class View extends ViewCommon implements ViewDefinition {
 	}
 
 	_setNativeClipToBounds() {
-		if (this.nativeViewProtected) {
+		const view = this.nativeViewProtected;
+		if (view) {
 			const backgroundInternal = this.style.backgroundInternal;
-			this.nativeViewProtected.clipsToBounds = (this.nativeViewProtected instanceof UIScrollView || backgroundInternal.hasBorderWidth() || backgroundInternal.hasBorderRadius()) && !backgroundInternal.hasBoxShadow();
+			view.clipsToBounds = (view instanceof UIScrollView || backgroundInternal.hasBorderWidth() || backgroundInternal.hasBorderRadius()) && !backgroundInternal.hasBoxShadow();
 		}
 	}
 
diff --git a/packages/core/ui/layouts/layout-base.ios.ts b/packages/core/ui/layouts/layout-base.ios.ts
@@ -23,8 +23,9 @@ export class LayoutBase extends LayoutBaseCommon {
 
 	_setNativeClipToBounds() {
 		if (this.clipToBounds) {
-			if (this.nativeViewProtected) {
-				this.nativeViewProtected.clipsToBounds = true;
+			const view = this.nativeViewProtected;
+			if (view) {
+				view.clipsToBounds = true;
 			}
 		} else {
 			super._setNativeClipToBounds();
diff --git a/packages/core/ui/list-view/index.ios.ts b/packages/core/ui/list-view/index.ios.ts
@@ -275,8 +275,9 @@ export class ListView extends ListViewBase {
 
 	_setNativeClipToBounds() {
 		// Always set clipsToBounds for list-view
-		if (this.ios) {
-			this.ios.clipsToBounds = true;
+		const view = this.nativeViewProtected;
+		if (view) {
+			view.clipsToBounds = true;
 		}
 	}
 
@@ -286,7 +287,7 @@ export class ListView extends ListViewBase {
 		if (this._isDataDirty) {
 			this.refresh();
 		}
-		this.ios.delegate = this._delegate;
+		this.nativeViewProtected.delegate = this._delegate;
 	}
 
 	// @ts-ignore
@@ -313,7 +314,7 @@ export class ListView extends ListViewBase {
 	}
 
 	private _scrollToIndex(index: number, animated = true) {
-		if (!this.ios) {
+		if (!this.nativeViewProtected) {
 			return;
 		}
 
@@ -326,7 +327,7 @@ export class ListView extends ListViewBase {
 				index = itemsLength - 1;
 			}
 
-			this.ios.scrollToRowAtIndexPathAtScrollPositionAnimated(NSIndexPath.indexPathForItemInSection(index, 0), UITableViewScrollPosition.Top, animated);
+			this.nativeViewProtected.scrollToRowAtIndexPathAtScrollPositionAnimated(NSIndexPath.indexPathForItemInSection(index, 0), UITableViewScrollPosition.Top, animated);
 		} else if (Trace.isEnabled()) {
 			Trace.write(`Cannot scroll listview to index ${index} when listview items not set`, Trace.categories.Binding);
 		}
@@ -341,7 +342,7 @@ export class ListView extends ListViewBase {
 		});
 
 		if (this.isLoaded) {
-			this.ios.reloadData();
+			this.nativeViewProtected.reloadData();
 			this.requestLayout();
 			this._isDataDirty = false;
 		} else {
@@ -350,7 +351,7 @@ export class ListView extends ListViewBase {
 	}
 
 	public isItemAtIndexVisible(itemIndex: number): boolean {
-		const indexes: NSIndexPath[] = Array.from(this.ios.indexPathsForVisibleRows);
+		const indexes: NSIndexPath[] = Array.from(this.nativeViewProtected.indexPathsForVisibleRows);
 
 		return indexes.some((visIndex) => visIndex.row === itemIndex);
 	}
@@ -365,7 +366,7 @@ export class ListView extends ListViewBase {
 
 	public _onRowHeightPropertyChanged(oldValue: CoreTypes.LengthType, newValue: CoreTypes.LengthType) {
 		const value = layout.toDeviceIndependentPixels(this._effectiveRowHeight);
-		const nativeView = this.ios;
+		const nativeView = this.nativeViewProtected;
 		if (value < 0) {
 			nativeView.rowHeight = UITableViewAutomaticDimension;
 			nativeView.estimatedRowHeight = DEFAULT_HEIGHT;
@@ -395,7 +396,7 @@ export class ListView extends ListViewBase {
 		const changed = this._setCurrentMeasureSpecs(widthMeasureSpec, heightMeasureSpec);
 		super.measure(widthMeasureSpec, heightMeasureSpec);
 		if (changed) {
-			this.ios.reloadData();
+			this.nativeViewProtected.reloadData();
 		}
 	}
 
@@ -432,7 +433,7 @@ export class ListView extends ListViewBase {
 			return height;
 		}
 
-		return this.ios.estimatedRowHeight;
+		return this.nativeViewProtected.estimatedRowHeight;
 	}
 
 	public _prepareCell(cell: ListViewCell, indexPath: NSIndexPath): number {
@@ -499,10 +500,10 @@ export class ListView extends ListViewBase {
 	}
 
 	[separatorColorProperty.getDefault](): UIColor {
-		return this.ios.separatorColor;
+		return this.nativeViewProtected.separatorColor;
 	}
 	[separatorColorProperty.setNative](value: Color | UIColor) {
-		this.ios.separatorColor = value instanceof Color ? value.ios : value;
+		this.nativeViewProtected.separatorColor = value instanceof Color ? value.ios : value;
 	}
 
 	[itemTemplatesProperty.getDefault](): KeyedTemplate[] {
@@ -512,7 +513,7 @@ export class ListView extends ListViewBase {
 		this._itemTemplatesInternal = new Array<KeyedTemplate>(this._defaultTemplate);
 		if (value) {
 			for (let i = 0, length = value.length; i < length; i++) {
-				this.ios.registerClassForCellReuseIdentifier(ListViewCell.class(), value[i].key);
+				this.nativeViewProtected.registerClassForCellReuseIdentifier(ListViewCell.class(), value[i].key);
 			}
 			this._itemTemplatesInternal = this._itemTemplatesInternal.concat(value);
 		}
@@ -524,7 +525,7 @@ export class ListView extends ListViewBase {
 		return DEFAULT_HEIGHT;
 	}
 	[iosEstimatedRowHeightProperty.setNative](value: CoreTypes.LengthType) {
-		const nativeView = this.ios;
+		const nativeView = this.nativeViewProtected;
 		const estimatedHeight = Length.toDevicePixels(value, 0);
 		nativeView.estimatedRowHeight = estimatedHeight < 0 ? DEFAULT_HEIGHT : estimatedHeight;
 	}

Original file line number	Diff line number	Diff line change
`@@ -897,13 +897,13 @@ export class View extends ViewCommon implements ViewDefinition {`
`897`	`897`	`if (!updateSuspended) {`
`898`	`898`	`CATransaction.begin();`
`899`	`899`	`}`
`900`		`-`
`901`		`- if (this.nativeViewProtected) {`
	`900`	`+ const view = this.nativeViewProtected;`
	`901`	`+ if (view) {`
`902`	`902`	`if (value instanceof UIColor) {`
`903`		`- this.nativeViewProtected.backgroundColor = value;`
	`903`	`+ view.backgroundColor = value;`
`904`	`904`	`} else {`
`905`	`905`	`iosBackground.createBackgroundUIColor(this, (color: UIColor) => {`
`906`		`- this.nativeViewProtected.backgroundColor = color;`
	`906`	`+ view.backgroundColor = color;`
`907`	`907`	`});`
`908`	`908`	`this._setNativeClipToBounds();`
`909`	`909`	`}`
`@@ -917,9 +917,10 @@ export class View extends ViewCommon implements ViewDefinition {`
`917`	`917`	`}`
`918`	`918`
`919`	`919`	`_setNativeClipToBounds() {`
`920`		`- if (this.nativeViewProtected) {`
	`920`	`+ const view = this.nativeViewProtected;`
	`921`	`+ if (view) {`
`921`	`922`	`const backgroundInternal = this.style.backgroundInternal;`
`922`		`- this.nativeViewProtected.clipsToBounds = (this.nativeViewProtected instanceof UIScrollView \|\| backgroundInternal.hasBorderWidth() \|\| backgroundInternal.hasBorderRadius()) && !backgroundInternal.hasBoxShadow();`
	`923`	`+ view.clipsToBounds = (view instanceof UIScrollView \|\| backgroundInternal.hasBorderWidth() \|\| backgroundInternal.hasBorderRadius()) && !backgroundInternal.hasBoxShadow();`
`923`	`924`	`}`
`924`	`925`	`}`
`925`	`926`
Original file line number	Diff line number	Diff line change
`@@ -275,8 +275,9 @@ export class ListView extends ListViewBase {`
`275`	`275`
`276`	`276`	`_setNativeClipToBounds() {`
`277`	`277`	`// Always set clipsToBounds for list-view`
`278`		`- if (this.ios) {`
`279`		`- this.ios.clipsToBounds = true;`
	`278`	`+ const view = this.nativeViewProtected;`
	`279`	`+ if (view) {`
	`280`	`+ view.clipsToBounds = true;`
`280`	`281`	`}`
`281`	`282`	`}`
`282`	`283`
`@@ -286,7 +287,7 @@ export class ListView extends ListViewBase {`
`286`	`287`	`if (this._isDataDirty) {`
`287`	`288`	`this.refresh();`
`288`	`289`	`}`
`289`		`- this.ios.delegate = this._delegate;`
	`290`	`+ this.nativeViewProtected.delegate = this._delegate;`
`290`	`291`	`}`
`291`	`292`
`292`	`293`	`// @ts-ignore`
`@@ -313,7 +314,7 @@ export class ListView extends ListViewBase {`
`313`	`314`	`}`
`314`	`315`
`315`	`316`	`private _scrollToIndex(index: number, animated = true) {`
`316`		`- if (!this.ios) {`
	`317`	`+ if (!this.nativeViewProtected) {`
`317`	`318`	`return;`
`318`	`319`	`}`
`319`	`320`
`@@ -326,7 +327,7 @@ export class ListView extends ListViewBase {`
`326`	`327`	`index = itemsLength - 1;`
`327`	`328`	`}`
`328`	`329`
`329`		`- this.ios.scrollToRowAtIndexPathAtScrollPositionAnimated(NSIndexPath.indexPathForItemInSection(index, 0), UITableViewScrollPosition.Top, animated);`
	`330`	`+ this.nativeViewProtected.scrollToRowAtIndexPathAtScrollPositionAnimated(NSIndexPath.indexPathForItemInSection(index, 0), UITableViewScrollPosition.Top, animated);`
`330`	`331`	`} else if (Trace.isEnabled()) {`
`331`	`332`	Trace.write(`Cannot scroll listview to index ${index} when listview items not set`, Trace.categories.Binding);
`332`	`333`	`}`
`@@ -341,7 +342,7 @@ export class ListView extends ListViewBase {`
`341`	`342`	`});`
`342`	`343`
`343`	`344`	`if (this.isLoaded) {`
`344`		`- this.ios.reloadData();`
	`345`	`+ this.nativeViewProtected.reloadData();`
`345`	`346`	`this.requestLayout();`
`346`	`347`	`this._isDataDirty = false;`
`347`	`348`	`} else {`
`@@ -350,7 +351,7 @@ export class ListView extends ListViewBase {`
`350`	`351`	`}`
`351`	`352`
`352`	`353`	`public isItemAtIndexVisible(itemIndex: number): boolean {`
`353`		`- const indexes: NSIndexPath[] = Array.from(this.ios.indexPathsForVisibleRows);`
	`354`	`+ const indexes: NSIndexPath[] = Array.from(this.nativeViewProtected.indexPathsForVisibleRows);`
`354`	`355`
`355`	`356`	`return indexes.some((visIndex) => visIndex.row === itemIndex);`
`356`	`357`	`}`
`@@ -365,7 +366,7 @@ export class ListView extends ListViewBase {`
`365`	`366`
`366`	`367`	`public _onRowHeightPropertyChanged(oldValue: CoreTypes.LengthType, newValue: CoreTypes.LengthType) {`
`367`	`368`	`const value = layout.toDeviceIndependentPixels(this._effectiveRowHeight);`
`368`		`- const nativeView = this.ios;`
	`369`	`+ const nativeView = this.nativeViewProtected;`
`369`	`370`	`if (value < 0) {`
`370`	`371`	`nativeView.rowHeight = UITableViewAutomaticDimension;`
`371`	`372`	`nativeView.estimatedRowHeight = DEFAULT_HEIGHT;`
`@@ -395,7 +396,7 @@ export class ListView extends ListViewBase {`
`395`	`396`	`const changed = this._setCurrentMeasureSpecs(widthMeasureSpec, heightMeasureSpec);`
`396`	`397`	`super.measure(widthMeasureSpec, heightMeasureSpec);`
`397`	`398`	`if (changed) {`
`398`		`- this.ios.reloadData();`
	`399`	`+ this.nativeViewProtected.reloadData();`
`399`	`400`	`}`
`400`	`401`	`}`
`401`	`402`
`@@ -432,7 +433,7 @@ export class ListView extends ListViewBase {`
`432`	`433`	`return height;`
`433`	`434`	`}`
`434`	`435`
`435`		`- return this.ios.estimatedRowHeight;`
	`436`	`+ return this.nativeViewProtected.estimatedRowHeight;`
`436`	`437`	`}`
`437`	`438`
`438`	`439`	`public _prepareCell(cell: ListViewCell, indexPath: NSIndexPath): number {`
`@@ -499,10 +500,10 @@ export class ListView extends ListViewBase {`
`499`	`500`	`}`
`500`	`501`
`501`	`502`	`[separatorColorProperty.getDefault](): UIColor {`
`502`		`- return this.ios.separatorColor;`
	`503`	`+ return this.nativeViewProtected.separatorColor;`
`503`	`504`	`}`
`504`	`505`	`[separatorColorProperty.setNative](value: Color \| UIColor) {`
`505`		`- this.ios.separatorColor = value instanceof Color ? value.ios : value;`
	`506`	`+ this.nativeViewProtected.separatorColor = value instanceof Color ? value.ios : value;`
`506`	`507`	`}`
`507`	`508`
`508`	`509`	`[itemTemplatesProperty.getDefault](): KeyedTemplate[] {`
`@@ -512,7 +513,7 @@ export class ListView extends ListViewBase {`
`512`	`513`	`this._itemTemplatesInternal = new Array<KeyedTemplate>(this._defaultTemplate);`
`513`	`514`	`if (value) {`
`514`	`515`	`for (let i = 0, length = value.length; i < length; i++) {`
`515`		`- this.ios.registerClassForCellReuseIdentifier(ListViewCell.class(), value[i].key);`
	`516`	`+ this.nativeViewProtected.registerClassForCellReuseIdentifier(ListViewCell.class(), value[i].key);`
`516`	`517`	`}`
`517`	`518`	`this._itemTemplatesInternal = this._itemTemplatesInternal.concat(value);`
`518`	`519`	`}`
`@@ -524,7 +525,7 @@ export class ListView extends ListViewBase {`
`524`	`525`	`return DEFAULT_HEIGHT;`
`525`	`526`	`}`
`526`	`527`	`[iosEstimatedRowHeightProperty.setNative](value: CoreTypes.LengthType) {`
`527`		`- const nativeView = this.ios;`
	`528`	`+ const nativeView = this.nativeViewProtected;`
`528`	`529`	`const estimatedHeight = Length.toDevicePixels(value, 0);`
`529`	`530`	`nativeView.estimatedRowHeight = estimatedHeight < 0 ? DEFAULT_HEIGHT : estimatedHeight;`
`530`	`531`	`}`