Реагируйте с помощью хуков со списком объектов Избегайте гигантских повторных вычислений useMemo (разве это невозможно?) - PullRequest
Новая
       39

Реагируйте с помощью хуков со списком объектов Избегайте гигантских повторных вычислений useMemo (разве это невозможно?)

0 голосов
/ 07 августа 2020

Я использую response js для видеозвонка, и мне нужно обновить множество пользовательских объектов. Я использую мемо, чтобы ускорить процесс рендеринга, но с таким количеством представлений он все еще замедляется из-за частичных вычислений useMemos, даже с небольшими изменениями для одного пользователя 50+. Цикл рендеринга занимает 8 мс, тогда как один занимает 2 мс. Есть ли способ еще больше оптимизировать этот поток, потому что обновления происходят быстро? Я предполагаю, что это невозможно, но дайте мне знать, что вы думаете! 

// UserProvider.js
export default function UserProvider(props: React.PropsWithChildren<{}>) {
  // adding the event state info
  const [users, setUsers] = useState({} as any);
  
  const contextValue = {
    users,
    setUsers,
  };

  return (
    <StateContext.Provider value={{...contextValue}}>
      {props.children}
    </StateContext.Provider>
  );
}


export function useUserState() {
  const context = useContext(StateContext);
  if (!context) {
    throw new Error('useUserState must be used within the AppStateProvider');
  }
  return context;
}

Вот объекты пользователей, которые часто обновляются (видеозвонки с 50+ людьми). 

// 50+ Users Objects In Video Call.js
export default function Numerous User Component(userId = "") {
    const {users} = useUserState();
    const userInfo = users[userId]
    return useMemo(() => {
     return (
       <User userInfo={userInfo}  />
    );
   }, [userInfo])
}
...