Why does useSelector still trigger a re-render when the equality function always returns true

Viewed 125

A lot of unexpected behaviour I'm experiencing boils down to this bit of code:

const BoundView = (
  view: (viewModel: IViewModel) => JSX.Element,
  viewModelInstance: IViewModel,
  stateSelector: ((state: any) => any)
) => {
    const [viewModel] = useState<IViewModel>(viewModelInstance) // useRef makes no diff
    viewModel.dispatch = useDispatch()

    const stateIsSame = (_newState: any, _oldState: any): boolean => {
        viewModel.globalStateUpdated(_newState) // makes the view-model update its internal props
        return true
    }

    useSelector(stateSelector, stateIsSame)

    console.log('View is re-rendering. wtf...') // executes randomly
    
    return view(viewModel)
}

Question 1: Why does the view re-render sometimes?

Question 2: How do I get around it?

0 Answers
Related