[Perf] Avoid React.Children.count traversal for empty state early ret…

…urn (#15503)

change/@fluentui-react-internal-2020-10-13-16-47-27-keco-react-children-for-empty.json

@@ -0,0 +1,8 @@
+{
+ "type": "prerelease",
+ "comment": "Avoid React.Children traversal for early return cases",
+ "packageName": "@fluentui/react-internal",
+ "email": "KevinTCoughlin@users.noreply.github.com",
+ "dependentChangeType": "patch",
+ "date": "2020-10-13T23:47:26.980Z"
+}

change/@uifabric-react-cards-2020-10-13-16-47-27-keco-react-children-for-empty.json

@@ -0,0 +1,8 @@
+{
+ "type": "prerelease",
+ "comment": "Avoid React.Children traversal for early return cases",
+ "packageName": "@fluentui/react-cards",
+ "email": "KevinTCoughlin@users.noreply.github.com",
+ "dependentChangeType": "patch",
+ "date": "2020-10-13T23:47:14.293Z"
+}

packages/react-cards/src/components/Card/CardSection/CardSection.view.tsx

@@ -1,12 +1,12 @@
 /** @jsx withSlots */
-import * as React from 'react';
 import { withSlots, getSlots } from '@fluentui/foundation-legacy';
 import { Stack } from '@fluentui/react/lib/Stack';
 import { ICardSectionComponent, ICardSectionProps, ICardSectionSlots } from './CardSection.types';
 
 export const CardSectionView: ICardSectionComponent['view'] = props => {
  const { children, ...rest } = props;
- if (React.Children.count(children) < 1) {
+ // eslint-disable-next-line eqeqeq
+ if (children == null) {
  return null;
  }
 

packages/react-internal/src/components/Stack/StackItem/StackItem.tsx

@@ -6,7 +6,8 @@ import { StackItemStyles as styles } from './StackItem.styles';
 
 const StackItemView: IStackItemComponent['view'] = props => {
  const { children } = props;
- if (React.Children.count(children) < 1) {
+ // eslint-disable-next-line eqeqeq
+ if (children == null) {
  return null;
  }
 

packages/react-internal/src/components/Text/Text.view.tsx

@@ -1,11 +1,11 @@
 /** @jsx withSlots */
-import * as React from 'react';
 import { withSlots, getSlots } from '@fluentui/foundation-legacy';
 import { getNativeProps, htmlElementProperties } from '../../Utilities';
 import { ITextComponent, ITextProps, ITextSlots } from './Text.types';
 
 export const TextView: ITextComponent['view'] = props => {
- if (React.Children.count(props.children) === 0) {
+ // eslint-disable-next-line eqeqeq
+ if (props.children == null) {
  return null;
  }