Implement outline properties on view by acoates-ms · Pull Request #16074 · microsoft/react-native-windows

acoates-ms · 2026-04-29T19:32:53Z

Description

Implement outlineOffset, outlineColor outlineStyle and outlineWidth.

Type of Change

New feature (non-breaking change which adds functionality)

Microsoft Reviewers: Open in CodeFlow

github-actions · 2026-04-29T20:12:20Z

Performance Test Results

Branch: viewoutline
Commit: 5b6368dc
Time: 2026-05-05T18:23:14.851Z
Tests: 161/161 passed

✅ Passed

161 scenario(s) across 28 suite(s) — no regressions

SectionList

Scenario	Mean	Median	StdDev	Renders	vs Baseline
SectionList mount	4.70ms	5.00ms	±0.48ms	1	+0.0%
SectionList unmount	0.40ms	0.00ms	±0.52ms	0	+0.0%
SectionList rerender	10.10ms	10.00ms	±2.33ms	2	-4.8%
SectionList with-3-sections-15-items	4.80ms	5.00ms	±0.42ms	1	-9.1%
SectionList with-5-sections-50-items	5.40ms	5.50ms	±0.70ms	1	-8.3%
SectionList with-10-sections-200-items	5.70ms	5.00ms	±1.34ms	1	-9.1%
SectionList with-20-sections-200-items	4.90ms	4.50ms	±2.02ms	1	-10.0%
SectionList with-section-separator	1.50ms	1.50ms	±0.53ms	1	-25.0%
SectionList with-item-separator	2.30ms	2.00ms	±0.48ms	1	+0.0%
SectionList with-header-footer	1.60ms	2.00ms	±0.52ms	1	+0.0%
SectionList with-section-footer	1.60ms	2.00ms	±0.52ms	1	+0.0%
SectionList with-sticky-section-headers	1.40ms	1.00ms	±0.52ms	1	-50.0%
SectionList with-empty-list	0.50ms	0.50ms	±0.53ms	1	-50.0%
SectionList with-50-sections-1000-items	1.70ms	1.00ms	±1.25ms	1	-50.0%

FlatList

Scenario	Mean	Median	StdDev	Renders	vs Baseline
FlatList mount	4.40ms	4.00ms	±1.17ms	1	+0.0%
FlatList unmount	0.30ms	0.00ms	±0.48ms	0	+0.0%
FlatList rerender	9.80ms	9.00ms	±1.69ms	2	+0.0%
FlatList with-10-items	4.60ms	4.00ms	±1.26ms	1	+0.0%
FlatList with-100-items	4.90ms	5.00ms	±1.20ms	1	+0.0%
FlatList with-500-items	4.20ms	4.00ms	±0.42ms	1	+0.0%
FlatList with-1000-items	3.90ms	4.00ms	±0.57ms	1	+0.0%
FlatList horizontal	4.30ms	4.00ms	±1.83ms	1	-20.0%
FlatList with-separator	1.50ms	1.50ms	±0.53ms	1	-25.0%
FlatList with-header-footer	1.50ms	1.50ms	±0.53ms	1	-25.0%
FlatList with-empty-list	0.30ms	0.00ms	±0.48ms	1	-100.0%
FlatList with-get-item-layout	1.80ms	1.00ms	±1.55ms	1	+0.0%
FlatList inverted	1.60ms	1.00ms	±0.97ms	1	-33.3%
FlatList with-num-columns	2.10ms	2.00ms	±0.74ms	1	-33.3%

TouchableOpacity

Scenario	Mean	Median	StdDev	Renders	vs Baseline
TouchableOpacity mount	0.90ms	1.00ms	±0.32ms	1	+0.0%
TouchableOpacity unmount	0.10ms	0.00ms	±0.32ms	0	+0.0%
TouchableOpacity rerender	0.80ms	1.00ms	±0.63ms	2	+0.0%
TouchableOpacity custom-active-opacity	0.50ms	0.50ms	±0.53ms	1	-50.0%
TouchableOpacity disabled	0.60ms	1.00ms	±0.52ms	1	+0.0%
TouchableOpacity with-all-handlers	0.40ms	0.00ms	±0.52ms	1	-100.0%
TouchableOpacity with-hit-slop	0.80ms	1.00ms	±0.42ms	1	+0.0%
TouchableOpacity with-delay	0.60ms	1.00ms	±0.52ms	1	+0.0%
TouchableOpacity nested	1.20ms	1.00ms	±0.42ms	1	+0.0%
TouchableOpacity multiple-10	5.07ms	5.00ms	±1.62ms	1	-16.7%
TouchableOpacity multiple-50	24.47ms	25.00ms	±2.70ms	1	-13.8%
TouchableOpacity multiple-100	26.00ms	22.00ms	±10.09ms	1	-56.0%

ScrollView

Scenario	Mean	Median	StdDev	Renders	vs Baseline
ScrollView mount	0.80ms	0.00ms	±1.55ms	1	+0.0%
ScrollView unmount	0.00ms	0.00ms	±0.00ms	0	+0.0%
ScrollView rerender	0.30ms	0.00ms	±0.48ms	2	-100.0%
ScrollView children-20	2.93ms	3.00ms	±0.46ms	1	-25.0%
ScrollView children-100	16.93ms	16.00ms	±3.01ms	1	+0.0%
ScrollView horizontal	3.30ms	3.00ms	±0.67ms	1	-25.0%
ScrollView sticky-headers	3.10ms	3.00ms	±1.37ms	1	+0.0%
ScrollView scroll-indicators	0.80ms	1.00ms	±0.42ms	1	+0.0%
ScrollView nested	1.20ms	1.00ms	±0.63ms	1	+0.0%
ScrollView content-container-style	0.70ms	1.00ms	±0.48ms	1	+0.0%
ScrollView children-500	20.07ms	19.00ms	±3.17ms	1	+0.0%

TouchableHighlight

Scenario	Mean	Median	StdDev	Renders	vs Baseline
TouchableHighlight mount	0.30ms	0.00ms	±0.48ms	1	-100.0%
TouchableHighlight unmount	0.00ms	0.00ms	±0.00ms	0	+0.0%
TouchableHighlight rerender	0.50ms	0.50ms	±0.53ms	2	-50.0%
TouchableHighlight custom-underlay-color	0.90ms	0.50ms	±1.52ms	1	+Infinity%
TouchableHighlight custom-active-opacity	0.40ms	0.00ms	±0.52ms	1	+0.0%
TouchableHighlight disabled	0.30ms	0.00ms	±0.48ms	1	+0.0%
TouchableHighlight with-all-handlers	0.40ms	0.00ms	±0.52ms	1	+0.0%
TouchableHighlight with-hit-slop	0.40ms	0.00ms	±0.52ms	1	+0.0%
TouchableHighlight nested-touchables	0.70ms	1.00ms	±0.48ms	1	+0.0%
TouchableHighlight multiple-touchables-10	2.40ms	2.00ms	±0.52ms	1	-33.3%
TouchableHighlight multiple-touchables-50	14.70ms	12.00ms	±6.63ms	1	-4.0%
TouchableHighlight multiple-touchables-100	23.80ms	24.00ms	±2.57ms	1	+6.7%

Pressable

Scenario	Mean	Median	StdDev	Renders	vs Baseline
Pressable mount	0.40ms	0.00ms	±0.52ms	1	+0.0%
Pressable unmount	0.00ms	0.00ms	±0.00ms	0	+0.0%
Pressable rerender	0.50ms	0.50ms	±0.53ms	2	+0.0%
Pressable with-all-handlers	0.30ms	0.00ms	±0.48ms	1	+0.0%
Pressable with-style-function	0.30ms	0.00ms	±0.48ms	1	+0.0%
Pressable disabled	0.40ms	0.00ms	±0.52ms	1	+0.0%
Pressable with-hit-slop	0.30ms	0.00ms	±0.48ms	1	+0.0%
Pressable nested	0.60ms	1.00ms	±0.52ms	1	+0.0%
Pressable multiple-10	3.40ms	3.00ms	±2.50ms	1	+0.0%
Pressable multiple-50	14.53ms	14.00ms	±1.85ms	1	+0.0%
Pressable multiple-100	15.33ms	11.00ms	±10.31ms	1	-8.3%

Modal

Scenario	Mean	Median	StdDev	Renders	vs Baseline
Modal mount	0.30ms	0.00ms	±0.48ms	1	+0.0%
Modal unmount	0.10ms	0.00ms	±0.32ms	0	+0.0%
Modal rerender	0.30ms	0.00ms	±0.48ms	2	+0.0%
Modal slide-animation	0.30ms	0.00ms	±0.48ms	1	+0.0%
Modal fade-animation	0.20ms	0.00ms	±0.42ms	1	+0.0%
Modal transparent	0.30ms	0.00ms	±0.48ms	1	+0.0%
Modal with-callbacks	0.30ms	0.00ms	±0.48ms	1	+0.0%
Modal rich-content	1.40ms	1.00ms	±0.52ms	1	-50.0%
Modal with-accessibility	0.30ms	0.00ms	±0.48ms	1	+0.0%

Image

Scenario	Mean	Median	StdDev	Renders	vs Baseline
Image mount	0.00ms	0.00ms	±0.00ms	1	+0.0%
Image unmount	0.00ms	0.00ms	±0.00ms	0	+0.0%
Image rerender	0.10ms	0.00ms	±0.32ms	2	+0.0%
Image with-resize-mode	0.20ms	0.00ms	±0.42ms	1	+0.0%
Image with-border-radius	0.00ms	0.00ms	±0.00ms	1	+0.0%
Image with-tint-color	0.10ms	0.00ms	±0.32ms	1	+0.0%
Image with-blur-radius	0.00ms	0.00ms	±0.00ms	1	+0.0%
Image with-accessibility	0.20ms	0.00ms	±0.42ms	1	+0.0%
Image multiple-10	0.87ms	1.00ms	±0.35ms	1	+0.0%
Image multiple-50	3.73ms	4.00ms	±1.10ms	1	+33.3%
Image multiple-100	7.73ms	7.00ms	±1.10ms	1	-12.5%

ActivityIndicator

Scenario	Mean	Median	StdDev	Renders	vs Baseline
ActivityIndicator mount	0.10ms	0.00ms	±0.32ms	1	+0.0%
ActivityIndicator unmount	0.00ms	0.00ms	±0.00ms	0	+0.0%
ActivityIndicator rerender	0.10ms	0.00ms	±0.32ms	2	+0.0%
ActivityIndicator size-large	0.10ms	0.00ms	±0.32ms	1	+0.0%
ActivityIndicator size-small	0.10ms	0.00ms	±0.32ms	1	+0.0%
ActivityIndicator with-color	0.10ms	0.00ms	±0.32ms	1	+0.0%
ActivityIndicator not-animating	0.10ms	0.00ms	±0.32ms	1	+0.0%
ActivityIndicator with-accessibility	0.20ms	0.00ms	±0.42ms	1	+0.0%
ActivityIndicator multiple-10	0.87ms	1.00ms	±0.35ms	1	+0.0%
ActivityIndicator multiple-50	3.67ms	4.00ms	±0.82ms	1	+0.0%
ActivityIndicator multiple-100	7.73ms	8.00ms	±1.44ms	1	+14.3%

Switch

Scenario	Mean	Median	StdDev	Renders	vs Baseline
Switch mount	0.30ms	0.00ms	±0.48ms	1	+0.0%
Switch unmount	0.00ms	0.00ms	±0.00ms	0	+0.0%
Switch rerender	0.40ms	0.00ms	±0.52ms	2	-100.0%
Switch value-true	0.30ms	0.00ms	±0.48ms	1	+0.0%
Switch disabled	0.20ms	0.00ms	±0.42ms	1	+0.0%
Switch custom-colors	0.20ms	0.00ms	±0.42ms	1	+0.0%
Switch on-value-change	0.30ms	0.00ms	±0.48ms	1	+0.0%
Switch with-accessibility	0.20ms	0.00ms	±0.42ms	1	+0.0%
Switch multiple-10	1.67ms	1.00ms	±1.05ms	1	-50.0%
Switch multiple-50	9.20ms	8.00ms	±3.05ms	1	-11.1%
Switch multiple-100	17.67ms	19.00ms	±2.74ms	1	+18.8%

Button

Scenario	Mean	Median	StdDev	Renders	vs Baseline
Button mount	0.60ms	1.00ms	±0.52ms	1	+0.0%
Button unmount	0.10ms	0.00ms	±0.32ms	0	+0.0%
Button rerender	0.90ms	1.00ms	±0.32ms	2	+0.0%
Button disabled	0.50ms	0.50ms	±0.53ms	1	-50.0%
Button with-color	0.50ms	0.50ms	±0.53ms	1	+0.0%
Button with-accessibility	0.40ms	0.00ms	±0.52ms	1	-100.0%
Button multiple-10	5.27ms	5.00ms	±1.28ms	1	-16.7%
Button multiple-50	19.47ms	22.00ms	±7.03ms	1	-18.5%
Button multiple-100	13.60ms	13.00ms	±1.96ms	1	-31.6%

TextInput

Scenario	Mean	Median	StdDev	Renders	vs Baseline
TextInput mount	0.10ms	0.00ms	±0.32ms	1	+0.0%
TextInput unmount	0.10ms	0.00ms	±0.32ms	0	+0.0%
TextInput rerender	0.30ms	0.00ms	±0.48ms	2	+0.0%
TextInput multiline	0.10ms	0.00ms	±0.32ms	1	+0.0%
TextInput with-value	0.00ms	0.00ms	±0.00ms	1	+0.0%
TextInput styled	0.00ms	0.00ms	±0.00ms	1	+0.0%
TextInput multiple-100	7.87ms	7.00ms	±1.51ms	1	+0.0%

View

Scenario	Mean	Median	StdDev	Renders	vs Baseline
View mount	0.10ms	0.00ms	±0.32ms	1	+0.0%
View unmount	0.00ms	0.00ms	±0.00ms	0	+0.0%
View rerender	0.20ms	0.00ms	±0.42ms	2	+0.0%
View nested-50	3.13ms	3.00ms	±0.64ms	1	+0.0%
View nested-100	7.60ms	7.00ms	±1.18ms	1	+0.0%
View shadow	0.10ms	0.00ms	±0.32ms	1	+0.0%
View border-radius	0.20ms	0.00ms	±0.42ms	1	+0.0%
View nested-500	17.40ms	10.00ms	±13.63ms	1	+0.0%

Text

Scenario	Mean	Median	StdDev	Renders	vs Baseline
Text mount	0.10ms	0.00ms	±0.32ms	1	+0.0%
Text unmount	0.00ms	0.00ms	±0.00ms	0	+0.0%
Text rerender	0.10ms	0.00ms	±0.32ms	2	+0.0%
Text long-1000	0.10ms	0.00ms	±0.32ms	1	+0.0%
Text nested	0.20ms	0.00ms	±0.42ms	1	+0.0%
Text styled	0.20ms	0.00ms	±0.42ms	1	+0.0%
Text multiple-100	8.20ms	8.00ms	±1.74ms	1	+14.3%

SectionList.native-perf-test.ts

Scenario	Mean	Median	StdDev	Renders	vs Baseline
SectionList native mount	5.38ms	5.32ms	±0.94ms	1	-18.2%

FlatList.native-perf-test.ts

Scenario	Mean	Median	StdDev	Renders	vs Baseline
FlatList native mount	4.35ms	4.20ms	±0.36ms	1	-54.4%

TouchableHighlight.native-perf-test.ts

Scenario	Mean	Median	StdDev	Renders	vs Baseline
TouchableHighlight native mount	1.57ms	1.41ms	±0.42ms	1	-32.3%

TouchableOpacity.native-perf-test.ts

Scenario	Mean	Median	StdDev	Renders	vs Baseline
TouchableOpacity native mount	1.82ms	1.55ms	±0.80ms	1	-50.7%

Pressable.native-perf-test.ts

Scenario	Mean	Median	StdDev	Renders	vs Baseline
Pressable native mount	1.43ms	1.35ms	±0.20ms	1	-46.1%

ScrollView.native-perf-test.ts

Scenario	Mean	Median	StdDev	Renders	vs Baseline
ScrollView native mount	3.27ms	3.06ms	±0.42ms	1	-24.5%

ActivityIndicator.native-perf-test.ts

Scenario	Mean	Median	StdDev	Renders	vs Baseline
ActivityIndicator native mount	1.39ms	1.20ms	±0.52ms	1	-51.8%

TextInput.native-perf-test.ts

Scenario	Mean	Median	StdDev	Renders	vs Baseline
TextInput native mount	1.98ms	1.94ms	±0.17ms	1	-52.6%

Switch.native-perf-test.ts

Scenario	Mean	Median	StdDev	Renders	vs Baseline
Switch native mount	1.14ms	1.07ms	±0.31ms	1	-38.6%

Button.native-perf-test.ts

Scenario	Mean	Median	StdDev	Renders	vs Baseline
Button native mount	1.88ms	1.80ms	±0.24ms	1	-30.9%

Modal.native-perf-test.ts

Scenario	Mean	Median	StdDev	Renders	vs Baseline
Modal native mount	0.84ms	0.83ms	±0.03ms	1	-31.8%

Image.native-perf-test.ts

Scenario	Mean	Median	StdDev	Renders	vs Baseline
Image native mount	1.79ms	1.53ms	±0.67ms	1	-32.3%

View.native-perf-test.ts

Scenario	Mean	Median	StdDev	Renders	vs Baseline
View native mount	0.97ms	0.96ms	±0.09ms	1	-32.8%

Text.native-perf-test.ts

Scenario	Mean	Median	StdDev	Renders	vs Baseline
Text native mount	1.22ms	1.15ms	±0.19ms	1	-33.8%

acoates-ms added 2 commits April 29, 2026 12:29

Implement outline properties on view

083ec56

Change files

173a968

acoates-ms added 2 commits April 29, 2026 14:10

hostPlatformColorIsColorMeaningful impl

f32230e

update snapshots

0dc04eb

acoates-ms marked this pull request as ready for review April 29, 2026 21:11

acoates-ms requested a review from a team as a code owner April 29, 2026 21:11

acoates-ms added 4 commits April 29, 2026 15:42

fix background clip

994d432

default black borders should still be rendered.

d3f80e0

fix border sometimes being created behind the background

d65b9e3

snapshots

e60aefb

Saadnajmi approved these changes May 5, 2026

View reviewed changes

vmoroz approved these changes May 5, 2026

View reviewed changes

acoates-ms merged commit 7dcb0f3 into microsoft:main May 5, 2026
34 checks passed

acoates-ms deleted the viewoutline branch May 5, 2026 20:25

microsoft-github-policy-service Bot mentioned this pull request May 7, 2026

[0.81] Add ability to make TurboModules eager init #16095

Open

Conversation

acoates-ms commented Apr 29, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Description

Type of Change

Microsoft Reviewers: Open in CodeFlow

Uh oh!

github-actions Bot commented Apr 29, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Performance Test Results

✅ Passed

SectionList

FlatList

TouchableOpacity

ScrollView

TouchableHighlight

Pressable

Modal

Image

ActivityIndicator

Switch

Button

TextInput

View

Text

SectionList.native-perf-test.ts

FlatList.native-perf-test.ts

TouchableHighlight.native-perf-test.ts

TouchableOpacity.native-perf-test.ts

Pressable.native-perf-test.ts

ScrollView.native-perf-test.ts

ActivityIndicator.native-perf-test.ts

TextInput.native-perf-test.ts

Switch.native-perf-test.ts

Button.native-perf-test.ts

Modal.native-perf-test.ts

Image.native-perf-test.ts

View.native-perf-test.ts

Text.native-perf-test.ts

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

acoates-ms commented Apr 29, 2026 •

edited

Loading

github-actions Bot commented Apr 29, 2026 •

edited

Loading