l componente funcional @Stateless es solo una función que recibeprops y devuelve el elemento React:

const Foo = props => <Bar />;

De esta manera<Foo {...props} /> (es decir,React.createElement(Foo, props)) en el componente padre podría omitirse a favor de llamar aFoo directamente,Foo(props), asi queReact.createElement se puede eliminar una pequeña sobrecarga, pero esto no es necesario.

¿Se considera una mala práctica llamar a los componentes funcionales directamente conprops argumento, y por qué? ¿Cuáles son las posibles implicaciones de hacer esto? ¿Puede esto afectar el rendimiento de manera negativa?

Mi caso específico es que hay algún componente que es un contenedor poco profundo sobre el elemento DOM porque esto fue considerado una buena idea por un tercero:

function ThirdPartyThemedInput({style, ...props}) {
  return <input style={{color: 'red', ...style}} {...props} />;
}

Aquí está unmanifestació que muestra este caso.

Esta es una práctica ampliamente aceptada, pero el problema es que es imposible obtenerref del elemento DOM envuelto de la función sin estado, por lo que el componente usaReact.forwardRef:

function withRef(SFC) {
  return React.forwardRef((props, ref) => SFC({ref, ...props}));
  // this won't work
  // React.forwardRef((props, ref) => <SFC ref={ref} {...props } />);
}

const ThemedInput = withRef(ThirdPartyThemedInput);

De esta manera se puede usar como:

<ThemedInput ref={inputRef} />
...
inputRef.current.focus();

La desventaja obvia que conozco es quewithRef requiere que un desarrollador esté al tanto de la implementación de componentes envueltos, lo cual no es un requisito habitual para los HOC.

Se considera un enfoque adecuado en una situación como la descrita anteriormente?