La documentación de los componentes con estilo nos muestra la opción de fusionar varias funciones de flecha en una sola:

 // go from this const Button = styled.button` background-color: ${({ theme }) => theme.colors.blue}; padding: ${({ hasSpacing }) => hasSpacing ? '10px 20px' : null}; `; // to this const Button = styled.button(({ theme, hasPadding }) => css` background-color: ${theme.colors.blue}; padding: ${hasPadding ? '10px 20px' : null}; `);

Los he visto trabajar en diferentes proyectos, pero me preguntaba si hay alguna razón para elegir uno sobre el otro. Para mí, se siente como una preferencia, pero ¿también hay un impacto en el rendimiento, el tamaño del archivo, la cantidad de clases generadas o algo más?