fluentui
fluentui copied to clipboard
chore(scripts/*): replace just-scripts and npm script aliases with nx
pre-requirement:
- [x] https://github.com/microsoft/fluentui/pull/32370
Previous Behavior
New Behavior
💡 NOTE: this PR changes only projects within
scripts/*folder ( later on, this approach will be applied to all v9 projects )
just-scriptsconfigs and usage are removednpm.scriptsare removed- nx.json
- defines new
formattarget withcheckconfiguration which gives us two commands for formatting project codeformat( runs prettier CLI )format:check(runs prettier CLI in--checkmode)
- defines new
project.json- every project within scripts ads to "empty" target names which use configs specified within nx.json
"targets": {
"type-check": {},
"format": {}
}
Breaking Changes
yarn workspace <npm-script-name> wont do anything - use nx run or yarn start
Related Issue(s)
- Follows https://github.com/microsoft/fluentui/pull/32337
- Implements partially #30267
🕵 fluentui-web-components-v3 No visual regressions between this PR and main
Perf Analysis (@fluentui/react-components)
No significant results to display.
All results
| Scenario | Render type | Master Ticks | PR Ticks | Iterations | Status |
|---|---|---|---|---|---|
| Avatar | mount | 631 | 637 | 5000 | |
| Button | mount | 309 | 310 | 5000 | |
| Field | mount | 1206 | 1145 | 5000 | |
| FluentProvider | mount | 708 | 728 | 5000 | |
| FluentProviderWithTheme | mount | 92 | 88 | 10 | |
| FluentProviderWithTheme | virtual-rerender | 36 | 38 | 10 | |
| FluentProviderWithTheme | virtual-rerender-with-unmount | 81 | 82 | 10 | |
| MakeStyles | mount | 856 | 857 | 50000 | |
| Persona | mount | 1787 | 1745 | 5000 | |
| SpinButton | mount | 1439 | 1397 | 5000 | |
| SwatchPicker | mount | 1712 | 1705 | 5000 |
🕵 FluentUIV0 No visual regressions between this PR and main
📊 Bundle size report
✅ No changes found
Perf Analysis (@fluentui/react-northstar)
Perf tests with no regressions
| Scenario | Current PR Ticks | Baseline Ticks | Ratio |
|---|---|---|---|
| AttachmentMinimalPerf.default | 92 | 78 | 1.18:1 |
| ChatDuplicateMessagesPerf.default | 168 | 147 | 1.14:1 |
| RadioGroupMinimalPerf.default | 292 | 260 | 1.12:1 |
| RefMinimalPerf.default | 121 | 108 | 1.12:1 |
| FlexMinimalPerf.default | 162 | 147 | 1.1:1 |
| GridMinimalPerf.default | 204 | 187 | 1.09:1 |
| PortalMinimalPerf.default | 94 | 86 | 1.09:1 |
| ButtonSlotsPerf.default | 333 | 309 | 1.08:1 |
| TextMinimalPerf.default | 204 | 189 | 1.08:1 |
| ImageMinimalPerf.default | 233 | 218 | 1.07:1 |
| TextAreaMinimalPerf.default | 305 | 285 | 1.07:1 |
| BoxMinimalPerf.default | 205 | 193 | 1.06:1 |
| ChatWithPopoverPerf.default | 199 | 187 | 1.06:1 |
| DividerMinimalPerf.default | 216 | 204 | 1.06:1 |
| PopupMinimalPerf.default | 365 | 345 | 1.06:1 |
| StatusMinimalPerf.default | 414 | 392 | 1.06:1 |
| AccordionMinimalPerf.default | 89 | 85 | 1.05:1 |
| AnimationMinimalPerf.default | 312 | 300 | 1.04:1 |
| AttachmentSlotsPerf.default | 645 | 621 | 1.04:1 |
| DropdownManyItemsPerf.default | 403 | 392 | 1.03:1 |
| FormMinimalPerf.default | 224 | 218 | 1.03:1 |
| ItemLayoutMinimalPerf.default | 711 | 691 | 1.03:1 |
| ListNestedPerf.default | 327 | 319 | 1.03:1 |
| ProviderMergeThemesPerf.default | 650 | 633 | 1.03:1 |
| TableManyItemsPerf.default | 1153 | 1118 | 1.03:1 |
| TreeWith60ListItems.default | 90 | 87 | 1.03:1 |
| CheckboxMinimalPerf.default | 1163 | 1135 | 1.02:1 |
| DatepickerMinimalPerf.default | 3653 | 3593 | 1.02:1 |
| DropdownMinimalPerf.default | 1438 | 1409 | 1.02:1 |
| EmbedMinimalPerf.default | 1897 | 1864 | 1.02:1 |
| ListMinimalPerf.default | 315 | 310 | 1.02:1 |
| LoaderMinimalPerf.default | 195 | 191 | 1.02:1 |
| ProviderMinimalPerf.default | 206 | 201 | 1.02:1 |
| TableMinimalPerf.default | 235 | 231 | 1.02:1 |
| AlertMinimalPerf.default | 155 | 153 | 1.01:1 |
| ButtonOverridesMissPerf.default | 645 | 638 | 1.01:1 |
| CardMinimalPerf.default | 316 | 313 | 1.01:1 |
| HeaderSlotsPerf.default | 473 | 468 | 1.01:1 |
| InputMinimalPerf.default | 544 | 536 | 1.01:1 |
| ListWith60ListItems.default | 367 | 364 | 1.01:1 |
| MenuButtonMinimalPerf.default | 948 | 939 | 1.01:1 |
| SegmentMinimalPerf.default | 208 | 205 | 1.01:1 |
| ChatMinimalPerf.default | 452 | 451 | 1:1 |
| DialogMinimalPerf.default | 440 | 439 | 1:1 |
| ListCommonPerf.default | 390 | 389 | 1:1 |
| MenuMinimalPerf.default | 509 | 511 | 1:1 |
| IconMinimalPerf.default | 409 | 407 | 1:1 |
| CustomToolbarPrototype.default | 1449 | 1453 | 1:1 |
| TreeMinimalPerf.default | 487 | 485 | 1:1 |
| AvatarMinimalPerf.default | 107 | 108 | 0.99:1 |
| HeaderMinimalPerf.default | 210 | 213 | 0.99:1 |
| LayoutMinimalPerf.default | 203 | 205 | 0.99:1 |
| SliderMinimalPerf.default | 731 | 741 | 0.99:1 |
| ToolbarMinimalPerf.default | 551 | 559 | 0.99:1 |
| ButtonMinimalPerf.default | 86 | 88 | 0.98:1 |
| CarouselMinimalPerf.default | 269 | 275 | 0.98:1 |
| ReactionMinimalPerf.default | 217 | 221 | 0.98:1 |
| SplitButtonMinimalPerf.default | 2263 | 2313 | 0.98:1 |
| RosterPerf.default | 1483 | 1524 | 0.97:1 |
| TooltipMinimalPerf.default | 1258 | 1296 | 0.97:1 |
| LabelMinimalPerf.default | 212 | 223 | 0.95:1 |
| SkeletonMinimalPerf.default | 200 | 211 | 0.95:1 |
| VideoMinimalPerf.default | 438 | 468 | 0.94:1 |
Perf Analysis (@fluentui/react)
No significant results to display.
All results
| Scenario | Render type | Master Ticks | PR Ticks | Iterations | Status |
|---|---|---|---|---|---|
| BaseButton | mount | 644 | 623 | 5000 | |
| Breadcrumb | mount | 1687 | 1701 | 1000 | |
| Checkbox | mount | 1715 | 1748 | 5000 | |
| CheckboxBase | mount | 1498 | 1508 | 5000 | |
| ChoiceGroup | mount | 3004 | 2963 | 5000 | |
| ComboBox | mount | 707 | 686 | 1000 | |
| CommandBar | mount | 6809 | 6712 | 1000 | |
| ContextualMenu | mount | 14819 | 14492 | 1000 | |
| DefaultButton | mount | 803 | 808 | 5000 | |
| DetailsRow | mount | 2234 | 2264 | 5000 | |
| DetailsRowFast | mount | 2351 | 2296 | 5000 | |
| DetailsRowNoStyles | mount | 2087 | 2135 | 5000 | |
| Dialog | mount | 2749 | 2731 | 1000 | |
| DocumentCardTitle | mount | 243 | 238 | 1000 | |
| Dropdown | mount | 2045 | 2044 | 5000 | |
| FocusTrapZone | mount | 1143 | 1185 | 5000 | |
| FocusZone | mount | 1096 | 1089 | 5000 | |
| GroupedList | mount | 43061 | 43085 | 2 | |
| GroupedList | virtual-rerender | 20600 | 20900 | 2 | |
| GroupedList | virtual-rerender-with-unmount | 52526 | 52625 | 2 | |
| GroupedListV2 | mount | 236 | 237 | 2 | |
| GroupedListV2 | virtual-rerender | 230 | 223 | 2 | |
| GroupedListV2 | virtual-rerender-with-unmount | 227 | 240 | 2 | |
| IconButton | mount | 1163 | 1168 | 5000 | |
| Label | mount | 347 | 349 | 5000 | |
| Layer | mount | 2771 | 2778 | 5000 | |
| Link | mount | 394 | 404 | 5000 | |
| MenuButton | mount | 985 | 1017 | 5000 | |
| MessageBar | mount | 21785 | 21698 | 5000 | |
| Nav | mount | 2101 | 2040 | 1000 | |
| OverflowSet | mount | 795 | 796 | 5000 | |
| Panel | mount | 1898 | 1881 | 1000 | |
| Persona | mount | 754 | 765 | 1000 | |
| Pivot | mount | 898 | 911 | 1000 | |
| PrimaryButton | mount | 950 | 945 | 5000 | |
| Rating | mount | 4682 | 4705 | 5000 | |
| SearchBox | mount | 920 | 953 | 5000 | |
| Shimmer | mount | 1964 | 1928 | 5000 | |
| Slider | mount | 1383 | 1364 | 5000 | |
| SpinButton | mount | 3027 | 3010 | 5000 | |
| Spinner | mount | 394 | 393 | 5000 | |
| SplitButton | mount | 1948 | 1932 | 5000 | |
| Stack | mount | 426 | 443 | 5000 | |
| StackWithIntrinsicChildren | mount | 898 | 910 | 5000 | |
| StackWithTextChildren | mount | 2822 | 2818 | 5000 | |
| SwatchColorPicker | mount | 6501 | 6528 | 5000 | |
| TagPicker | mount | 1476 | 1477 | 5000 | |
| Text | mount | 405 | 402 | 5000 | |
| TextField | mount | 955 | 956 | 5000 | |
| ThemeProvider | mount | 880 | 859 | 5000 | |
| ThemeProvider | virtual-rerender | 582 | 599 | 5000 | |
| ThemeProvider | virtual-rerender-with-unmount | 1337 | 1312 | 5000 | |
| Toggle | mount | 624 | 631 | 5000 | |
| buttonNative | mount | 198 | 203 | 5000 |