Are You Following This Vue Best Practice?

แชร์
ฝัง
  • เผยแพร่เมื่อ 2 ต.ค. 2024
  • Prop stability is an important concept in Vue. By eliminating unnecessary updates, we can improve the performance of our app.
    ✅ FREE VUE 3 CHEATSHEET WITH ESSENTIAL CODE SNIPPETS
    learnvue.co/vu...
    follow me on twitter:
    / mattmaribojoc
    🚨 Like quick Vue lessons like these? Check out 800+ lessons over on Vue School - go.learnvue.co...
    Music by Lukrembo - Storybook

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

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

    I would like to see more "best practices" videos!

    • @joshuatye1027
      @joshuatye1027 4 หลายเดือนก่อน +1

      This example is based on the one from the docs. Just read the docs.

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

    your Vue videos are top tier. super helpful, intuitive, concise, and interesting. thank you and please keep it up!!!

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

    Oh my god this is the type of stuff I nerd over please more tips like that! Great video 👍

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

    Beyond any doubt this is one of your most useful videos :)
    It’s not that easy to run into recommendations like this, so I would really appreciate it if you could share some more best practices with us
    And as always, thank you! :)

  • @ThaRealIansanity
    @ThaRealIansanity ปีที่แล้ว +9

    Thank you. Simple yet very important concept. Adding to my checklist "prop stability analysis"

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

    Amazing! Do you have a discord channel?

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

      i've been thinking of making one...you interested?

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

      @@LearnVue Yes! Would be really appreciated!

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

    Great video!! thanks
    I like this short kind of tips/tutorials. It is easy to watch.

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

    Great. Indeed useful. Making videos like this will improve your subscribers very soon. Good luck and keep posting useful videos like this.

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

    Sir please make a video.... How to bundle vue3+ with django

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

    Hi, thanks for video! I really like you channel.
    There is a siren sound in the theme, and I never pay attention to it, till this war. So interesting how human noticing different things

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

    No, i'm definitely not following this practice, until now...
    Tks dude! 😄💥

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

    I've started learning vuejs a few weeks ago and this channel helped me a lot!

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

    I've stopped stopped liking your videos after watching them, I just press play, like and get wowed, you never disappoint and that's just the honest truth.

  • @AlamKhan-yt9wd
    @AlamKhan-yt9wd 2 วันที่ผ่านมา

    Can we have an A.I. model that'll go through your codebase & find this kind of inefficiency???

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

    Amazing. I am just creating an image gallery that I know will hugely benefit from this knowledge. Thank you so much for sharing 🙂

  • @MohamedElhadad-l1k
    @MohamedElhadad-l1k 5 หลายเดือนก่อน

    I would like to see more "best practices" videos!

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

    I would like to see more "best practices" videos!

  • @hacking-multiboot904
    @hacking-multiboot904 5 หลายเดือนก่อน

    Woooo

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

    That’s funny because I literally made this mistake and codepen was throwing an error on my code ! (Vs code wasn’t)

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

    Quality content. Loved it.

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

      Much appreciated!

  • @AbubakrSiddique-splenify
    @AbubakrSiddique-splenify 5 หลายเดือนก่อน

    Insightful

  • @ВладимирНетот
    @ВладимирНетот 7 หลายเดือนก่อน

    Great!

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

    Fireship tone clone :)
    Instructional ++

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

    Basicaly just pass the minimum amount of data

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

    I would like those type of videos

  • @7red4
    @7red4 2 ปีที่แล้ว

    Didn't notice that before. Helps a lot! Thank you!

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

    That's actually a nice tip. I really like this one

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

    Like your short and very informative videos

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

    This is great! Thanks for sharing.

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

    Awesome video! Thanks a lot

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

    Is this code editor vs code?

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

    Scary but powerful

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

    How about an Object prop ? Does it trigger an update if the children component mutate the value of an attribute of the Object prop ?

  • @riyad-appscode
    @riyad-appscode 2 ปีที่แล้ว

    more videos like this please

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

    Im gonna start doing this

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

    makes perfect sense

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

    Great video!!

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

    super helpful 🥰

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

    Simple and effective!

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

    Thanks!

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

    Does the component also rerender when a bound attribute is changed that the component does not define as a prop? For example when binding $attrs to a child.

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

      Why would it?

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

      @@dvdrtrgn It's a reactive property bound to the component just like a prop

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

      @@UBERDHOKER So only if the attr has a reactive value bound will a rerender be triggered upon an $attrs change.

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

    Amazing tip.

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

      Glad you think so!

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

    This is actually a bad practice. The component should be written so that they do not update if not needed. The issue of the solution mentioned in the video is that it moves logic out of the component....

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

      How would you go about this? Could you provide an example?

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

      @@joseisrael2946 sorry, I do not remember this exact issue and do not have time to rewatch it now. All I remember is thar he duplixates some part of the logic out of the component to detect if the component should be updated And that is totally against the idea of compobents - packing all related code, logic, etc at one place.
      If you ever need to change the logic, you should be doing it only in the component. Only if the component need more inputs or its output changes only then you should need to go out of the component.
      One general solution could be that the component would have some sort of method "do I need to be updated?".

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

    Why Vue is so esoteric and complicated.

  • @S-Lomar
    @S-Lomar 10 หลายเดือนก่อน

    Welcome to my pages 🥰🥰🥰🥰🥰🥰🥰🥰🥰🥰🥰🥰🥰🥰🥰🥰🥰🥰🥰🥰🥰🥰🥰🥰🥰🥰🥰🥰🥰🥰🥰🥰🥰🥰🥰🥰

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

    Thanks for this:
    activeId=(activeId+1) % arr.length