Will I lose performance by specifying a value that I might not use in a dynamic component in Vue.js?

user_2005682 0
Viewed 55

In my app, I have 10 components, all of which require a property called andamento; but only a subset require a property called custas.

If I set the custas property for all components in andamentosOrdenado (below), will I lose performance versus setting the property for only a subset?

Here is my code:

<v-timeline-item class="mb-3" small v-for="andamento in andamentosOrdenado" :key="andamento.nome">
  <component v-bind:is="andamento.form" :andamento="andamento" :custas="notificacao.custas"></component>
</v-timeline-item>
vue.js javascript
1 Answers

If the value of custas is static/constant:

No, because you can't "lose" performance for not using a constant value/variable, this is because the property has already been defined and it's value has already been evaluated (a process that doesn't need to happen again).

If the value of custas isn't static/constant:

Then yes, because you're making the machine waste resources on evaluating a non-static value that you're most likely not going to use. Not to mention that this value might change, meaning it's value would be re-evaluated (for no reason).

An alternative solution to this problem would be to use an if statement to define the custas property conditionally, for example:

// pseudo code:
if (i_need_custas) {
  my_object.custas = fn_that_returns_value_that_might_change();
}

Then, where you need to use custas:

// pseudo code:
if (my_object.hasOwnProperty("custas")) {
  // do stuff with custas
}

Good luck.

user_104156950
Related