When You SHOULDN'T Use Computed in Vue

Sdílet
Vložit
  • čas přidán 7. 09. 2024

Komentáře • 30

  • @RomanDawydkin
    @RomanDawydkin Před 5 měsíci +3

    Note: it's all changed in Vue 3.4: "a substantial refactor of the reactivity system, with the goal of improving re-compute efficiency of computed properties". "With the post-3.4 optimizations, the callback now only fires if the computed result has actually changed."

  • @fredhair
    @fredhair Před rokem +9

    I think the real issue you highlighted is unnecessarily using a computed value as a dependency on another computed value!

    • @butbutmybutt
      @butbutmybutt Před rokem

      yes, just use watch functions. but I think it's cleaner with eagerComputed, less code.

    • @fredhair
      @fredhair Před rokem

      @@butbutmybutt Oh yeah, it's a nice little abstraction I guess. I don't know that it adds much imo, watch and watchEffect aren't exactly overly complex or verbose! If you're using it a lot then it could make sense.

  • @dCoder92
    @dCoder92 Před rokem +9

    Since vue 3 i struggle when to use composable and when not.
    Like everything could be outsourced in a composable (every api request, every state change etc.).
    It is very confusing... 🤕
    Like 80% my logic is in composables...
    Is there any tip or video that could help?

    • @nero1375
      @nero1375 Před rokem

      did you have so much logic reuse to transfer all those codes into composables?

    • @LearnVue
      @LearnVue  Před rokem +11

      When the logic is reused, that's when I try to wrap things in a composable.
      I've also seen it used as a way to just structure code so SFCs aren't massive.

    • @Ma1ne2
      @Ma1ne2 Před rokem +2

      @@LearnVue We use it in our company in both mentioned ways. For example, we have different modules in our web app. If we have shared state between the modules, we move it into a composable with global state. If we have module or even SFC specific logic and state, then we still move it into a composable with local state (not shared, newly created whenever the useX is called). As @LearnVue pointed out, this is also a great way to reduce SFC size. By that, our SFCs stay much more readable, since we move it's core logic behind an interface (the composable).

  • @abdallah.s1507
    @abdallah.s1507 Před 5 měsíci

    Thank you for this valuable information

  • @linusborg
    @linusborg Před rokem +2

    Great Summary!

    • @LearnVue
      @LearnVue  Před rokem +1

      couldn’t have done it without a great original blog post and reactivity library 😉

  • @codestuff3685
    @codestuff3685 Před rokem +7

    didn't know about this. useful

    • @LearnVue
      @LearnVue  Před rokem

      i thought it was neat too when i read the article - glad you agree :)

  • @lukmanhakim-hz4jm
    @lukmanhakim-hz4jm Před rokem +2

    Very helpful

  • @dbroche
    @dbroche Před rokem

    thank you for sharing all the great stuff!

  • @12generalS237
    @12generalS237 Před rokem

    This is great, thank you!

  • @furkanulutas
    @furkanulutas Před rokem

    Very nice. Thank you.

  • @pawankumarthakur
    @pawankumarthakur Před rokem +1

    Could you share the Theme name, please? Looks really nice.

  • @yanDev
    @yanDev Před rokem

    very interesting!
    Thanks

  • @jingzheshan
    @jingzheshan Před rokem

    Thanks for sharing!

  • @ilya.degtyarenko
    @ilya.degtyarenko Před rokem

    Thanks 💛💙

  • @videolucu5900
    @videolucu5900 Před rokem

    GOD!!!My broo

  • @jameswrightson744
    @jameswrightson744 Před rokem +2

    "When You SHOULDN'T Use Computed in Vue" - "In a few cases"

    • @jhblack23
      @jhblack23 Před rokem

      The title is a better clickbait like that 😆

    • @jameswrightson744
      @jameswrightson744 Před rokem

      @@jhblack23 not click bait, he provides very little reason not to use it

    • @LearnVue
      @LearnVue  Před rokem +2

      lol the title was too good to pass up.
      i think the use case is 3:46 where you have an expensive operation that relies on a simple computed property is the main summary from a title -> answer perspective.
      the default use and optimizations for computed is still good to handle a majority of use cases, but at least for me - learning about eager computed taught me a lot about the specifics of how vue computed caches and updates.

  • @MartinMasevski
    @MartinMasevski Před rokem

    Interesting 🐱

  • @Linkplay9
    @Linkplay9 Před rokem

    just do $: expensiveCalculation(count) and you will be good
    keep calm and use svelte