hooks-pattern-memo-child.jsx

import React, { useMemo } from 'react';

const Section = ({ heading, children }) => {
	const headingChild = useMemo(() => <h1>{heading}</h1>, [heading]);

	return (
		<section>
			{headingChild}
			{children}
		</section>
	);
};

const PatternMemoChildren = () => <Section heading="Heading">Content.</Section>;

export default PatternMemoChildren;