useTransition do react

14 Aug 2024

https://react.dev/reference/react/useTransition

benri danaaaaaa

basicamente vc marca num callback que toda essa transição de estado é uma…transição entao react renderiza uma vez com o isPending como true, nessa vc pode fazer alguma coisa na ui pra indicar q esta atualizando depois disso ele renderiza de vdd o legal disso tudo é que se outra transição acontecer, ele joga fora a que estava fazendo

na teoria só devemos usar com componentes q sao lerdos pra renderizar mas na pratica acabo pensando q devemos usar isso qse sempre…

aí tem o irmãozinho dele, o useDeferredValue (https://react.dev/reference/react/useDeferredValue), que é mais pra uso de suspense, mas também dá para se olhar como uma “melhora” de performance, em aspas porque é mais sobre impressão do que qlquer outra coisa

imagina que tem um componente que demora pra renderizar e um que não, exemplo mais básico, e que é o que está na documentação, é um input box e uma lista de resultados ao digitar, vc quer que IMEDIATAMENTE o valor do input box seja atualizado mas o da lista de resultados vc ta “ok” em esperar (q seja renderizado no bg), entao nesse vc passa o useDeferredValue

claro, input box na real nem precisa ser controlado na minha opinião, mas imagina que vc tem tb um com o conteúdo da busca, então nesse caso usaria o valor original, sem deferredValue