DEV Community

Discussion on: 5 Extremely Easy ways to drastically improve your VueJS app’s speed

Collapse
 
sammerro profile image
Michał Kowalski • Edited

Seems pretty usefull! I would suggest to make section titles more explanatory.

I recently faced problem with v-if and v-show. I have a grid with many products and they have a little side box with severeal variants. If I would load all at the start it's too slow.
So I wanted to hide those variants and only show them when user hovers over the certain product.
With v-show it is too slow at first and with v-if the side variants render every time after mouseleave & again mouseenter so thats pretty awkward for the user.
So i came up with this idea:

  • use v-if and set condition to true only on the first mouseenter. Then hide and show the variants just with a css dynamic class.
Collapse
 
veebuv profile image
Vaibhav Namburi

Hey I'm so sorry it looks like I replied to a comment on this and not the main post.

I'll definitely update the article to make the titles more descriptive :)

That approach is pretty good as well, with vue 2.6 we have dynamic directives as well, so might be worth exploring that too :)