결론만 말하자면, 이벤트 위임을 통해서 이벤트 리스너의 개수를 줄이려 하더라도 의미 없고, 성능 향상도 없다.
성능 향상을 목적으로 하는 Native JS 에서의 이벤트 위임(Event Delegation)
DOM 객체가 매우 많을 경우 이벤트 리스너를 각 객체마다 부착하게 되면 메모리 누수와 성능 저하가 문제가 된다.
따라서 이벤트 버블링을 응용하여 부모 엘리먼트에 리스너를 위임하여 부착하면, 리스너의 개수를 1개로 줄여 최적화할 수 있다.
리액트에서의 이벤트 위임
리액트에서는 자체 이벤트 시스템을 갖고 있어서, 이미 document 최상단에서 이벤트를 잡아 자체적으로 처리한다.(리액트 v16.0)
참고: 리액트 v17.0에서, 이벤트 리스너를 document에 붙이는 것이 아니라 리액트가 관리하기 시작하는 div에 붙이는 것으로 바뀌었다.
따라서 이벤트 위임을 통한 성능상의 이득은 없다고 봐도 무방하다. (이미 그렇게 되어 있으므로)
각 돔 노드에 빈 이벤트 리스너가 달려있기는 하지만, iOS 와 사파리 브라우저를 호환하기 위한 대비책이라고 한다. (실제로 확인해보니 동작하지 않는 no-op 함수가 똑같이 바인딩되어 있다)
Reference
Event delegation in React
