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.

Sign up for GitHub

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

Jump to bottom

react-checkbox: Migration to new DX #19063

Merged
merged 3 commits into from
Jul 23, 2021
Merged

react-checkbox: Migration to new DX #19063

merged 3 commits into from
Jul 23, 2021

Conversation

tringakrasniqi
Copy link
Contributor

@tringakrasniqi tringakrasniqi commented Jul 22, 2021 •
edited
Loading

Pull request checklist

Description of changes

Migration to new DX

@tringakrasniqi tringakrasniqi requested review from khmakoto and a team as code owners July 22, 2021 08:50
@codesandbox-ci
Copy link

codesandbox-ci bot commented Jul 22, 2021 •
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 6e78aa4:

Sandbox Source
Fluent UI React Starter Configuration

@size-auditor
Copy link

size-auditor bot commented Jul 22, 2021 •
edited
Loading

Asset size changes

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

Baseline commit: dfe396946e1703e532440c3c2e09840d3908fffd (build)

@fabricteam
Copy link
Collaborator

fabricteam commented Jul 22, 2021 •
edited
Loading

📊 Bundle size report

Unchanged fixtures
Package & Exports Size (minified/GZIP)
react-accordion
Accordion (including children components)		 78.492 kB
23.211 kB
react-avatar
Avatar		 54.242 kB
14.662 kB
react-badge
Badge		 24.343 kB
7.165 kB
react-badge
CounterBadge		 27.156 kB
7.851 kB
react-badge
PresenseBadge		 237 B
177 B
react-button
Button		 24.934 kB
8.001 kB
react-button
CompoundButton		 30.226 kB
8.878 kB
react-button
MenuButton		 26.521 kB
8.509 kB
react-button
ToggleButton		 34.531 kB
8.637 kB
react-components
react-components: Accordion, Button, FluentProvider, Image, Menu, Popover		 196.889 kB
57.626 kB
react-components
react-components: FluentProvider & webLightTheme		 35.659 kB
11.467 kB
react-divider
Divider		 15.889 kB
5.747 kB
react-image
Image		 10.642 kB
4.264 kB
react-label
Label		 28.622 kB
10.654 kB
react-link
Link		 14.715 kB
6.012 kB
react-make-styles
makeStaticStyles (runtime)		 7.59 kB
3.321 kB
react-make-styles
makeStyles + mergeClasses (runtime)		 22.135 kB
8.356 kB
react-make-styles
makeStyles + mergeClasses (build time)		 2.557 kB
1.202 kB
react-menu
Menu (including children components)		 113.952 kB
34.39 kB
react-menu
Menu (including selectable components)		 115.964 kB
34.653 kB
react-popover
Popover		 140.938 kB
41.975 kB
react-portal
Portal		 7.78 kB
2.672 kB
react-positioning
usePopper		 23.155 kB
7.94 kB
react-provider
FluentProvider		 16.235 kB
5.972 kB
react-theme
Teams: all themes		 32.367 kB
6.546 kB
react-theme
Teams: Light theme		 19.673 kB
5.532 kB
react-tooltip
Tooltip		 45.279 kB
15.45 kB
react-utilities
SSRProvider		 213 B
170 B
🤖 This report was generated against dfe396946e1703e532440c3c2e09840d3908fffd

@fabricteam
Copy link
Collaborator

fabricteam commented Jul 22, 2021 •
edited
Loading

Perf Analysis (@fluentui/react)

No significant results to display.

All results

Scenario Render type Master Ticks PR Ticks Iterations Status
Avatar mount 829 834 5000
BaseButton mount 889 913 5000
Breadcrumb mount 2710 2685 1000
ButtonNext mount 444 458 5000
Checkbox mount 1518 1542 5000
CheckboxBase mount 1289 1327 5000
ChoiceGroup mount 4898 4816 5000
ComboBox mount 1001 992 1000
CommandBar mount 10316 10476 1000
ContextualMenu mount 6325 6286 1000
DefaultButton mount 1161 1157 5000
DetailsRow mount 3769 3717 5000
DetailsRowFast mount 3800 3722 5000
DetailsRowNoStyles mount 3616 3635 5000
Dialog mount 2146 2168 1000
DocumentCardTitle mount 152 132 1000
Dropdown mount 3336 3321 5000
FluentProviderNext mount 7499 7421 5000
FocusTrapZone mount 1815 1815 5000
FocusZone mount 1818 1820 5000
IconButton mount 1765 1756 5000
Label mount 356 340 5000
Layer mount 1824 1834 5000
Link mount 479 466 5000
MakeStyles mount 1900 1868 50000
MenuButton mount 1481 1486 5000
MessageBar mount 2052 2062 5000
Nav mount 3340 3282 1000
OverflowSet mount 1080 1066 5000
Panel mount 2135 2081 1000
Persona mount 820 863 1000
Pivot mount 1415 1444 1000
PrimaryButton mount 1330 1321 5000
Rating mount 7758 7766 5000
SearchBox mount 1328 1312 5000
Shimmer mount 2591 2589 5000
Slider mount 1981 1988 5000
SpinButton mount 5058 4998 5000
Spinner mount 426 422 5000
SplitButton mount 3208 3215 5000
Stack mount 523 501 5000
StackWithIntrinsicChildren mount 1536 1606 5000
StackWithTextChildren mount 4544 4579 5000
SwatchColorPicker mount 10377 10422 5000
Tabs mount 1458 1422 1000
TagPicker mount 2532 2461 5000
TeachingBubble mount 12118 12050 5000
Text mount 431 411 5000
TextField mount 1373 1422 5000
ThemeProvider mount 1207 1180 5000
ThemeProvider virtual-rerender 611 619 5000
Toggle mount 819 829 5000
buttonNative mount 122 113 5000

Perf Analysis (@fluentui/react-northstar)

Perf tests with no regressions
Scenario Current PR Ticks Baseline Ticks Ratio
AccordionMinimalPerf.default 160 138 1.16:1
ChatDuplicateMessagesPerf.default 300 279 1.08:1
ButtonSlotsPerf.default 569 533 1.07:1
ListCommonPerf.default 649 614 1.06:1
ButtonMinimalPerf.default 182 173 1.05:1
CardMinimalPerf.default 570 542 1.05:1
DividerMinimalPerf.default 370 352 1.05:1
DropdownManyItemsPerf.default 720 683 1.05:1
FlexMinimalPerf.default 300 287 1.05:1
ListNestedPerf.default 569 544 1.05:1
SegmentMinimalPerf.default 354 338 1.05:1
IconMinimalPerf.default 631 599 1.05:1
EmbedMinimalPerf.default 4356 4183 1.04:1
TableMinimalPerf.default 405 391 1.04:1
GridMinimalPerf.default 343 333 1.03:1
TooltipMinimalPerf.default 1026 995 1.03:1
AttachmentMinimalPerf.default 159 156 1.02:1
AttachmentSlotsPerf.default 1093 1071 1.02:1
CarouselMinimalPerf.default 460 451 1.02:1
HeaderMinimalPerf.default 368 361 1.02:1
ItemLayoutMinimalPerf.default 1231 1212 1.02:1
ListWith60ListItems.default 653 642 1.02:1
RefMinimalPerf.default 245 240 1.02:1
TableManyItemsPerf.default 1942 1901 1.02:1
TextMinimalPerf.default 342 334 1.02:1
VideoMinimalPerf.default 648 635 1.02:1
AnimationMinimalPerf.default 418 412 1.01:1
CheckboxMinimalPerf.default 2795 2771 1.01:1
DropdownMinimalPerf.default 3162 3145 1.01:1
ListMinimalPerf.default 517 512 1.01:1
PortalMinimalPerf.default 177 176 1.01:1
ProviderMinimalPerf.default 985 978 1.01:1
SplitButtonMinimalPerf.default 3864 3815 1.01:1
TextAreaMinimalPerf.default 495 492 1.01:1
AvatarMinimalPerf.default 205 204 1:1
BoxMinimalPerf.default 353 352 1:1
ButtonOverridesMissPerf.default 1710 1717 1:1
DialogMinimalPerf.default 774 772 1:1
LabelMinimalPerf.default 386 387 1:1
LoaderMinimalPerf.default 703 702 1:1
MenuButtonMinimalPerf.default 1646 1645 1:1
ProviderMergeThemesPerf.default 1695 1703 1:1
SliderMinimalPerf.default 1593 1594 1:1
CustomToolbarPrototype.default 3896 3883 1:1
TreeMinimalPerf.default 813 813 1:1
AlertMinimalPerf.default 271 273 0.99:1
ChatMinimalPerf.default 662 670 0.99:1
ChatWithPopoverPerf.default 355 359 0.99:1
HeaderSlotsPerf.default 748 755 0.99:1
MenuMinimalPerf.default 854 860 0.99:1
StatusMinimalPerf.default 665 675 0.99:1
DatepickerMinimalPerf.default 5496 5611 0.98:1
InputMinimalPerf.default 1269 1289 0.98:1
RosterPerf.default 1160 1181 0.98:1
PopupMinimalPerf.default 588 601 0.98:1
RadioGroupMinimalPerf.default 445 454 0.98:1
ReactionMinimalPerf.default 372 380 0.98:1
FormMinimalPerf.default 397 409 0.97:1
ToolbarMinimalPerf.default 928 960 0.97:1
ImageMinimalPerf.default 367 384 0.96:1
LayoutMinimalPerf.default 367 382 0.96:1
SkeletonMinimalPerf.default 344 357 0.96:1
TreeWith60ListItems.default 164 176 0.93:1

tringakrasniqi
tringakrasniqi commented Jul 22, 2021
View reviewed changes
@tringakrasniqi tringakrasniqi requested a review from Hotell July 22, 2021 09:16
@tringakrasniqi tringakrasniqi mentioned this pull request Jul 22, 2021
Closed
32 tasks
@tringakrasniqi tringakrasniqi merged commit 17c38c1 into microsoft:master Jul 23, 2021
@tringakrasniqi tringakrasniqi deleted the dx-migration-checkbox branch July 23, 2021 10:06
PeterDraex pushed a commit to PeterDraex/fluentui that referenced this pull request Aug 6, 2021
@tringakrasniqi @PeterDraex
react-checkbox: Migration to new DX (microsoft#19063)
f5a916e 
* Merge to new DX

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

@Hotell Hotell Hotell approved these changes

@khmakoto khmakoto khmakoto approved these changes

Assignees

@ling1726 ling1726

Labels
Area: Build System Component: Checkbox Fluent UI react-components (v9)
Projects
None yet
Milestone
July Project Cycle Q3 2021
Development

Successfully merging this pull request may close these issues.
5 participants
@tringakrasniqi @fabricteam @Hotell @khmakoto @ling1726