Skip to content

perf: use path aliases and swc for test:perf tasks to improve build speeds#26893

Merged
Hotell merged 4 commits intomicrosoft:masterfrom
Hotell:hotell/build/ts/path-aliases-for-all-4
Apr 5, 2023
Merged

perf: use path aliases and swc for test:perf tasks to improve build speeds#26893
Hotell merged 4 commits intomicrosoft:masterfrom
Hotell:hotell/build/ts/path-aliases-for-all-4

Conversation

@Hotell
Copy link
Contributor

@Hotell Hotell commented Feb 17, 2023

Test suite Build time Delta Test time Delta
react-components: Before 186s +96% 🚅 163s -63%/ after rebase 0%
react-components: After 8s 262s / after rebase 162s
react: Before 134s +92% 🚅 1231s -65% / after rebase ~0%
react: After 11s 1800s / after rebase 1227s
react-northstar: Before 490s +93% 🚅 402s +16.5% 🚅
react-northstart: After 35s 345s

Previous Behavior

image

New Behavior

image

  • perf improvements
  • every perf app has unified type-check npm alias

Related Issue(s)

@Hotell Hotell changed the title Hotell/build/ts/path aliases for all 4 perf: use path aliases and swc for test:perf tasks to drastically improve perf pipeline speeds Feb 17, 2023
@size-auditor
Copy link

size-auditor bot commented Feb 17, 2023

Asset size changes

⚠️ Insufficient baseline data to detect size changes

Unable to find bundle size details for Baseline commit: 52e1469

Possible causes

  • The baseline build 52e1469 is broken
  • The Size Auditor run for the baseline build 52e1469 was not triggered

Recommendations

  • Please merge your branch for this Pull request with the latest master build and commit your changes once again

@codesandbox-ci
Copy link

codesandbox-ci bot commented Feb 17, 2023

This pull request is automatically built and testable in CodeSandbox.

To see build info of the built libraries, click here or the icon next to each commit SHA.

Latest deployment of this branch, based on commit 30fbbbd:

Sandbox Source
@fluentui/react 8 starter Configuration
@fluentui/react-components 9 starter Configuration

@fabricteam
Copy link
Collaborator

fabricteam commented Feb 17, 2023

📊 Bundle size report

Unchanged fixtures
Package & Exports Size (minified/GZIP)
global-context
createContext
533 B
341 B
global-context
createContextSelector
560 B
352 B
priority-overflow
createOverflowManager
3.194 kB
1.314 kB
react-accordion
Accordion (including children components)
88.882 kB
26.551 kB
react-alert
Alert
96.647 kB
23.133 kB
react-avatar
Avatar
60.312 kB
15.579 kB
react-avatar
AvatarGroup
18.178 kB
6.683 kB
react-avatar
AvatarGroupItem
76.573 kB
20.086 kB
react-badge
Badge
25.85 kB
7.585 kB
react-badge
CounterBadge
26.833 kB
7.889 kB
react-badge
PresenceBadge
34.458 kB
8.693 kB
react-button
Button
39.749 kB
9.959 kB
react-button
CompoundButton
46.921 kB
11.428 kB
react-button
MenuButton
44.437 kB
11.306 kB
react-button
SplitButton
52.931 kB
12.872 kB
react-button
ToggleButton
58.121 kB
11.878 kB
react-card
Card - All
83.489 kB
23.894 kB
react-card
Card
78.308 kB
22.431 kB
react-card
CardFooter
9.035 kB
3.799 kB
react-card
CardHeader
10.959 kB
4.503 kB
react-card
CardPreview
9.84 kB
4.153 kB
react-checkbox
Checkbox
36.067 kB
10.856 kB
react-checkbox
CheckboxField
43.019 kB
12.787 kB
react-combobox
Combobox (including child components)
88.743 kB
28.107 kB
react-combobox
ComboboxField
85.147 kB
27.871 kB
react-combobox
Dropdown (including child components)
87.441 kB
27.855 kB
react-components
react-components: Button, FluentProvider & webLightTheme
67.994 kB
18.395 kB
react-components
react-components: Accordion, Button, FluentProvider, Image, Menu, Popover
207.512 kB
57.555 kB
react-components
react-components: FluentProvider & webLightTheme
38.819 kB
12.351 kB
react-datepicker-compat
DatePicker Compat
250.208 kB
66.95 kB
react-dialog
Dialog (including children components)
93.388 kB
27.408 kB
react-divider
Divider
19.863 kB
6.697 kB
react-field
Field
20.552 kB
7.092 kB
react-image
Image
14.011 kB
4.993 kB
react-infobutton
InfoButton
130.577 kB
39.439 kB
react-infobutton
InfoLabel
133.874 kB
40.488 kB
react-input
Input
25.747 kB
7.697 kB
react-input
InputField
35.723 kB
10.637 kB
react-label
Label
12.57 kB
4.586 kB
react-link
Link
12.301 kB
5.07 kB
react-menu
Menu (including children components)
131.038 kB
39.653 kB
react-menu
Menu (including selectable components)
134.174 kB
40.187 kB
react-overflow
hooks only
11.214 kB
4.271 kB
react-persona
Persona
67.338 kB
17.524 kB
react-popover
Popover
117.58 kB
35.828 kB
react-portal
Portal
11.649 kB
4.263 kB
react-portal-compat
PortalCompatProvider
6.446 kB
2.185 kB
react-positioning
usePositioning
24.008 kB
8.798 kB
react-progress
ProgressBar
15.961 kB
5.675 kB
react-progress
ProgressField
26.435 kB
8.859 kB
react-provider
FluentProvider
20.766 kB
7.119 kB
react-radio
Radio
35.48 kB
11.126 kB
react-radio
RadioGroup
17.988 kB
6.544 kB
react-radio
RadioGroupField
28.166 kB
9.735 kB
react-select
Select
26.957 kB
8.766 kB
react-select
SelectField
36.293 kB
11.316 kB
react-slider
Slider
35.919 kB
11.059 kB
react-slider
SliderField
45.847 kB
14.005 kB
react-spinbutton
SpinButton
35.648 kB
10.348 kB
react-spinbutton
SpinButtonField
44.671 kB
12.812 kB
react-spinner
Spinner
23.425 kB
7.195 kB
react-switch
Switch
31.413 kB
9.294 kB
react-switch
SwitchField
38.317 kB
11.21 kB
react-table
DataGrid
149.878 kB
40.662 kB
react-table
Table (Primitives only)
47.119 kB
12.703 kB
react-table
Table as DataGrid
138.018 kB
35.282 kB
react-table
Table (Selection only)
85.849 kB
21.303 kB
react-table
Table (Sort only)
85.179 kB
21.113 kB
react-text
Text - Default
15.018 kB
5.327 kB
react-text
Text - Wrappers
15.572 kB
5.23 kB
react-textarea
Textarea
29.07 kB
9.081 kB
react-textarea
TextareaField
39.454 kB
12.055 kB
react-theme
Single theme token import
69 B
89 B
react-theme
Teams: all themes
31.33 kB
6.764 kB
react-theme
Teams: Light theme
17.895 kB
5.162 kB
react-tooltip
Tooltip
49.388 kB
16.815 kB
react-utilities
SSRProvider
180 B
159 B
🤖 This report was generated against 52e1469feb1547e05a1272f8a57dd3951ec474b1

@fabricteam
Copy link
Collaborator

fabricteam commented Feb 17, 2023

🕵 fluentuiv9 No visual regressions between this PR and main

@fabricteam
Copy link
Collaborator

fabricteam commented Feb 17, 2023

Perf Analysis (@fluentui/react-northstar)

⚠️ 6 potential perf regressions detected

Potential regressions comparing to master

Scenario Current PR Ticks Baseline Ticks Ratio Regression Analysis
PortalMinimalPerf.default 114 107 1.07:1 analysis
AvatarMinimalPerf.default 146 138 1.06:1 analysis
AttachmentMinimalPerf.default 106 103 1.03:1 analysis
ButtonMinimalPerf.default 115 112 1.03:1 analysis
AccordionMinimalPerf.default 108 106 1.02:1 analysis
TreeWith60ListItems.default 101 113 0.89:1 analysis
Perf tests with no regressions
Scenario Current PR Ticks Baseline Ticks Ratio
ProviderMergeThemesPerf.default 864 751 1.15:1
TextAreaMinimalPerf.default 372 339 1.1:1
SkeletonMinimalPerf.default 280 257 1.09:1
ChatDuplicateMessagesPerf.default 199 184 1.08:1
MenuMinimalPerf.default 659 609 1.08:1
ReactionMinimalPerf.default 296 273 1.08:1
StatusMinimalPerf.default 555 516 1.08:1
ButtonSlotsPerf.default 386 360 1.07:1
ImageMinimalPerf.default 308 289 1.07:1
LoaderMinimalPerf.default 233 218 1.07:1
DialogMinimalPerf.default 619 584 1.06:1
HeaderMinimalPerf.default 291 275 1.06:1
ItemLayoutMinimalPerf.default 888 841 1.06:1
ListMinimalPerf.default 410 388 1.06:1
ProviderMinimalPerf.default 266 250 1.06:1
TreeMinimalPerf.default 610 578 1.06:1
ChatWithPopoverPerf.default 235 224 1.05:1
RadioGroupMinimalPerf.default 358 342 1.05:1
SliderMinimalPerf.default 853 814 1.05:1
TableMinimalPerf.default 321 305 1.05:1
TextMinimalPerf.default 265 253 1.05:1
AlertMinimalPerf.default 196 188 1.04:1
ButtonOverridesMissPerf.default 779 751 1.04:1
CardMinimalPerf.default 406 392 1.04:1
ChatMinimalPerf.default 570 549 1.04:1
DividerMinimalPerf.default 281 269 1.04:1
EmbedMinimalPerf.default 2064 1989 1.04:1
InputMinimalPerf.default 670 645 1.04:1
ListNestedPerf.default 426 409 1.04:1
ListWith60ListItems.default 472 456 1.04:1
SegmentMinimalPerf.default 269 258 1.04:1
SplitButtonMinimalPerf.default 2738 2630 1.04:1
CarouselMinimalPerf.default 322 312 1.03:1
CheckboxMinimalPerf.default 1339 1302 1.03:1
FlexMinimalPerf.default 215 209 1.03:1
FormMinimalPerf.default 292 284 1.03:1
LayoutMinimalPerf.default 279 271 1.03:1
MenuButtonMinimalPerf.default 1196 1158 1.03:1
PopupMinimalPerf.default 484 472 1.03:1
CustomToolbarPrototype.default 1799 1744 1.03:1
TooltipMinimalPerf.default 1600 1548 1.03:1
DatepickerMinimalPerf.default 4527 4431 1.02:1
DropdownManyItemsPerf.default 478 470 1.02:1
DropdownMinimalPerf.default 1761 1729 1.02:1
GridMinimalPerf.default 256 251 1.02:1
HeaderSlotsPerf.default 619 607 1.02:1
LabelMinimalPerf.default 293 288 1.02:1
TableManyItemsPerf.default 1421 1390 1.02:1
AttachmentSlotsPerf.default 775 765 1.01:1
BoxMinimalPerf.default 266 263 1.01:1
ToolbarMinimalPerf.default 674 670 1.01:1
AnimationMinimalPerf.default 391 390 1:1
ListCommonPerf.default 493 493 1:1
IconMinimalPerf.default 472 481 0.98:1
VideoMinimalPerf.default 524 534 0.98:1
RosterPerf.default 1641 1689 0.97:1
RefMinimalPerf.default 144 157 0.92:1

@fabricteam
Copy link
Collaborator

fabricteam commented Feb 17, 2023

Perf Analysis (@fluentui/react-components)

Scenario Render type Master Ticks PR Ticks Iterations Status
Avatar mount 899 702 5000 Possible regression
Button mount 581 388 5000 Possible regression
Field mount 1519 1257 5000 Possible regression
FluentProvider mount 1086 773 5000 Possible regression
FluentProviderWithTheme mount 289 112 10 Possible regression
FluentProviderWithTheme virtual-rerender 271 82 10 Possible regression
FluentProviderWithTheme virtual-rerender-with-unmount 277 100 10 Possible regression
InfoButton mount 205 13 5000 Possible regression
MakeStyles mount 1406 1176 50000 Possible regression
Persona mount 2131 1811 5000 Possible regression
SpinButton mount 1814 1482 5000 Possible regression
All results

Scenario Render type Master Ticks PR Ticks Iterations Status
Avatar mount 899 702 5000 Possible regression
Button mount 581 388 5000 Possible regression
Field mount 1519 1257 5000 Possible regression
FluentProvider mount 1086 773 5000 Possible regression
FluentProviderWithTheme mount 289 112 10 Possible regression
FluentProviderWithTheme virtual-rerender 271 82 10 Possible regression
FluentProviderWithTheme virtual-rerender-with-unmount 277 100 10 Possible regression
InfoButton mount 205 13 5000 Possible regression
MakeStyles mount 1406 1176 50000 Possible regression
Persona mount 2131 1811 5000 Possible regression
SpinButton mount 1814 1482 5000 Possible regression

@fabricteam
Copy link
Collaborator

fabricteam commented Feb 17, 2023

Perf Analysis (@fluentui/react)

Scenario Render type Master Ticks PR Ticks Iterations Status
BaseButton mount 981 793 5000 Possible regression
Breadcrumb mount 2378 2283 1000 Possible regression
Checkbox mount 2241 2143 5000 Possible regression
CheckboxBase mount 1994 1895 5000 Possible regression
ChoiceGroup mount 3862 3715 5000 Possible regression
ComboBox mount 1037 903 1000 Possible regression
CommandBar mount 8257 8014 1000 Possible regression
ContextualMenu mount 16026 17808 1000 Possible regression
DefaultButton mount 1148 987 5000 Possible regression
DetailsRow mount 3060 2884 5000 Possible regression
DetailsRowFast mount 3048 2919 5000 Possible regression
DetailsRowNoStyles mount 2826 2658 5000 Possible regression
Dialog mount 3329 3457 1000 Possible regression
DocumentCardTitle mount 441 317 1000 Possible regression
Dropdown mount 2719 2553 5000 Possible regression
FocusTrapZone mount 1648 1499 5000 Possible regression
FocusZone mount 1575 1429 5000 Possible regression
GroupedList mount 50132 57545 2 Possible regression
GroupedList virtual-rerender 24450 23932 2 Possible regression
GroupedList virtual-rerender-with-unmount 75170 74309 2 Possible regression
GroupedListV2 mount 445 314 2 Possible regression
GroupedListV2 virtual-rerender 427 289 2 Possible regression
GroupedListV2 virtual-rerender-with-unmount 443 311 2 Possible regression
IconButton mount 1618 1408 5000 Possible regression
Label mount 581 450 5000 Possible regression
Layer mount 3757 3563 5000 Possible regression
Link mount 648 530 5000 Possible regression
MenuButton mount 1386 1215 5000 Possible regression
Nav mount 2706 2521 1000 Possible regression
OverflowSet mount 1120 1027 5000 Possible regression
Panel mount 2128 2253 1000 Possible regression
Persona mount 1090 984 1000 Possible regression
Pivot mount 1338 1163 1000 Possible regression
PrimaryButton mount 1256 1095 5000 Possible regression
Rating mount 5789 5749 5000 Possible regression
SearchBox mount 1272 1167 5000 Possible regression
Shimmer mount 2464 2363 5000 Possible regression
Slider mount 1797 1716 5000 Possible regression
SpinButton mount 3917 3681 5000 Possible regression
Spinner mount 639 526 5000 Possible regression
SplitButton mount 2668 2393 5000 Possible regression
Stack mount 660 537 5000 Possible regression
StackWithIntrinsicChildren mount 1284 1143 5000 Possible regression
StackWithTextChildren mount 3375 3226 5000 Possible regression
SwatchColorPicker mount 8320 8078 5000 Possible regression
TagPicker mount 2149 1944 5000 Possible regression
Text mount 630 498 5000 Possible regression
TextField mount 1329 1185 5000 Possible regression
ThemeProvider mount 1232 1133 5000 Possible regression
ThemeProvider virtual-rerender 888 782 5000 Possible regression
ThemeProvider virtual-rerender-with-unmount 1805 1736 5000 Possible regression
Toggle mount 899 799 5000 Possible regression
buttonNative mount 413 290 5000 Possible regression
All results

Scenario Render type Master Ticks PR Ticks Iterations Status
BaseButton mount 981 793 5000 Possible regression
Breadcrumb mount 2378 2283 1000 Possible regression
Checkbox mount 2241 2143 5000 Possible regression
CheckboxBase mount 1994 1895 5000 Possible regression
ChoiceGroup mount 3862 3715 5000 Possible regression
ComboBox mount 1037 903 1000 Possible regression
CommandBar mount 8257 8014 1000 Possible regression
ContextualMenu mount 16026 17808 1000 Possible regression
DefaultButton mount 1148 987 5000 Possible regression
DetailsRow mount 3060 2884 5000 Possible regression
DetailsRowFast mount 3048 2919 5000 Possible regression
DetailsRowNoStyles mount 2826 2658 5000 Possible regression
Dialog mount 3329 3457 1000 Possible regression
DocumentCardTitle mount 441 317 1000 Possible regression
Dropdown mount 2719 2553 5000 Possible regression
FocusTrapZone mount 1648 1499 5000 Possible regression
FocusZone mount 1575 1429 5000 Possible regression
GroupedList mount 50132 57545 2 Possible regression
GroupedList virtual-rerender 24450 23932 2 Possible regression
GroupedList virtual-rerender-with-unmount 75170 74309 2 Possible regression
GroupedListV2 mount 445 314 2 Possible regression
GroupedListV2 virtual-rerender 427 289 2 Possible regression
GroupedListV2 virtual-rerender-with-unmount 443 311 2 Possible regression
IconButton mount 1618 1408 5000 Possible regression
Label mount 581 450 5000 Possible regression
Layer mount 3757 3563 5000 Possible regression
Link mount 648 530 5000 Possible regression
MenuButton mount 1386 1215 5000 Possible regression
MessageBar mount 27844 27697 5000
Nav mount 2706 2521 1000 Possible regression
OverflowSet mount 1120 1027 5000 Possible regression
Panel mount 2128 2253 1000 Possible regression
Persona mount 1090 984 1000 Possible regression
Pivot mount 1338 1163 1000 Possible regression
PrimaryButton mount 1256 1095 5000 Possible regression
Rating mount 5789 5749 5000 Possible regression
SearchBox mount 1272 1167 5000 Possible regression
Shimmer mount 2464 2363 5000 Possible regression
Slider mount 1797 1716 5000 Possible regression
SpinButton mount 3917 3681 5000 Possible regression
Spinner mount 639 526 5000 Possible regression
SplitButton mount 2668 2393 5000 Possible regression
Stack mount 660 537 5000 Possible regression
StackWithIntrinsicChildren mount 1284 1143 5000 Possible regression
StackWithTextChildren mount 3375 3226 5000 Possible regression
SwatchColorPicker mount 8320 8078 5000 Possible regression
TagPicker mount 2149 1944 5000 Possible regression
Text mount 630 498 5000 Possible regression
TextField mount 1329 1185 5000 Possible regression
ThemeProvider mount 1232 1133 5000 Possible regression
ThemeProvider virtual-rerender 888 782 5000 Possible regression
ThemeProvider virtual-rerender-with-unmount 1805 1736 5000 Possible regression
Toggle mount 899 799 5000 Possible regression
buttonNative mount 413 290 5000 Possible regression

@fabricteam
Copy link
Collaborator

fabricteam commented Feb 17, 2023

🕵 FluentUI-v0 No visual regressions between this PR and main

@Hotell Hotell force-pushed the hotell/build/ts/path-aliases-for-all-4 branch from ab98ca5 to a337107 Compare February 20, 2023 16:12
@Hotell Hotell changed the title perf: use path aliases and swc for test:perf tasks to drastically improve perf pipeline speeds perf: use path aliases and swc for test:perf tasks to drastically improve build speeds Feb 20, 2023
@Hotell Hotell changed the title perf: use path aliases and swc for test:perf tasks to drastically improve build speeds perf: use path aliases and swc for test:perf tasks to improve build speeds Feb 21, 2023
@Hotell Hotell force-pushed the hotell/build/ts/path-aliases-for-all-4 branch from a337107 to 8e438d1 Compare February 22, 2023 14:25
@Hotell Hotell force-pushed the hotell/build/ts/path-aliases-for-all-4 branch from 8e438d1 to 747b572 Compare April 3, 2023 09:41
@Hotell Hotell force-pushed the hotell/build/ts/path-aliases-for-all-4 branch 2 times, most recently from 02a9cc1 to 0e765ce Compare April 4, 2023 13:49
@Hotell Hotell force-pushed the hotell/build/ts/path-aliases-for-all-4 branch from 0e765ce to 30fbbbd Compare April 4, 2023 15:00
@Hotell Hotell marked this pull request as ready for review April 4, 2023 16:05
@Hotell Hotell merged commit edb5587 into microsoft:master Apr 5, 2023
@Hotell Hotell deleted the hotell/build/ts/path-aliases-for-all-4 branch April 5, 2023 11:29
@Hotell Hotell mentioned this pull request Apr 6, 2023
28 tasks
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

5 participants