chore(react-examples): remove all remaining vNext package deps/storybook setup by Hotell · Pull Request #19456 · microsoft/fluentui

Hotell · 2021-08-19T18:54:48Z

Pull request checklist

Addresses an existing issue: Fixes migration(react-examples): remove react-make-styles from dependencies #18752
Include a change request file using $ yarn change

Description of changes

react-examples followup cleanup (chore(react-components): migrate to new dx stage-1 #19040)
(react-provider): fixes hidden issue with badly configured packages that use our babel-make styles plugin

Focus areas to test

(optional)

fabricteam · 2021-08-19T19:01:28Z

📊 Bundle size report

Unchanged fixtures

Package & Exports	Size (minified/GZIP)
`react-components` react-components: Accordion, Button, FluentProvider, Image, Menu, Popover	`177.666 kB` `50.281 kB`
`react-components` react-components: FluentProvider & webLightTheme	`36.288 kB` `11.615 kB`
`react-menu` Menu (including children components)	`115.15 kB` `34.665 kB`
`react-menu` Menu (including selectable components)	`117.88 kB` `35.217 kB`
`react-provider` FluentProvider	`16.286 kB` `5.991 kB`

_{🤖 This report was generated against f0f6345a7b4ddfc4f9092ff37fd713758771e2d2}

size-auditor · 2021-08-19T19:06:53Z

Asset size changes

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

Baseline commit: f0f6345a7b4ddfc4f9092ff37fd713758771e2d2 (build)

codesandbox-ci · 2021-08-19T19:10:03Z

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 81285f0:

Sandbox	Source
Fluent UI React Starter	Configuration

fabricteam · 2021-08-19T19:24:14Z

Perf Analysis (`@fluentui/react`)

No significant results to display.

All results

Scenario	Render type	Master Ticks	PR Ticks	Iterations
Avatar	mount	918	874	5000
BaseButton	mount	851	877	5000
Breadcrumb	mount	2554	2549	1000
ButtonNext	mount	407	393	5000
Checkbox	mount	1475	1468	5000
CheckboxBase	mount	1215	1277	5000
ChoiceGroup	mount	4616	4559	5000
ComboBox	mount	951	934	1000
CommandBar	mount	9892	9883	1000
ContextualMenu	mount	5897	6131	1000
DefaultButton	mount	1083	1077	5000
DetailsRow	mount	3604	3589	5000
DetailsRowFast	mount	3629	3657	5000
DetailsRowNoStyles	mount	3369	3437	5000
Dialog	mount	2107	2071	1000
DocumentCardTitle	mount	140	139	1000
Dropdown	mount	3132	3146	5000
FluentProviderNext	mount	7398	7379	5000
FocusTrapZone	mount	1737	1807	5000
FocusZone	mount	1788	1814	5000
IconButton	mount	1913	1729	5000
Label	mount	346	337	5000
Layer	mount	1780	1737	5000
Link	mount	468	467	5000
MakeStyles	mount	1853	1841	50000
MenuButton	mount	1444	1453	5000
MessageBar	mount	2007	2045	5000
Nav	mount	3255	3237	1000
OverflowSet	mount	1097	1101	5000
Panel	mount	2078	2095	1000
Persona	mount	817	834	1000
Pivot	mount	1420	1404	1000
PrimaryButton	mount	1267	1264	5000
Rating	mount	7551	7686	5000
SearchBox	mount	1265	1303	5000
Shimmer	mount	2505	2497	5000
Slider	mount	1892	1897	5000
SpinButton	mount	4826	4855	5000
Spinner	mount	431	407	5000
SplitButton	mount	3048	3030	5000
Stack	mount	474	473	5000
StackWithIntrinsicChildren	mount	1431	1457	5000
StackWithTextChildren	mount	4342	4359	5000
SwatchColorPicker	mount	9958	9803	5000
Tabs	mount	1344	1393	1000
TagPicker	mount	2472	2487	5000
TeachingBubble	mount	11519	11640	5000
Text	mount	418	430	5000
TextField	mount	1338	1415	5000
ThemeProvider	mount	1149	1141	5000
ThemeProvider	virtual-rerender	577	598	5000
Toggle	mount	777	793	5000
buttonNative	mount	111	101	5000

Perf Analysis (`@fluentui/react-northstar`)

Perf tests with no regressions

Scenario	Current PR Ticks	Baseline Ticks	Ratio
AnimationMinimalPerf.default	412	383	1.08:1
AttachmentMinimalPerf.default	149	139	1.07:1
RefMinimalPerf.default	231	216	1.07:1
AvatarMinimalPerf.default	197	185	1.06:1
FormMinimalPerf.default	388	367	1.06:1
ImageMinimalPerf.default	371	354	1.05:1
LabelMinimalPerf.default	371	354	1.05:1
PortalMinimalPerf.default	171	163	1.05:1
ReactionMinimalPerf.default	372	353	1.05:1
VideoMinimalPerf.default	612	585	1.05:1
DropdownMinimalPerf.default	3072	2942	1.04:1
AlertMinimalPerf.default	260	252	1.03:1
ItemLayoutMinimalPerf.default	1188	1157	1.03:1
TextMinimalPerf.default	335	326	1.03:1
ButtonSlotsPerf.default	534	522	1.02:1
CheckboxMinimalPerf.default	2689	2630	1.02:1
DividerMinimalPerf.default	347	341	1.02:1
DropdownManyItemsPerf.default	655	641	1.02:1
ListMinimalPerf.default	500	489	1.02:1
ListNestedPerf.default	523	515	1.02:1
ProviderMergeThemesPerf.default	1621	1592	1.02:1
AccordionMinimalPerf.default	147	146	1.01:1
CarouselMinimalPerf.default	441	436	1.01:1
ChatWithPopoverPerf.default	348	345	1.01:1
FlexMinimalPerf.default	279	276	1.01:1
MenuMinimalPerf.default	792	786	1.01:1
SkeletonMinimalPerf.default	342	339	1.01:1
SliderMinimalPerf.default	1495	1486	1.01:1
StatusMinimalPerf.default	650	645	1.01:1
TableManyItemsPerf.default	1831	1806	1.01:1
CardMinimalPerf.default	523	522	1:1
DatepickerMinimalPerf.default	5175	5182	1:1
EmbedMinimalPerf.default	3992	3987	1:1
HeaderMinimalPerf.default	342	341	1:1
LoaderMinimalPerf.default	673	673	1:1
MenuButtonMinimalPerf.default	1551	1549	1:1
SegmentMinimalPerf.default	334	333	1:1
TextAreaMinimalPerf.default	467	465	1:1
ButtonOverridesMissPerf.default	1613	1632	0.99:1
ChatDuplicateMessagesPerf.default	272	274	0.99:1
DialogMinimalPerf.default	711	716	0.99:1
HeaderSlotsPerf.default	726	732	0.99:1
RosterPerf.default	1167	1173	0.99:1
PopupMinimalPerf.default	575	581	0.99:1
RadioGroupMinimalPerf.default	423	429	0.99:1
SplitButtonMinimalPerf.default	3630	3660	0.99:1
TableMinimalPerf.default	380	383	0.99:1
CustomToolbarPrototype.default	3669	3701	0.99:1
ToolbarMinimalPerf.default	886	897	0.99:1
TooltipMinimalPerf.default	962	970	0.99:1
IconMinimalPerf.default	573	583	0.98:1
TreeMinimalPerf.default	765	784	0.98:1
AttachmentSlotsPerf.default	1013	1043	0.97:1
ButtonMinimalPerf.default	151	155	0.97:1
ChatMinimalPerf.default	606	623	0.97:1
InputMinimalPerf.default	1228	1262	0.97:1
ListCommonPerf.default	601	619	0.97:1
ProviderMinimalPerf.default	925	957	0.97:1
BoxMinimalPerf.default	327	341	0.96:1
GridMinimalPerf.default	318	338	0.94:1
ListWith60ListItems.default	589	631	0.93:1
LayoutMinimalPerf.default	344	381	0.9:1
TreeWith60ListItems.default	158	193	0.82:1

packages/react-examples/.storybook/preview.js

packages/react-examples/.storybook/manager.js

…mponents was migrated to new dx

…ency

msft-fluent-ui-bot added the Area: Website label Aug 19, 2021

msft-fluent-ui-bot assigned smhigley Aug 19, 2021

msft-fluent-ui-bot added the Area: Build System label Aug 19, 2021

Hotell force-pushed the hotell/build-system/18752 branch from c47baad to 2882d08 Compare August 19, 2021 19:59

Hotell changed the title ~~fix: remove all remaining vNext packages deps from react-examples~~ fix(react-examples): remove all remaining vNext package deps/logic from react-examples Aug 19, 2021

Hotell changed the title ~~fix(react-examples): remove all remaining vNext package deps/logic from react-examples~~ fix(react-examples): remove all remaining vNext package deps/storybook setup from react-examples Aug 19, 2021

Hotell changed the title ~~fix(react-examples): remove all remaining vNext package deps/storybook setup from react-examples~~ chore(react-examples): remove all remaining vNext package deps/storybook setup from react-examples Aug 19, 2021

Hotell mentioned this pull request Aug 19, 2021

chore(react-components): migrate to new dx stage-1 #19040

Merged

7 tasks

Hotell changed the title ~~chore(react-examples): remove all remaining vNext package deps/storybook setup from react-examples~~ chore(react-examples): remove all remaining vNext package deps/storybook setup Aug 19, 2021

Hotell marked this pull request as ready for review August 19, 2021 20:38

Hotell requested a review from a team as a code owner August 19, 2021 20:38

Hotell requested a review from a team August 19, 2021 20:40

ecraig12345 approved these changes Aug 19, 2021

View reviewed changes

packages/react-examples/.storybook/preview.js Outdated Show resolved Hide resolved

Hotell enabled auto-merge (squash) August 19, 2021 21:31

ecraig12345 reviewed Aug 20, 2021

View reviewed changes

packages/react-examples/.storybook/manager.js Show resolved Hide resolved

ecraig12345 disabled auto-merge August 20, 2021 01:29

layershifter approved these changes Aug 20, 2021

View reviewed changes

Hotell force-pushed the hotell/build-system/18752 branch from 0880d81 to 24181a4 Compare August 23, 2021 12:20

Hotell added 4 commits August 23, 2021 14:21

fix: remove all remaining vNext packages deps from react-examples

04dc758

fix(react-provider): properly specify babel-make-styles dependency

9269119

Change files

33d2d3a

chore(react-examples): get rid of unnecessary sb setup after react-co…

74a55d2

…mponents was migrated to new dx

Hotell force-pushed the hotell/build-system/18752 branch from 24181a4 to 74a55d2 Compare August 23, 2021 12:23

Hotell enabled auto-merge (squash) August 23, 2021 12:24

fixup! fix(react-provider): properly specify babel-make-styles depend…

81285f0

…ency

Hotell merged commit 5f6544c into microsoft:master Aug 23, 2021

Hotell deleted the hotell/build-system/18752 branch August 23, 2021 19:11

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

chore(react-examples): remove all remaining vNext package deps/storybook setup #19456

chore(react-examples): remove all remaining vNext package deps/storybook setup #19456
Hotell merged 5 commits intomicrosoft:masterfrom
Hotell:hotell/build-system/18752

Hotell commented Aug 19, 2021 •

edited

Loading

Uh oh!

fabricteam commented Aug 19, 2021 •

edited

Loading

Uh oh!

size-auditor bot commented Aug 19, 2021 •

edited

Loading

Uh oh!

codesandbox-ci bot commented Aug 19, 2021 •

edited

Loading

Uh oh!

fabricteam commented Aug 19, 2021 •

edited

Loading

Uh oh!

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

6 participants

Conversation

Hotell commented Aug 19, 2021 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Pull request checklist

Description of changes

Focus areas to test

Uh oh!

fabricteam commented Aug 19, 2021 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

📊 Bundle size report

Uh oh!

size-auditor bot commented Aug 19, 2021 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Asset size changes

Uh oh!

codesandbox-ci bot commented Aug 19, 2021 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

fabricteam commented Aug 19, 2021 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Perf Analysis (@fluentui/react)

Perf Analysis (@fluentui/react-northstar)

Uh oh!

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

6 participants

Hotell commented Aug 19, 2021 •

edited

Loading

fabricteam commented Aug 19, 2021 •

edited

Loading

size-auditor bot commented Aug 19, 2021 •

edited

Loading

codesandbox-ci bot commented Aug 19, 2021 •

edited

Loading

fabricteam commented Aug 19, 2021 •

edited

Loading

Perf Analysis (`@fluentui/react`)

Perf Analysis (`@fluentui/react-northstar`)