while investigating a performance issue I found out that when destructuring props inside a component I am actually triggering a rerender. This does not happen if I am using props.propName or if I am destructuring the props object directly into the component paramenters:

// Rerendering
const StatefulLayout = (props) => {
  const {isLoading, requestFn, initializationArray} = props
  useEffect(() => {
    requestFn(initializationArray);
  }, [initializationArray]);

  if (isLoading) {
    return <PageLoading />;
  }

  return (
    <Layout>
      <React.Fragment>{children}</React.Fragment>
    </Layout>
  );

// Not rerendering
const StatefulLayout = ({
  isLoading,
  requestFn,
  initializationArray
}) => {
  useEffect(() => {
    requestFn(initializationArray);
  }, [initializationArray]);

  if (isLoading) {
    return <PageLoading />;
  }

  return (
    <Layout>
      <React.Fragment>{children}</React.Fragment>
    </Layout>
  );

What this happens? What would be the correct pattern?