How to prevent unnecessary deep tree re-renders in memoized components?

I've been diving deep into optimizing React reconciliation, specifically trying to prevent unnecessary re-renders in complex component trees. While React.memo and useCallback are fundamental, I'm hitting a wall with deeply nested props causing children to re-render even when their "logical" data hasn't changed.

My current setup involves a parent component passing down an object prop, which itself contains other objects or arrays. Even if I memoize the child component and use useMemo for the prop, a seemingly unrelated state update in the parent can create a new reference for this complex prop, bypassing React.memo's shallow comparison and triggering a costly re-render of the child and its subtree.

For example, if I have a component structure like this:

// ParentComponent.js
const ParentComponent = () => {
  const [count, setCount] = useState(0);
  const [data, setData] = useState({ items: [{ id: 1, value: 'A' }] });

  // Memoized prop, but 'data' reference changes if 'data' object is recreated
  const memoizedDataProp = useMemo(() => data, [data]);

  return (
    <div>
      <button onClick={() => setCount(count + 1)}>Increment Count</button>
      <MemoizedChild data={memoizedDataProp} />
    </div>
  );
};

// MemoizedChild.js
const MemoizedChild = React.memo(({ data }) => {
  console.log('MemoizedChild re-rendered'); // This logs even if data.items is logically same
  return <div>{data.items[0].value}</div>;
});

Clicking the 'Increment Count' button, which only updates count, still triggers the "MemoizedChild re-rendered" log if data itself is being recreated somewhere else in the parent's render cycle, even if its internal values are identical. What advanced strategies or custom comparison functions are effective for preventing these types of deep tree re-renders when dealing with complex, nested object props?