Estoy usando la devolución de llamada para memorizar parte del componente que usa el valor useSelector. Pero otra variable de estado está cambiando dentro del componente a medida que tomo la entrada, lo que está desencadenando otra representación de la compilación, por lo que se vuelve a llamar a useselector y vuelve a representar la parte donde he usado useCallback como valor de selector está allí como una dependencia. ¿Cómo puedo memorizar el valor de useSelector para que cualquier cambio de estado dentro del componente no active la actualización del selector a menos que se llame al despacho en algún lugar y actualice el estado?
const chat = useSelector((state: any) => state.user.rooms[index]) const [message, setMessage] = useState("");chat es el valor del selector y el mensaje es el estado de la etiqueta de entrada.
const Component = useCallback(() => { return ( <div className="h-[75%] bg-yellow-200 relative overflow-y-scroll flex flex-col"> {chat?.messages.map((message: any, index: number) => { console.log(message.sentBy._id, userId); let sentByme = message.sentBy._id === userId; return ( <div className={"w-[50%] min-h-[20%] border-4 rounded-3xl "}> <p>{message.text}</p> <p> {message.timeStamp} : {sentByme ? "me" : message.sentBy.name} </p> </div> ); })} </div> ); }, [chat]);Decidí dejar de lado el valor del selector de chat dentro de useCallback para evitar volver a renderizar en el cambio de estado de entrada, es decir, "mensaje", pero se está reproduciendo
Los componentes se vuelven a renderizar como un todo y, por defecto, todos sus elementos secundarios también se volverán a renderizar después de eso. Si desea que una parte de su componente no se vuelva a representar, debe dividirlo en dos componentes y representarlos uno al lado del otro o envolver el componente secundario en React.memo.
Los selectores se ejecutarán en cada renderizado y también en cada envío de Redux; si eso es un problema de rendimiento en algún momento, busque en los selectores memorizados. https://redux.js.org/recipes/computing-derived-data
Sin embargo, en su caso, el selector en sí no es un problema de rendimiento en absoluto.