useEffect中有多个setState，如何避免重新渲染？

const [state, setState] = useState({ count: 0, name: '' });

useEffect(() => {
  setState(prevState => ({ ...prevState, count: 1, name: 'example' }));
}, []);

const initialState = { count: 0, name: '' };

function reducer(state, action) {
  switch (action.type) {
    case 'update':
      return { ...state, count: 1, name: 'example' };
    default:
      return state;
  }
}

const [state, dispatch] = useReducer(reducer, initialState);

useEffect(() => {
  dispatch({ type: 'update' });
}, []);

const [count, setCount] = useState(0);
const [name, setName] = useState('');

const memoizedSetCount = useCallback(() => {
  setCount(1);
}, []);

const memoizedSetName = useCallback(() => {
  setName('example');
}, []);

useEffect(() => {
  memoizedSetCount();
  memoizedSetName();
}, []);