title: Redux Toolkit `useAppSelector` value causes render when it isn't updated
body: <h2>Background</h2>
  <p>The title may be confusing, but to explain, I am using slices with Redux Toolkit in order to manage state. These slices hold various state values for my map application. Specifically, two that I'm having issues with renders is a clicked position (called <code>focusedPosition</code> and the mouse coordinates, <code>mouseCoords</code>). Each of these slices hold a <code>lat</code> and <code>lng</code> value. Using <code>react-leaflet</code>, I have map events that update the <code>focusedPosition</code> whenever the user clicks the map in order to display a popup. I also have an event to capture the <code>mouseCoords</code> to display in the corner of the map. However, for some reason, any component that is subscribed to <code>focusedPosition</code> updates re-render on mouse movement -- even though it is not subscribed to <code>mouseCoords</code>. This causes multiple issues to include performance issues as well as map popups to flicker as they are constantly re-rendering whenever the mouse is moved.
  If I comment out the <code>mousemove</code> event in react-leaflet, the issue stops as that value is no longer updating, but that's not an option as I really need those mouse coordinates to be captured.</p>
  <p>How can I determine why these two values are being linked somehow and how can I fix this?</p>
  <p>Applicable code is below, and a <a href="https://codesandbox.io/s/redux-slices-so-42k3k" rel="nofollow noreferrer">Code Sandbox</a></p>
  <h5>store.ts</h5>
  <pre><code>export const store = configureStore({
    reducer: {
      focusedPosition: focusedPositionReducer,
      mouseCoords: mouseCoordsReducer,
    }
  })
  // Export AppDispatch
  // Export RootState
  // Export AppThunk
  </code></pre>
  <h5>focusedPositionSlice.tsx</h5>
  <pre><code>interface FocusedPositionState {
    lat: number | null
    lng: number | null
  }
  const initialState: FocusedPositionState = {
    lat: null,
    lng: null,
  }
  export const focusedPositionSlice = createSlice({
    name: 'focusedPosition',
    initialState,
    reducers: {
      clearFocusedPosition: state =&gt; {
        state.lat = null
        state.lng = null
      },
      setFocusedPosition: (state, action: PayloadAction&lt;FocusedPositionState&gt;) =&gt; {
        state.lat = action.payload.lat
        state.lng = action.payload.lng
      }
    }
  })
  // Export actions
  // Export getFocusedPosition selector
  // Export default reducer
  </code></pre>
  <h5>mouseCoordsSlice.tsx</h5>
  <pre><code>interface MouseCoordsState {
    lat: number
    lng: number
  }
  const initialState: MouseCoordsState = {
    lat: 0,
    lng: 0,
  }
  export const mouseCoordsSlice = createSlice({
    name: 'mouseCoords',
    initialState,
    reducers: {
      setMouseCoords: (state, action: PayloadAction&lt;MouseCoordsState&gt;) =&gt; {
        state.lat = action.payload.lat
        state.lng = action.payload.lng
      }
    }
  })
  // Export actions
  // Export getMouseCoords selector
  // Export default reducer
  </code></pre>