Explicando o hook useCallback ! Dicas avançadas de performance para React JS

แชร์
ฝัง
  • เผยแพร่เมื่อ 25 พ.ย. 2024
  • Se cadastre na minha lista de email para receber as comunicações em primeira mão : www.joaobibian...
    -----------
    Neste vídeo eu trago a você algo que precisei investir muito tempo para entender: como funciona o ciclo de renderização do React JS e como o hook useCallback funciona.
    Também te mostro os tradeoffs de seu uso, e quando você precisa ou não se preocupar com isso, para tornar sua aplicação muito mais performática e rápida com React JS
    Fiquem ligados que vem muito mais!
    Me siga no instagram @joaovbibiano

ความคิดเห็น • 66

  • @joaobibiano
    @joaobibiano  2 ปีที่แล้ว +1

    🚀 Conquiste a sua liberdade financeira com a programação em 2022!
    🔥 Desafio A Rota da Programação Front-end. 100% Ao Vivo e Gratuito. Inscreva-se.
    👉 joaobibiano.com.br/inscricao-desafio

  • @caiobozatoaroca7440
    @caiobozatoaroca7440 9 หลายเดือนก่อน +1

    Foi o único vídeo que eu consegui entender o hook, muito obrigado

    • @joaobibiano
      @joaobibiano  หลายเดือนก่อน

      Que bom que o vídeo ajudou! 😊 O hook useCallback pode ser meio confuso no início. Se precisar de mais dicas sobre hooks ou qualquer outra coisa do React, é só falar!

  • @jon1996xd
    @jon1996xd 2 ปีที่แล้ว +2

    Caramba, que aula! 10 minutos que nem vi passar, muito esclarecedor mesmo.

  • @nicolascouto9968
    @nicolascouto9968 3 ปีที่แล้ว +7

    Parabéns! Acabei de assistir 4 videos sobre o mesmo assunto, porém o seu foi o mais claro e objetivo que vi!

    • @joaobibiano
      @joaobibiano  3 ปีที่แล้ว +1

      Que ótimo Nicolas... Obrigado pelo comentário!! Fica ligado que é só o começo!!

  • @muuajizin23
    @muuajizin23 2 ปีที่แล้ว +1

    primeiro video sobre usecallback que eu consegui entender de forma fácil, parabens!!

  • @diegopollheim4903
    @diegopollheim4903 2 ปีที่แล้ว +1

    Melhor explicação parabéns !

    • @joaobibiano
      @joaobibiano  2 ปีที่แล้ว

      Obrigado!
      Aproveita e se inscreve no canal para não perder os próximos!

  • @walterfabri8852
    @walterfabri8852 ปีที่แล้ว +1

    Assisti vários vídeos sobre o assunto e o seu me fez entender logo nos primeiros 4 minutos, sensacional!

    • @joaobibiano
      @joaobibiano  ปีที่แล้ว +1

      Muito bom saber Walter! Obrigado e seja bem vindo

  • @Jonesgoful
    @Jonesgoful 2 ปีที่แล้ว +1

    Parabéns Bibiano. Excelente explicação. Havia antes entendido sobre memorização de valor porém desconhecia a deficiência em caso de supressão do array de dependência. Massa!

  • @gusalvestavo3721
    @gusalvestavo3721 2 ปีที่แล้ว +4

    Sensacional!! Ótima explicação, deixou extremamente claro tudo que foi passado. Valeu João! +1 sub

    • @joaobibiano
      @joaobibiano  2 ปีที่แล้ว +1

      Opa muito obrigado pelo feedback ;) é só o começo por aqui

  • @jerryjfernandes
    @jerryjfernandes 2 ปีที่แล้ว +3

    A tua didática é sensacional, cara. Parabéns e obrigado pelos conteúdos!

  • @OThiagoliveira
    @OThiagoliveira 2 ปีที่แล้ว +2

    Cara que explicação incrível e simples. Mesmo com déficit de atenção consegui entender de primeira

    • @joaobibiano
      @joaobibiano  2 ปีที่แล้ว

      Valeu Thiago! Tamo junto

  • @danielcso
    @danielcso 2 ปีที่แล้ว +1

    Excelente explicação. Sem rodeios.

    • @joaobibiano
      @joaobibiano  2 ปีที่แล้ว +1

      Valeu Daniel! Já aproveita e se inscreve no canal

  • @natan.opsilva
    @natan.opsilva 2 ปีที่แล้ว +1

    Obrigado

  • @wallacepassos6308
    @wallacepassos6308 2 ปีที่แล้ว +1

    ótima explicação

  • @kcapt96
    @kcapt96 2 ปีที่แล้ว +2

    Das melhores aulas sobre useCallback que vi. Muito bom.

    • @joaobibiano
      @joaobibiano  หลายเดือนก่อน

      Valeu demais pelo feedback! Fico feliz que você gostou da aula sobre o useCallback. Se precisar de mais dicas ou tiver dúvidas, só chamar!

  • @RafaelMacedo-f9m
    @RafaelMacedo-f9m ปีที่แล้ว

    Muito bom, obrigado pela explicação.

    • @joaobibiano
      @joaobibiano  ปีที่แล้ว

      Obrigado pelo comentário!

  • @jessi9522
    @jessi9522 2 ปีที่แล้ว +1

    muito bom o video muito obrigada

  • @itsonmaiorcomunidadedosurf7214
    @itsonmaiorcomunidadedosurf7214 2 ปีที่แล้ว +1

    Parabéns João! Vídeo top, dinâmico e explicativo. Valeu!

    • @joaobibiano
      @joaobibiano  2 ปีที่แล้ว

      Obrigado pelo feedback!!

  • @lchampzzz
    @lchampzzz 2 ปีที่แล้ว +1

    Sensacional!!

  • @tiagoborges7297
    @tiagoborges7297 2 ปีที่แล้ว +1

    Parabéns pela incrível didática João!

    • @joaobibiano
      @joaobibiano  2 ปีที่แล้ว

      Opa valeu Tiago! Obrigado pelo comentário

  • @JulianaNascimento42
    @JulianaNascimento42 2 ปีที่แล้ว +2

    Vim atrás de uma dica, acabei achando 2. Ótimo conteúdo! 😁

    • @joaobibiano
      @joaobibiano  หลายเดือนก่อน

      Que bom que você curtiu! 😄 A ideia é sempre passar mais dicas pra vocês. Se precisar de mais alguma coisa, pode perguntar! Tamo junto nessa jornada!

  • @jocelinnunes1264
    @jocelinnunes1264 2 ปีที่แล้ว +1

    show!

  • @ricardoblt7685
    @ricardoblt7685 2 ปีที่แล้ว

    muito boa sua didática, estou estudando Hooks e meu ajudou muito. vlw

  • @thalesfreitas2108
    @thalesfreitas2108 3 ปีที่แล้ว +2

    Muito bom, parabéns!

    • @joaobibiano
      @joaobibiano  3 ปีที่แล้ว

      Obrigado pelo comentário Thales! Fica ligado que vem muito mais

  • @diasdanie1234
    @diasdanie1234 2 ปีที่แล้ว +1

    Muito bom!!!!!

  • @brunno_gonzalez_dev
    @brunno_gonzalez_dev 3 ปีที่แล้ว +1

    Parabens muito bom o video!!

    • @joaobibiano
      @joaobibiano  3 ปีที่แล้ว

      Valeu Brunno! Fica ligado que é só o começo!!

  • @edu_sdorneles
    @edu_sdorneles 3 ปีที่แล้ว +1

    Ótima explicação! 👏

    • @joaobibiano
      @joaobibiano  3 ปีที่แล้ว +1

      Opa Eduardo, Obrigado pelo Feedback cara!
      É só o começo :)

  • @tantofaz123-p4p
    @tantofaz123-p4p ปีที่แล้ว +1

    show de bola man, só uma sujestão se puder aumentar a fonte do code seria otimo pra enxergar melhor

    • @joaobibiano
      @joaobibiano  ปีที่แล้ว +1

      Opa, esse foi um vídeo antigo, pode deixar que nos próximos eu ajusto

  • @andresribeiroo
    @andresribeiroo 3 ปีที่แล้ว +1

    O vídeo sobre o react-window será muito bem vindo :)

    • @joaobibiano
      @joaobibiano  3 ปีที่แล้ว

      Anotado André, valeu

    • @joaobibiano
      @joaobibiano  3 ปีที่แล้ว

      th-cam.com/video/bRPUj0AKFgs/w-d-xo.html

  • @pauloricardomarinhooficial
    @pauloricardomarinhooficial 3 ปีที่แล้ว +2

    Sensacional!!! 👏👏👏👏

  • @rodrigocortezpedrao5376
    @rodrigocortezpedrao5376 3 ปีที่แล้ว +2

    Muito bom, parabéns João, seria uma boa mesmo o vídeo do ReactWindow!!

    • @joaobibiano
      @joaobibiano  3 ปีที่แล้ว

      Vou preparar Cortez! Abraço

  • @danilonascimento4875
    @danilonascimento4875 3 ปีที่แล้ว

    muito bom! manda o react window ai!

    • @joaobibiano
      @joaobibiano  3 ปีที่แล้ว +1

      th-cam.com/video/bRPUj0AKFgs/w-d-xo.html está ai! Obrigado pelo comentário!

  • @oPers0n
    @oPers0n 2 ปีที่แล้ว +1

    poderia usar para setar os caracteres do input em um state sem renderizar o input?

  • @lucasneves8714
    @lucasneves8714 2 ปีที่แล้ว

    Opa, blz? Conteúdo muito top. Muito bem explicado. Mas em 2:45 voce citou que, quando criamos uma named function ao invés de usar uma função anônima, nós estamos RECRIANDO uma referência na memória. Mas não é EXATAMENTE ISSO que a named function evita? Teoricamente, ela só criaria a primeira referência a função updateName durante o render inicial do componente e quando chamada, não recriaria uma referência, sendo uma função named, mas sim usando a referencia JÁ CRIADA por não ser uma função do tipo anônima. Isso é contrário ao que voce ensinou e gostaria de saber qual dos 2 conceitos está correto: o que você apresentou ou este que estou trazendo. Consumo de memória é algo MT importante. Obrigado!

    • @joaobibiano
      @joaobibiano  2 ปีที่แล้ว

      O que eu disse está correto, para evitar isso tem que usar o useCallback.

  • @gabrielgorzonifernandes8148
    @gabrielgorzonifernandes8148 3 ปีที่แล้ว

    👏

  • @daviamerico2268
    @daviamerico2268 9 หลายเดือนก่อน

    quando uma renderização ocorre novamento o estado não é resetado ne? todas linhas do js no componente sao reexecutadas exceto a atribuição de estado iniucial?

    • @joaobibiano
      @joaobibiano  หลายเดือนก่อน

      Exatamente! Quando uma renderização ocorre, o estado mantém seus valores. A única coisa que é reexecutada é o código do componente, mas a atribuição do estado inicial só rola na primeira renderização. Boa pergunta! Se precisar de mais detalhes, tô aqui!

  • @lucasrodriguesdove
    @lucasrodriguesdove 11 หลายเดือนก่อน

    qual tema vc usa no vs code?

    • @joaobibiano
      @joaobibiano  หลายเดือนก่อน

      Que legal que você perguntou! Eu uso o tema "Dracula" no VS Code, é bem bonito e facilita a leitura. 😉 E você, qual tema prefere?