Skip to content

feat(v9): migrate accordion, combobox, divider to ship rolluped only dts#23061

Merged
TristanWatanabe merged 5 commits intomicrosoft:masterfrom
TristanWatanabe:accordion-divider-combobox-rollup-dts
May 18, 2022
Merged

feat(v9): migrate accordion, combobox, divider to ship rolluped only dts#23061
TristanWatanabe merged 5 commits intomicrosoft:masterfrom
TristanWatanabe:accordion-divider-combobox-rollup-dts

Conversation

@TristanWatanabe
Copy link
Member

@TristanWatanabe TristanWatanabe commented May 18, 2022

Applied yarn nx workspace-generator migrate-converged-pkg to ship only rolluped type definitions for:

  • react-accordion
  • react-combobox
  • react-divider

Related Issue(s)

Fixes partially #22429

@TristanWatanabe TristanWatanabe self-assigned this May 18, 2022
@TristanWatanabe TristanWatanabe requested review from a team and smhigley as code owners May 18, 2022 15:04
@TristanWatanabe TristanWatanabe mentioned this pull request May 18, 2022
Closed
50 tasks
@codesandbox-ci
Copy link

codesandbox-ci bot commented May 18, 2022 •
edited
Loading

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 3e38daa:

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

@size-auditor
Copy link

size-auditor bot commented May 18, 2022 •
edited
Loading

Asset size changes

Size Auditor did not detect a change in bundle size for any component!

Baseline commit: 4a76bb578efc3c288c8d6bb5a49ca2c7db5efb67 (build)

@fabricteam
Copy link
Collaborator

fabricteam commented May 18, 2022 •
edited
Loading

Perf Analysis (@fluentui/react-components)

No significant results to display.

All results

Scenario Render type Master Ticks PR Ticks Iterations Status
Avatar mount 909 933 5000
Button mount 577 574 5000
FluentProvider mount 1909 1940 5000
FluentProviderWithTheme mount 268 256 10
FluentProviderWithTheme virtual-rerender 227 241 10
FluentProviderWithTheme virtual-rerender-with-unmount 314 270 10
MakeStyles mount 1693 1708 50000

@fabricteam
Copy link
Collaborator

fabricteam commented May 18, 2022 •
edited
Loading

Perf Analysis (@fluentui/react-northstar)

Perf tests with no regressions
Scenario Current PR Ticks Baseline Ticks Ratio
AlertMinimalPerf.default 228 200 1.14:1
ButtonSlotsPerf.default 457 406 1.13:1
TextMinimalPerf.default 291 257 1.13:1
AttachmentSlotsPerf.default 886 802 1.1:1
LoaderMinimalPerf.default 588 535 1.1:1
TooltipMinimalPerf.default 956 875 1.09:1
AccordionMinimalPerf.default 125 116 1.08:1
ButtonMinimalPerf.default 137 127 1.08:1
ProviderMergeThemesPerf.default 1086 1002 1.08:1
AnimationMinimalPerf.default 458 428 1.07:1
AvatarMinimalPerf.default 176 165 1.07:1
DatepickerMinimalPerf.default 5517 5162 1.07:1
CarouselMinimalPerf.default 370 349 1.06:1
DialogMinimalPerf.default 646 610 1.06:1
ChatDuplicateMessagesPerf.default 255 244 1.05:1
DropdownMinimalPerf.default 2486 2375 1.05:1
ListCommonPerf.default 543 515 1.05:1
RefMinimalPerf.default 207 197 1.05:1
FlexMinimalPerf.default 242 233 1.04:1
SkeletonMinimalPerf.default 290 278 1.04:1
InputMinimalPerf.default 1105 1076 1.03:1
MenuMinimalPerf.default 726 704 1.03:1
BoxMinimalPerf.default 290 283 1.02:1
ChatMinimalPerf.default 629 619 1.02:1
LayoutMinimalPerf.default 269 264 1.02:1
SliderMinimalPerf.default 1330 1309 1.02:1
TextAreaMinimalPerf.default 403 396 1.02:1
DropdownManyItemsPerf.default 564 561 1.01:1
HeaderMinimalPerf.default 305 301 1.01:1
ListMinimalPerf.default 433 427 1.01:1
ListNestedPerf.default 475 471 1.01:1
ProviderMinimalPerf.default 343 341 1.01:1
StatusMinimalPerf.default 579 571 1.01:1
IconMinimalPerf.default 531 526 1.01:1
CustomToolbarPrototype.default 2338 2307 1.01:1
HeaderSlotsPerf.default 604 604 1:1
PopupMinimalPerf.default 532 531 1:1
SplitButtonMinimalPerf.default 3575 3577 1:1
TableManyItemsPerf.default 1624 1622 1:1
CheckboxMinimalPerf.default 2135 2162 0.99:1
EmbedMinimalPerf.default 3383 3419 0.99:1
RosterPerf.default 908 915 0.99:1
TableMinimalPerf.default 324 328 0.99:1
ButtonOverridesMissPerf.default 1237 1265 0.98:1
CardMinimalPerf.default 458 466 0.98:1
DividerMinimalPerf.default 285 292 0.98:1
MenuButtonMinimalPerf.default 1384 1407 0.98:1
ToolbarMinimalPerf.default 796 815 0.98:1
ChatWithPopoverPerf.default 313 323 0.97:1
GridMinimalPerf.default 249 256 0.97:1
ItemLayoutMinimalPerf.default 992 1023 0.97:1
ReactionMinimalPerf.default 301 313 0.96:1
ListWith60ListItems.default 485 511 0.95:1
ImageMinimalPerf.default 303 323 0.94:1
TreeMinimalPerf.default 604 648 0.93:1
FormMinimalPerf.default 305 330 0.92:1
PortalMinimalPerf.default 144 157 0.92:1
SegmentMinimalPerf.default 254 277 0.92:1
RadioGroupMinimalPerf.default 348 382 0.91:1
AttachmentMinimalPerf.default 108 123 0.88:1
VideoMinimalPerf.default 502 570 0.88:1
TreeWith60ListItems.default 151 178 0.85:1
LabelMinimalPerf.default 322 957 0.34:1

@fabricteam
Copy link
Collaborator

fabricteam commented May 18, 2022 •
edited
Loading

📊 Bundle size report

Unchanged fixtures
Package & Exports Size (minified/GZIP)
priority-overflow
createOverflowManager		 2.936 kB
1.212 kB
react-accordion
Accordion (including children components)		 73.834 kB
22.533 kB
react-avatar
Avatar		 45.51 kB
13.25 kB
react-badge
Badge		 21.1 kB
6.671 kB
react-badge
CounterBadge		 22.015 kB
6.976 kB
react-badge
PresenceBadge		 22.346 kB
6.715 kB
react-button
Button		 32.591 kB
9.056 kB
react-button
CompoundButton		 38.836 kB
10.221 kB
react-button
MenuButton		 34.381 kB
9.645 kB
react-button
SplitButton		 41.662 kB
10.95 kB
react-button
ToggleButton		 43.518 kB
9.984 kB
react-card
Card - All		 59.102 kB
16.957 kB
react-card
Card		 54.387 kB
15.706 kB
react-card
CardFooter		 7.891 kB
3.363 kB
react-card
CardHeader		 9.463 kB
3.881 kB
react-card
CardPreview		 7.863 kB
3.391 kB
react-combobox
Combobox		 60.892 kB
20.813 kB
react-components
react-components: Accordion, Button, FluentProvider, Image, Menu, Popover		 179.74 kB
50.168 kB
react-components
react-components: FluentProvider & webLightTheme		 34.178 kB
11.138 kB
react-divider
Divider		 15.65 kB
5.636 kB
react-image
Image		 10.314 kB
4.06 kB
react-input
Input		 22.274 kB
7.336 kB
react-label
Label		 8.644 kB
3.614 kB
react-link
Link		 11.52 kB
4.69 kB
react-menu
Menu (including children components)		 110.335 kB
33.584 kB
react-menu
Menu (including selectable components)		 113.51 kB
34.053 kB
react-overflow
hooks only		 10.792 kB
4.124 kB
react-popover
Popover		 101.258 kB
30.847 kB
react-portal
Portal		 6.272 kB
2.17 kB
react-positioning
usePopper		 23.21 kB
8.084 kB
react-provider
FluentProvider		 14.227 kB
5.336 kB
react-radio
Radio		 29.568 kB
10.122 kB
react-radio
RadioGroup		 13.751 kB
5.515 kB
react-select
Select		 17.232 kB
6.408 kB
react-slider
Slider		 25.657 kB
8.302 kB
react-spinbutton
SpinButton		 41.965 kB
11.89 kB
react-spinner
Spinner		 17.895 kB
5.988 kB
react-switch
Switch		 25.539 kB
8.286 kB
react-text
Text - Default		 11.002 kB
4.336 kB
react-text
Text - Wrappers		 14.324 kB
4.749 kB
react-textarea
Textarea		 21.318 kB
7.211 kB
react-theme
Single theme token import		 69 B
89 B
react-theme
Teams: all themes		 31.363 kB
7.043 kB
react-theme
Teams: Light theme		 19.806 kB
5.699 kB
react-tooltip
Tooltip		 43.039 kB
14.819 kB
react-utilities
SSRProvider		 189 B
161 B
🤖 This report was generated against ebc04c35ea0005b50504e54812863b1aa4c332d7

@fabricteam
Copy link
Collaborator

fabricteam commented May 18, 2022 •
edited
Loading

Perf Analysis (@fluentui/react)

No significant results to display.

All results

Scenario Render type Master Ticks PR Ticks Iterations Status
BaseButton mount 780 788 5000
Breadcrumb mount 2408 2418 1000
Checkbox mount 1287 1274 5000
CheckboxBase mount 1095 1086 5000
ChoiceGroup mount 4054 4101 5000
ComboBox mount 857 869 1000
CommandBar mount 9194 9223 1000
ContextualMenu mount 10403 10351 1000
DefaultButton mount 984 1006 5000
DetailsRow mount 3301 3314 5000
DetailsRowFast mount 3350 3367 5000
DetailsRowNoStyles mount 3221 3163 5000
Dialog mount 1998 1993 1000
DocumentCardTitle mount 169 155 1000
Dropdown mount 2834 2879 5000
FocusTrapZone mount 1579 1595 5000
FocusZone mount 1560 1547 5000
IconButton mount 1530 1522 5000
Label mount 301 299 5000
Layer mount 2526 2527 5000
Link mount 393 409 5000
MenuButton mount 1288 1261 5000
MessageBar mount 1814 1896 5000
Nav mount 2856 2845 1000
OverflowSet mount 945 936 5000
Panel mount 1897 1929 1000
Persona mount 884 869 1000
Pivot mount 1252 1253 1000
PrimaryButton mount 1118 1123 5000
Rating mount 6643 6671 5000
SearchBox mount 1104 1142 5000
Shimmer mount 2174 2176 5000
Slider mount 1688 1683 5000
SpinButton mount 4352 4312 5000
Spinner mount 376 369 5000
SplitButton mount 3016 2762 5000
Stack mount 442 461 5000
StackWithIntrinsicChildren mount 1959 1927 5000
StackWithTextChildren mount 4485 4505 5000
SwatchColorPicker mount 10038 10080 5000
TagPicker mount 2363 2314 5000
TeachingBubble mount 88763 88751 5000
Text mount 363 371 5000
TextField mount 1206 1226 5000
ThemeProvider mount 1037 1034 5000
ThemeProvider virtual-rerender 556 556 5000
ThemeProvider virtual-rerender-with-unmount 1589 1630 5000
Toggle mount 685 689 5000
buttonNative mount 107 114 5000

@TristanWatanabe TristanWatanabe requested a review from a team as a code owner May 18, 2022 15:37
@TristanWatanabe TristanWatanabe force-pushed the accordion-divider-combobox-rollup-dts branch from 7786f78 to fc22ece Compare May 18, 2022 16:05
@TristanWatanabe TristanWatanabe removed the request for review from a team May 18, 2022 16:12
@TristanWatanabe TristanWatanabe merged commit a324d75 into microsoft:master May 18, 2022
@TristanWatanabe TristanWatanabe deleted the accordion-divider-combobox-rollup-dts branch May 18, 2022 18:59
marwan38 pushed a commit to marwan38/fluentui that referenced this pull request Jun 13, 2022
@TristanWatanabe @marwan38
feat(v9): migrate accordion, combobox, divider to ship rolluped only …
049a1fd 
…dts (microsoft#23061)

* migrate react-accordion

* migrate react-combobox

* migrate react-divider

* Change Files
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Reviewers

@layershifter layershifter layershifter approved these changes

@GeoffCoxMSFT GeoffCoxMSFT GeoffCoxMSFT approved these changes

@smhigley smhigley Awaiting requested review from smhigley

+1 more reviewer

@ling1726 ling1726 ling1726 approved these changes

Reviewers whose approvals may not affect merge requirements

Assignees

@TristanWatanabe TristanWatanabe

Labels

Area: Build System

Projects

None yet

Milestone

No milestone

Development

Successfully merging this pull request may close these issues.

5 participants

@TristanWatanabe @fabricteam @layershifter @ling1726 @GeoffCoxMSFT