Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix(react-tabster): Bump tabster to 8.2.0 #32963

Merged
merged 4 commits into from
Oct 3, 2024

Conversation

emmayjiang
Copy link
Contributor

@fabricteam
Copy link
Collaborator

fabricteam commented Oct 1, 2024

🕵 FluentUIV0 No visual regressions between this PR and main

@fabricteam
Copy link
Collaborator

fabricteam commented Oct 1, 2024

Perf Analysis (@fluentui/react-components)

Scenario Render type Master Ticks PR Ticks Iterations Status
FluentProviderWithTheme virtual-rerender 39 32 10 Possible regression
All results

Scenario Render type Master Ticks PR Ticks Iterations Status
Avatar mount 643 633 5000
Button mount 306 307 5000
Field mount 1129 1128 5000
FluentProvider mount 694 723 5000
FluentProviderWithTheme mount 88 87 10
FluentProviderWithTheme virtual-rerender 39 32 10 Possible regression
FluentProviderWithTheme virtual-rerender-with-unmount 75 74 10
MakeStyles mount 868 869 50000
Persona mount 1748 1724 5000
SpinButton mount 1437 1348 5000
SwatchPicker mount 1653 1660 5000

@fabricteam
Copy link
Collaborator

fabricteam commented Oct 1, 2024

Perf Analysis (@fluentui/react-northstar)

Perf tests with no regressions
Scenario Current PR Ticks Baseline Ticks Ratio
AttachmentMinimalPerf.default 93 79 1.18:1
IconMinimalPerf.default 429 369 1.16:1
ImageMinimalPerf.default 255 233 1.09:1
TableMinimalPerf.default 260 239 1.09:1
AvatarMinimalPerf.default 117 108 1.08:1
LayoutMinimalPerf.default 217 201 1.08:1
ListNestedPerf.default 347 320 1.08:1
AccordionMinimalPerf.default 95 89 1.07:1
ChatWithPopoverPerf.default 204 191 1.07:1
PortalMinimalPerf.default 92 86 1.07:1
TooltipMinimalPerf.default 1352 1280 1.06:1
HeaderMinimalPerf.default 214 204 1.05:1
TextMinimalPerf.default 218 207 1.05:1
BoxMinimalPerf.default 200 192 1.04:1
DividerMinimalPerf.default 211 202 1.04:1
ProviderMinimalPerf.default 203 195 1.04:1
SkeletonMinimalPerf.default 213 204 1.04:1
TableManyItemsPerf.default 1150 1108 1.04:1
ChatMinimalPerf.default 458 443 1.03:1
EmbedMinimalPerf.default 1913 1864 1.03:1
InputMinimalPerf.default 545 530 1.03:1
ListMinimalPerf.default 316 306 1.03:1
MenuButtonMinimalPerf.default 974 948 1.03:1
VideoMinimalPerf.default 459 444 1.03:1
CardMinimalPerf.default 328 320 1.02:1
CarouselMinimalPerf.default 265 261 1.02:1
DatepickerMinimalPerf.default 3763 3692 1.02:1
LabelMinimalPerf.default 228 223 1.02:1
MenuMinimalPerf.default 516 504 1.02:1
PopupMinimalPerf.default 354 348 1.02:1
ProviderMergeThemesPerf.default 652 642 1.02:1
CustomToolbarPrototype.default 1525 1501 1.02:1
AnimationMinimalPerf.default 306 303 1.01:1
CheckboxMinimalPerf.default 1165 1150 1.01:1
DropdownManyItemsPerf.default 404 399 1.01:1
DropdownMinimalPerf.default 1442 1431 1.01:1
FlexMinimalPerf.default 163 162 1.01:1
LoaderMinimalPerf.default 199 197 1.01:1
ToolbarMinimalPerf.default 555 552 1.01:1
ButtonOverridesMissPerf.default 650 647 1:1
ItemLayoutMinimalPerf.default 713 714 1:1
ListWith60ListItems.default 383 383 1:1
RosterPerf.default 1571 1576 1:1
RadioGroupMinimalPerf.default 265 265 1:1
ReactionMinimalPerf.default 213 213 1:1
RefMinimalPerf.default 109 109 1:1
SegmentMinimalPerf.default 195 195 1:1
SliderMinimalPerf.default 750 748 1:1
SplitButtonMinimalPerf.default 2268 2258 1:1
ButtonSlotsPerf.default 316 320 0.99:1
DialogMinimalPerf.default 443 447 0.99:1
FormMinimalPerf.default 224 226 0.99:1
ListCommonPerf.default 413 417 0.99:1
StatusMinimalPerf.default 398 404 0.99:1
TreeMinimalPerf.default 487 494 0.99:1
TreeWith60ListItems.default 90 92 0.98:1
AlertMinimalPerf.default 165 170 0.97:1
ButtonMinimalPerf.default 87 90 0.97:1
GridMinimalPerf.default 187 192 0.97:1
HeaderSlotsPerf.default 459 474 0.97:1
AttachmentSlotsPerf.default 646 672 0.96:1
ChatDuplicateMessagesPerf.default 156 162 0.96:1
TextAreaMinimalPerf.default 295 308 0.96:1

@fabricteam
Copy link
Collaborator

fabricteam commented Oct 1, 2024

📊 Bundle size report

Package & Exports Baseline (minified/GZIP) PR Change
react-accordion
Accordion (including children components)
104.529 kB
32.097 kB
105.051 kB
32.257 kB
522 B
160 B
react-breadcrumb
@fluentui/react-breadcrumb - package
113.699 kB
31.498 kB
114.221 kB
31.654 kB
522 B
156 B
react-calendar-compat
Calendar Compat
149.573 kB
39.871 kB
150.095 kB
40.026 kB
522 B
155 B
react-card
Card - All
101.248 kB
28.626 kB
101.77 kB
28.772 kB
522 B
146 B
react-card
Card
94.022 kB
26.806 kB
94.544 kB
26.951 kB
522 B
145 B
react-components
react-components: Accordion, Button, FluentProvider, Image, Menu, Popover
218.317 kB
63.258 kB
218.842 kB
63.382 kB
525 B
124 B
react-components
react-components: entire library
1.1 MB
272.081 kB
1.101 MB
272.228 kB
569 B
147 B
react-datepicker-compat
DatePicker Compat
223.64 kB
63.299 kB
224.165 kB
63.423 kB
525 B
124 B
react-dialog
Dialog (including children components)
99.724 kB
29.912 kB
100.247 kB
30.042 kB
523 B
130 B
react-list-preview
List
88.626 kB
26.435 kB
89.148 kB
26.597 kB
522 B
162 B
react-list-preview
ListItem
112.168 kB
33.273 kB
112.69 kB
33.425 kB
522 B
152 B
react-menu
Menu (including children components)
152.025 kB
45.914 kB
152.534 kB
46.049 kB
509 B
135 B
react-menu
Menu (including selectable components)
154.706 kB
46.397 kB
155.215 kB
46.53 kB
509 B
133 B
react-popover
Popover
128.329 kB
40.143 kB
128.854 kB
40.286 kB
525 B
143 B
react-swatch-picker
@fluentui/react-swatch-picker - package
103.736 kB
30.073 kB
104.258 kB
30.231 kB
522 B
158 B
react-table
DataGrid
160.463 kB
45.537 kB
160.985 kB
45.678 kB
522 B
141 B
react-table
Table as DataGrid
131.317 kB
36.371 kB
131.837 kB
36.531 kB
520 B
160 B
react-tag-picker
@fluentui/react-tag-picker - package
183.584 kB
55.264 kB
184.106 kB
55.428 kB
522 B
164 B
react-tags
TagGroup
82.197 kB
24.362 kB
82.719 kB
24.524 kB
522 B
162 B
react-toast
Toast (including Toaster)
97.816 kB
29.438 kB
98.338 kB
29.591 kB
522 B
153 B
Unchanged fixtures
Package & Exports Size (minified/GZIP)
global-context
createContext
510 B
328 B
global-context
createContextSelector
537 B
339 B
keyboard-key
keyboard-key package
3.746 kB
1.928 kB
priority-overflow
createOverflowManager
4.457 kB
1.856 kB
react
ActivityItem
71.236 kB
23.357 kB
react
Announced
38.493 kB
13.297 kB
react
Autofill
15.428 kB
4.768 kB
react
Breadcrumb
202.234 kB
60.43 kB
react
Button
195.686 kB
56.66 kB
react
ButtonGrid
180.62 kB
54.643 kB
react
Calendar
121.776 kB
37.029 kB
react
Callout
84.33 kB
27.648 kB
react
Check
53.204 kB
17.848 kB
react
Checkbox
59.985 kB
19.903 kB
react
ChoiceGroup
65.494 kB
21.489 kB
react
ChoiceGroupOption
58.767 kB
19.362 kB
react
Coachmark
93.151 kB
29.428 kB
react
Color
7.789 kB
3.127 kB
react
ColorPicker
135.241 kB
42.223 kB
react
ComboBox
252.123 kB
72.332 kB
react
CommandBar
203.275 kB
60.174 kB
react
ContextualMenu
155.133 kB
48.198 kB
react
DatePicker
184.204 kB
56.175 kB
react
DateTimeUtilities
5.244 kB
1.849 kB
react
DetailsList
229.978 kB
65.921 kB
react
Dialog
211.541 kB
63.192 kB
react
Divider
19.603 kB
6.845 kB
react
DocumentCard
217.227 kB
64.472 kB
react
DragDrop
8.343 kB
2.724 kB
react
DraggableZone
34.305 kB
11.509 kB
react
Dropdown
234.173 kB
68.691 kB
react
ExtendedPicker
96.795 kB
27.893 kB
react
Fabric
41.745 kB
14.366 kB
react
Facepile
210.826 kB
63.211 kB
react
FloatingPicker
242.268 kB
69.042 kB
react
FocusTrapZone
17.03 kB
5.924 kB
react
FocusZone
55.053 kB
17.47 kB
react
Grid
180.62 kB
54.643 kB
react
GroupedList
135.049 kB
40.758 kB
react
GroupedListV2
122.638 kB
37.857 kB
react
HoverCard
97.179 kB
30.82 kB
react
Icon
51.885 kB
17.272 kB
react
Icons
66.361 kB
24.397 kB
react
Image
46.904 kB
15.707 kB
react
Keytip
81.693 kB
26.766 kB
react
KeytipData
14.028 kB
4.587 kB
react
KeytipLayer
103.478 kB
32.017 kB
react
Keytips
106.239 kB
33.023 kB
react
Label
38.347 kB
13.257 kB
react
Layer
48.099 kB
16.367 kB
react
Link
39.682 kB
13.67 kB
react
List
39.4 kB
12.481 kB
react
MarqueeSelection
74.541 kB
22.44 kB
react
MessageBar
190.75 kB
57.107 kB
react
Modal
93.676 kB
30.267 kB
react
Nav
188.226 kB
56.538 kB
react
OverflowSet
33.393 kB
11.329 kB
react
Overlay
40.902 kB
14.095 kB
react
Panel
201.284 kB
60.037 kB
react
Persona
114.849 kB
36.512 kB
react
PersonaCoin
114.849 kB
36.512 kB
react
PersonaPresence
58.074 kB
19.384 kB
react
Pickers
294.29 kB
82.458 kB
react
Pivot
189.118 kB
57.275 kB
react
Popup
12.294 kB
4.195 kB
react
Positioning
22.807 kB
7.701 kB
react
PositioningContainer
73.85 kB
23.765 kB
react
ProgressIndicator
39.504 kB
13.554 kB
react
Rating
82.014 kB
26.112 kB
react
Fluent UI React (entire library)
1.014 MB
282.115 kB
react
ResizeGroup
13.338 kB
4.377 kB
react
ResponsiveMode
8.13 kB
2.966 kB
react
ScrollablePane
55.563 kB
17.734 kB
react
SearchBox
188.999 kB
56.692 kB
react
SelectableOption
724 B
413 B
react
SelectedItemsList
232.778 kB
67.938 kB
react
Selection
42.464 kB
12.301 kB
react
Separator
35.384 kB
12.146 kB
react
Shimmer
49.259 kB
16.268 kB
react
ShimmeredDetailsList
240.76 kB
68.667 kB
react
Slider
57.651 kB
19.217 kB
react
SpinButton
192.702 kB
57.797 kB
react
Spinner
41.777 kB
14.478 kB
react
Stack
41.734 kB
14.268 kB
react
Sticky
32.613 kB
10.509 kB
react
Styling
46.033 kB
15.135 kB
react
SwatchColorPicker
190.945 kB
58.143 kB
react
TeachingBubble
206.001 kB
61.059 kB
react
Text
36.908 kB
12.822 kB
react
TextField
80.816 kB
25.332 kB
react
Theme
43.501 kB
14.183 kB
react
ThemeGenerator
12.392 kB
4.126 kB
react
TimePicker
241.905 kB
70.078 kB
react
Toggle
46.225 kB
15.986 kB
react
Tooltip
87.338 kB
28.223 kB
react
Utilities
82.813 kB
25.115 kB
react
Viewport
23.888 kB
7.656 kB
react
WeeklyDayPicker
101.929 kB
31.829 kB
react
WindowProvider
1.059 kB
541 B
react-avatar
Avatar
49.303 kB
15.815 kB
react-avatar
AvatarGroup
20.106 kB
7.968 kB
react-avatar
AvatarGroupItem
63.447 kB
20.034 kB
react-badge
Badge
25.954 kB
8.595 kB
react-badge
CounterBadge
26.733 kB
8.872 kB
react-badge
PresenceBadge
25.719 kB
9.457 kB
react-button
Button
37.104 kB
10.766 kB
react-button
CompoundButton
43.518 kB
12.068 kB
react-button
MenuButton
41.919 kB
12.108 kB
react-button
SplitButton
49.936 kB
13.681 kB
react-button
ToggleButton
53.037 kB
12.528 kB
react-card
CardFooter
14.355 kB
5.79 kB
react-card
CardHeader
16.888 kB
6.669 kB
react-card
CardPreview
14.42 kB
5.922 kB
react-checkbox
Checkbox
35.118 kB
12.077 kB
react-combobox
Combobox (including child components)
104.398 kB
34.199 kB
react-combobox
Dropdown (including child components)
105.011 kB
34.125 kB
react-components
react-components: Button, FluentProvider & webLightTheme
69.14 kB
20.137 kB
react-components
react-components: FluentProvider & webLightTheme
44.447 kB
14.59 kB
react-divider
Divider
21.328 kB
7.953 kB
react-field
Field
23.384 kB
8.891 kB
react-image
Image
15.36 kB
6.236 kB
react-input
Input
28.014 kB
9.444 kB
react-jsx-runtime
Classic Pragma
1.057 kB
530 B
react-jsx-runtime
JSX Dev Runtime
3.771 kB
1.643 kB
react-jsx-runtime
JSX Runtime
4.367 kB
1.874 kB
react-label
Label
14.671 kB
5.99 kB
react-link
Link
17.326 kB
7.032 kB
react-message-bar
MessageBar (all components)
24.85 kB
9.256 kB
react-motion
@fluentui/react-motion - createMotionComponent()
4.303 kB
1.899 kB
react-motion
@fluentui/react-motion - createPresenceComponent()
5.038 kB
2.229 kB
react-motion
@fluentui/react-motion - PresenceGroup
1.714 kB
819 B
react-northstar
Accordion
85.383 kB
26.519 kB
react-northstar
Alert
87.438 kB
26.904 kB
react-northstar
Animation
55.331 kB
17.83 kB
react-northstar
Attachment
86.832 kB
26.7 kB
react-northstar
Avatar
80.267 kB
24.633 kB
react-northstar
Box
75.236 kB
23.812 kB
react-northstar
Breadcrumb
79.911 kB
24.717 kB
react-northstar
Button
83.148 kB
25.952 kB
react-northstar
Card
82.696 kB
25.036 kB
react-northstar
Carousel
105.173 kB
31.872 kB
react-northstar
Chat
154.081 kB
46.876 kB
react-northstar
Checkbox
79.795 kB
25.08 kB
react-northstar
Datepicker
186.642 kB
56.99 kB
react-northstar
Debug
8.801 kB
3.594 kB
react-northstar
Design
36.589 kB
12.067 kB
react-northstar
Dialog
112.049 kB
33.622 kB
react-northstar
Divider
76.607 kB
24.135 kB
react-northstar
Dropdown
198.202 kB
60.222 kB
react-northstar
Embed
81.468 kB
25.424 kB
react-northstar
Flex
47.716 kB
15.443 kB
react-northstar
Form
92.518 kB
28.888 kB
react-northstar
Grid
70.572 kB
22.282 kB
react-northstar
Header
74.744 kB
23.465 kB
react-northstar
Image
73.579 kB
23.333 kB
react-northstar
Input
88.337 kB
27.78 kB
react-northstar
ItemLayout
78.219 kB
24.458 kB
react-northstar
Label
77.908 kB
24.413 kB
react-northstar
Layout
75.381 kB
23.803 kB
react-northstar
List
88.481 kB
27.556 kB
react-northstar
Loader
78.604 kB
24.733 kB
react-northstar
Menu
128.593 kB
40.737 kB
react-northstar
MenuButton
162.999 kB
49.613 kB
react-northstar
Pill
83.71 kB
26.069 kB
react-northstar
Popup
135.307 kB
42.257 kB
react-northstar
Portal
58.329 kB
18.851 kB
react-northstar
Provider
93.129 kB
29.627 kB
react-northstar
RadioGroup
83.273 kB
26.053 kB
react-northstar
Reaction
77.268 kB
24.127 kB
react-northstar
Segment
76.197 kB
23.896 kB
react-northstar
Skeleton
77.753 kB
24.205 kB
react-northstar
Slider
84.261 kB
26.755 kB
react-northstar
SplitButton
178.237 kB
53.438 kB
react-northstar
Status
76.26 kB
24.054 kB
react-northstar
SvgIcon
36.811 kB
11.746 kB
react-northstar
Table
80.787 kB
25.156 kB
react-northstar
Text
74.102 kB
23.511 kB
react-northstar
TextArea
74.236 kB
23.496 kB
react-northstar
Toolbar
175.048 kB
52.846 kB
react-northstar
Tooltip
109.964 kB
35.236 kB
react-northstar
Tree
87.843 kB
27.222 kB
react-northstar
Video
75.402 kB
23.797 kB
react-overflow
hooks only
12.808 kB
4.819 kB
react-persona
Persona
56.194 kB
17.695 kB
react-portal
Portal
14.563 kB
5.118 kB
react-portal-compat
PortalCompatProvider
8.39 kB
2.64 kB
react-positioning
usePositioning
27.057 kB
9.698 kB
react-progress
ProgressBar
17.084 kB
6.891 kB
react-provider
FluentProvider
24.623 kB
8.893 kB
react-radio
Radio
32.672 kB
10.343 kB
react-radio
RadioGroup
15.762 kB
6.423 kB
react-select
Select
27.732 kB
10.124 kB
react-slider
Slider
37.169 kB
12.538 kB
react-spinbutton
SpinButton
36.06 kB
11.815 kB
react-spinner
Spinner
25.245 kB
8.539 kB
react-switch
Switch
35.319 kB
11.314 kB
react-table
Table (Primitives only)
42.643 kB
13.82 kB
react-table
Table (Selection only)
70.504 kB
19.962 kB
react-table
Table (Sort only)
69.147 kB
19.574 kB
react-tags
InteractionTag
15.199 kB
6.157 kB
react-tags
Tag
29.016 kB
9.524 kB
react-text
Text - Default
17.061 kB
6.723 kB
react-text
Text - Wrappers
20.242 kB
7.048 kB
react-textarea
Textarea
26.572 kB
9.755 kB
react-theme
Single theme token import
69 B
89 B
react-theme
Teams: all themes
35.666 kB
7.453 kB
react-theme
Teams: Light theme
19.642 kB
5.549 kB
react-timepicker-compat
TimePicker
107.387 kB
35.758 kB
react-tooltip
Tooltip
55.517 kB
19.515 kB
react-utilities
SSRProvider
180 B
160 B
🤖 This report was generated against 5af931fcf73f7f6b5c758902f58e87137f3846bb

@fabricteam
Copy link
Collaborator

fabricteam commented Oct 1, 2024

Perf Analysis (@fluentui/react)

No significant results to display.

All results

Scenario Render type Master Ticks PR Ticks Iterations Status
BaseButton mount 640 632 5000
Breadcrumb mount 1691 1706 1000
Checkbox mount 1698 1701 5000
CheckboxBase mount 1494 1462 5000
ChoiceGroup mount 2923 2966 5000
ComboBox mount 665 698 1000
CommandBar mount 6600 6620 1000
ContextualMenu mount 13405 13449 1000
DefaultButton mount 793 783 5000
DetailsRow mount 2187 2237 5000
DetailsRowFast mount 2231 2219 5000
DetailsRowNoStyles mount 2034 2000 5000
Dialog mount 2721 2758 1000
DocumentCardTitle mount 222 236 1000
Dropdown mount 2015 1981 5000
FocusTrapZone mount 1167 1157 5000
FocusZone mount 1079 1104 5000
GroupedList mount 42166 42481 2
GroupedList virtual-rerender 20341 20205 2
GroupedList virtual-rerender-with-unmount 51997 51611 2
GroupedListV2 mount 237 230 2
GroupedListV2 virtual-rerender 208 219 2
GroupedListV2 virtual-rerender-with-unmount 241 230 2
IconButton mount 1102 1123 5000
Label mount 341 340 5000
Layer mount 2785 2777 5000
Link mount 399 400 5000
MenuButton mount 971 994 5000
MessageBar mount 21378 21472 5000
Nav mount 2026 2032 1000
OverflowSet mount 791 774 5000
Panel mount 1856 1893 1000
Persona mount 772 743 1000
Pivot mount 905 885 1000
PrimaryButton mount 936 927 5000
Rating mount 4603 4717 5000
SearchBox mount 912 915 5000
Shimmer mount 1896 1924 5000
Slider mount 1346 1367 5000
SpinButton mount 2936 3024 5000
Spinner mount 400 391 5000
SplitButton mount 1888 1905 5000
Stack mount 424 424 5000
StackWithIntrinsicChildren mount 836 874 5000
StackWithTextChildren mount 2802 2745 5000
SwatchColorPicker mount 6416 6391 5000
TagPicker mount 1497 1479 5000
Text mount 409 395 5000
TextField mount 949 945 5000
ThemeProvider mount 884 874 5000
ThemeProvider virtual-rerender 596 603 5000
ThemeProvider virtual-rerender-with-unmount 1273 1323 5000
Toggle mount 617 606 5000
buttonNative mount 192 191 5000

@emmayjiang emmayjiang marked this pull request as ready for review October 1, 2024 21:57
@emmayjiang emmayjiang requested review from a team as code owners October 1, 2024 21:57
@emmayjiang
Copy link
Contributor Author

/azp run

Copy link

Azure Pipelines successfully started running 4 pipeline(s).

@emmayjiang
Copy link
Contributor Author

/azp run Fluent UI React - PR and CI

Copy link

Azure Pipelines successfully started running 1 pipeline(s).

@Hotell Hotell self-requested a review October 2, 2024 12:05
@emmayjiang emmayjiang merged commit dd7d8bd into microsoft:master Oct 3, 2024
23 checks passed
@emmayjiang emmayjiang deleted the bump-tabster-version branch October 3, 2024 16:33
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

5 participants