动态样式与静态样式的样式组件/情感表现？

Question

我想知道下面两个代码块之间的性能是否存在差异，dynamicStyles内的所有样式与dynamicStyles内仅更改的样式之间是否存在差异。

是否存在性能差异？我知道在大多数用例中它可能可以忽略不计，但我会以为是这种情况而忽略了。

dynamicStyles变量内的所有样式：

const dynamicStyles = ({ theme }) => {
  const { myColors } = theme;
  return css`
    color: ${myColors.colorA};
    line-height: 1.5;
    margin-top: 1px;
    margin-bottom: 1px;
    flex-grow: 1;
    flex-shrink: 1;
    white-space: nowrap;
  `;
};

const StyledComponent = styled.span`
  ${dynamicStyles}
`;

仅dynamicStyles变量中的动态样式：

const dynamicStyles = ({ theme }) => {
  const { myColors } = theme;
  // Only dynamically changed styles inside the dynamicStyles variable
  return css`
    color: ${myColors.colorA};
  `;
};

const StyledComponent = styled.span`
    line-height: 1.5;
    margin-top: 1px;
    margin-bottom: 1px;
    flex-grow: 1;
    flex-shrink: 1;
    white-space: nowrap;
`;