docs: add Fluent UI Insights EP05 to README #27445
Merged
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
|
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 5acc4c3:
|
Asset size changesSize Auditor did not detect a change in bundle size for any component! Baseline commit: ef38eed066906073d7b6e50b1d50afab1c62b3a5 (build) |
fabricteam
reviewed
Apr 5, 2023
Perf Analysis (
|
| Scenario | Render type | Master Ticks | PR Ticks | Iterations | Status |
|---|---|---|---|---|---|
| Avatar | mount | 892 | 897 | 5000 | |
| Button | mount | 592 | 600 | 5000 | |
| Field | mount | 1507 | 1524 | 5000 | |
| FluentProvider | mount | 1085 | 1067 | 5000 | |
| FluentProviderWithTheme | mount | 293 | 290 | 10 | |
| FluentProviderWithTheme | virtual-rerender | 270 | 281 | 10 | |
| FluentProviderWithTheme | virtual-rerender-with-unmount | 293 | 295 | 10 | |
| InfoButton | mount | 206 | 201 | 5000 | |
| MakeStyles | mount | 1396 | 1364 | 50000 | |
| Persona | mount | 2096 | 2074 | 5000 | |
| SpinButton | mount | 1799 | 1822 | 5000 |
|
| Package & Exports | Size (minified/GZIP) |
|---|---|
| global-context createContext |
533 B341 B |
| global-context createContextSelector |
560 B352 B |
| priority-overflow createOverflowManager |
3.194 kB1.314 kB |
| react-accordion Accordion (including children components) |
88.882 kB26.551 kB |
| react-alert Alert |
96.647 kB23.133 kB |
| react-avatar Avatar |
60.312 kB15.579 kB |
| react-avatar AvatarGroup |
18.178 kB6.683 kB |
| react-avatar AvatarGroupItem |
76.573 kB20.086 kB |
| react-badge Badge |
25.85 kB7.585 kB |
| react-badge CounterBadge |
26.833 kB7.889 kB |
| react-badge PresenceBadge |
34.458 kB8.693 kB |
| react-button Button |
39.749 kB9.959 kB |
| react-button CompoundButton |
46.921 kB11.428 kB |
| react-button MenuButton |
44.437 kB11.306 kB |
| react-button SplitButton |
52.931 kB12.872 kB |
| react-button ToggleButton |
58.121 kB11.878 kB |
| react-card Card - All |
83.489 kB23.894 kB |
| react-card Card |
78.308 kB22.431 kB |
| react-card CardFooter |
9.035 kB3.799 kB |
| react-card CardHeader |
10.959 kB4.503 kB |
| react-card CardPreview |
9.84 kB4.153 kB |
| react-checkbox Checkbox |
37.02 kB11.255 kB |
| react-combobox Combobox (including child components) |
89.718 kB28.49 kB |
| react-combobox Dropdown (including child components) |
88.402 kB28.217 kB |
| react-components react-components: Button, FluentProvider & webLightTheme |
67.994 kB18.395 kB |
| react-components react-components: Accordion, Button, FluentProvider, Image, Menu, Popover |
207.512 kB57.555 kB |
| react-components react-components: FluentProvider & webLightTheme |
38.819 kB12.351 kB |
| react-datepicker-compat DatePicker Compat |
251.272 kB67.329 kB |
| react-dialog Dialog (including children components) |
93.388 kB27.408 kB |
| react-divider Divider |
19.863 kB6.697 kB |
| react-field Field |
21.509 kB7.408 kB |
| react-image Image |
14.011 kB4.993 kB |
| react-infobutton InfoButton |
130.577 kB39.439 kB |
| react-infobutton InfoLabel |
133.874 kB40.488 kB |
| react-input Input |
26.707 kB8.113 kB |
| react-label Label |
12.57 kB4.586 kB |
| react-link Link |
12.301 kB5.07 kB |
| react-menu Menu (including children components) |
131.038 kB39.653 kB |
| react-menu Menu (including selectable components) |
134.174 kB40.187 kB |
| react-overflow hooks only |
11.214 kB4.271 kB |
| react-persona Persona |
67.338 kB17.524 kB |
| react-popover Popover |
117.58 kB35.828 kB |
| react-portal Portal |
11.649 kB4.263 kB |
| react-portal-compat PortalCompatProvider |
6.446 kB2.185 kB |
| react-positioning usePositioning |
24.008 kB8.798 kB |
| react-progress ProgressBar |
16.322 kB5.822 kB |
| react-provider FluentProvider |
20.766 kB7.119 kB |
| react-radio Radio |
35.48 kB11.126 kB |
| react-radio RadioGroup |
18.889 kB6.929 kB |
| react-select Select |
27.915 kB9.189 kB |
| react-slider Slider |
36.845 kB11.474 kB |
| react-spinbutton SpinButton |
36.598 kB10.752 kB |
| react-spinner Spinner |
23.425 kB7.195 kB |
| react-switch Switch |
32.438 kB9.706 kB |
| react-table DataGrid |
150.829 kB41.052 kB |
| react-table Table (Primitives only) |
47.119 kB12.703 kB |
| react-table Table as DataGrid |
138.971 kB35.722 kB |
| react-table Table (Selection only) |
86.8 kB21.742 kB |
| react-table Table (Sort only) |
86.13 kB21.549 kB |
| react-text Text - Default |
15.018 kB5.327 kB |
| react-text Text - Wrappers |
15.572 kB5.23 kB |
| react-textarea Textarea |
30.108 kB9.478 kB |
| react-theme Single theme token import |
69 B89 B |
| react-theme Teams: all themes |
31.33 kB6.764 kB |
| react-theme Teams: Light theme |
17.895 kB5.162 kB |
| react-tooltip Tooltip |
49.388 kB16.815 kB |
| react-utilities SSRProvider |
180 B159 B |
Perf Analysis (
|
| Scenario | Current PR Ticks | Baseline Ticks | Ratio | Regression Analysis |
|---|---|---|---|---|
| ButtonMinimalPerf.default | 103 | 110 | 0.94:1 | analysis |
Perf tests with no regressions
| Scenario | Current PR Ticks | Baseline Ticks | Ratio |
|---|---|---|---|
| AvatarMinimalPerf.default | 154 | 138 | 1.12:1 |
| ListNestedPerf.default | 413 | 377 | 1.1:1 |
| AccordionMinimalPerf.default | 110 | 101 | 1.09:1 |
| ImageMinimalPerf.default | 299 | 282 | 1.06:1 |
| TreeWith60ListItems.default | 110 | 104 | 1.06:1 |
| DividerMinimalPerf.default | 279 | 266 | 1.05:1 |
| IconMinimalPerf.default | 500 | 476 | 1.05:1 |
| ChatWithPopoverPerf.default | 237 | 228 | 1.04:1 |
| HeaderMinimalPerf.default | 285 | 275 | 1.04:1 |
| PortalMinimalPerf.default | 117 | 113 | 1.04:1 |
| TextAreaMinimalPerf.default | 356 | 341 | 1.04:1 |
| VideoMinimalPerf.default | 555 | 532 | 1.04:1 |
| AttachmentSlotsPerf.default | 760 | 745 | 1.02:1 |
| CardMinimalPerf.default | 398 | 390 | 1.02:1 |
| DropdownMinimalPerf.default | 1730 | 1698 | 1.02:1 |
| FormMinimalPerf.default | 279 | 274 | 1.02:1 |
| HeaderSlotsPerf.default | 607 | 597 | 1.02:1 |
| RadioGroupMinimalPerf.default | 341 | 333 | 1.02:1 |
| AnimationMinimalPerf.default | 395 | 392 | 1.01:1 |
| ButtonOverridesMissPerf.default | 766 | 757 | 1.01:1 |
| ButtonSlotsPerf.default | 366 | 364 | 1.01:1 |
| CarouselMinimalPerf.default | 309 | 306 | 1.01:1 |
| CheckboxMinimalPerf.default | 1305 | 1290 | 1.01:1 |
| EmbedMinimalPerf.default | 1995 | 1980 | 1.01:1 |
| FlexMinimalPerf.default | 214 | 212 | 1.01:1 |
| GridMinimalPerf.default | 250 | 247 | 1.01:1 |
| InputMinimalPerf.default | 642 | 633 | 1.01:1 |
| LayoutMinimalPerf.default | 273 | 271 | 1.01:1 |
| MenuButtonMinimalPerf.default | 1166 | 1156 | 1.01:1 |
| PopupMinimalPerf.default | 469 | 463 | 1.01:1 |
| ProviderMinimalPerf.default | 254 | 252 | 1.01:1 |
| RefMinimalPerf.default | 151 | 150 | 1.01:1 |
| TooltipMinimalPerf.default | 1536 | 1522 | 1.01:1 |
| TreeMinimalPerf.default | 583 | 575 | 1.01:1 |
| DialogMinimalPerf.default | 578 | 580 | 1:1 |
| ItemLayoutMinimalPerf.default | 846 | 845 | 1:1 |
| ListCommonPerf.default | 485 | 487 | 1:1 |
| ListMinimalPerf.default | 384 | 385 | 1:1 |
| MenuMinimalPerf.default | 613 | 611 | 1:1 |
| RosterPerf.default | 1730 | 1732 | 1:1 |
| ProviderMergeThemesPerf.default | 745 | 744 | 1:1 |
| SegmentMinimalPerf.default | 266 | 267 | 1:1 |
| SliderMinimalPerf.default | 819 | 821 | 1:1 |
| SplitButtonMinimalPerf.default | 2641 | 2642 | 1:1 |
| StatusMinimalPerf.default | 528 | 527 | 1:1 |
| TextMinimalPerf.default | 260 | 260 | 1:1 |
| CustomToolbarPrototype.default | 1741 | 1739 | 1:1 |
| ChatDuplicateMessagesPerf.default | 191 | 193 | 0.99:1 |
| ChatMinimalPerf.default | 537 | 540 | 0.99:1 |
| DatepickerMinimalPerf.default | 4264 | 4324 | 0.99:1 |
| DropdownManyItemsPerf.default | 465 | 472 | 0.99:1 |
| LabelMinimalPerf.default | 282 | 286 | 0.99:1 |
| TableManyItemsPerf.default | 1365 | 1375 | 0.99:1 |
| TableMinimalPerf.default | 309 | 311 | 0.99:1 |
| AlertMinimalPerf.default | 195 | 199 | 0.98:1 |
| BoxMinimalPerf.default | 256 | 262 | 0.98:1 |
| LoaderMinimalPerf.default | 225 | 229 | 0.98:1 |
| ReactionMinimalPerf.default | 283 | 288 | 0.98:1 |
| AttachmentMinimalPerf.default | 99 | 102 | 0.97:1 |
| ListWith60ListItems.default | 449 | 462 | 0.97:1 |
| SkeletonMinimalPerf.default | 260 | 269 | 0.97:1 |
| ToolbarMinimalPerf.default | 649 | 671 | 0.97:1 |
|
|
Perf Analysis (
|
| Scenario | Render type | Master Ticks | PR Ticks | Iterations | Status |
|---|---|---|---|---|---|
| BaseButton | mount | 954 | 950 | 5000 | |
| Breadcrumb | mount | 2174 | 2213 | 1000 | |
| Checkbox | mount | 2175 | 2169 | 5000 | |
| CheckboxBase | mount | 1943 | 1952 | 5000 | |
| ChoiceGroup | mount | 3717 | 3681 | 5000 | |
| ComboBox | mount | 955 | 951 | 1000 | |
| CommandBar | mount | 7880 | 7926 | 1000 | |
| ContextualMenu | mount | 12888 | 13674 | 1000 | |
| DefaultButton | mount | 1075 | 1101 | 5000 | |
| DetailsRow | mount | 2797 | 2784 | 5000 | |
| DetailsRowFast | mount | 2802 | 2779 | 5000 | |
| DetailsRowNoStyles | mount | 2607 | 2607 | 5000 | |
| Dialog | mount | 3146 | 3134 | 1000 | |
| DocumentCardTitle | mount | 418 | 421 | 1000 | |
| Dropdown | mount | 2633 | 2641 | 5000 | |
| FocusTrapZone | mount | 1568 | 1562 | 5000 | |
| FocusZone | mount | 1542 | 1534 | 5000 | |
| GroupedList | mount | 45649 | 52786 | 2 | |
| GroupedList | virtual-rerender | 22475 | 22464 | 2 | |
| GroupedList | virtual-rerender-with-unmount | 63174 | 63238 | 2 | |
| GroupedListV2 | mount | 407 | 419 | 2 | |
| GroupedListV2 | virtual-rerender | 397 | 404 | 2 | |
| GroupedListV2 | virtual-rerender-with-unmount | 407 | 420 | 2 | |
| IconButton | mount | 1475 | 1478 | 5000 | |
| Label | mount | 578 | 552 | 5000 | |
| Layer | mount | 3490 | 3493 | 5000 | |
| Link | mount | 651 | 649 | 5000 | |
| MenuButton | mount | 1306 | 1302 | 5000 | |
| MessageBar | mount | 26544 | 25847 | 5000 | |
| Nav | mount | 2492 | 2490 | 1000 | |
| OverflowSet | mount | 1145 | 1154 | 5000 | |
| Panel | mount | 2052 | 2082 | 1000 | |
| Persona | mount | 1014 | 1057 | 1000 | |
| Pivot | mount | 1196 | 1205 | 1000 | |
| PrimaryButton | mount | 1190 | 1188 | 5000 | |
| Rating | mount | 5875 | 5899 | 5000 | |
| SearchBox | mount | 1230 | 1221 | 5000 | |
| Shimmer | mount | 2450 | 2384 | 5000 | |
| Slider | mount | 1750 | 1773 | 5000 | |
| SpinButton | mount | 3606 | 3537 | 5000 | |
| Spinner | mount | 638 | 636 | 5000 | |
| SplitButton | mount | 2389 | 2401 | 5000 | |
| Stack | mount | 661 | 664 | 5000 | |
| StackWithIntrinsicChildren | mount | 1207 | 1215 | 5000 | |
| StackWithTextChildren | mount | 3528 | 3549 | 5000 | |
| SwatchColorPicker | mount | 7603 | 7631 | 5000 | |
| TagPicker | mount | 1879 | 1866 | 5000 | |
| Text | mount | 606 | 622 | 5000 | |
| TextField | mount | 1267 | 1255 | 5000 | |
| ThemeProvider | mount | 1118 | 1118 | 5000 | |
| ThemeProvider | virtual-rerender | 913 | 913 | 5000 | |
| ThemeProvider | virtual-rerender-with-unmount | 1631 | 1653 | 5000 | |
| Toggle | mount | 890 | 890 | 5000 | |
| buttonNative | mount | 370 | 380 | 5000 |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
New Behavior
New episode is out🎉 This PR adds a preview and link to it.