VueJS Разница между Methods и Computed

Кеширование вычисляемых свойств

Вы могли заметить, что того же результата можно достигнуть при помощи метода:

<p>Сообщение задом наперёд: "{{ reverseMessage() }}"</p>
// в компоненте
methods: {
  reverseMessage: function () {
    return this.message.split('').reverse().join('')
  }
}

Вместо вычисляемого свойства, мы можем указать ту же самую функцию в качестве метода. С точки зрения конечного результата, оба подхода действительно делают одно и то же. Но есть важное различие: вычисляемые свойства кешируются, основываясь на своих зависимостях. Вычисляемое свойство будет пересчитано только тогда, когда изменится одна из его зависимостей. Поэтому, пока message остаётся неизменным, многократное обращение к reversedMessage будет каждый раз незамедлительно возвращать единожды вычисленное значение, не запуская функцию вновь.

Кроме того, это значит, что следующее вычисляемое свойство никогда не обновится, так как Date.now() не является реактивной зависимостью:

computed: {
  now: function () {
    return Date.now()
  }
}

Использование метода, напротив, запускает функцию всегда, при каждом обращении к нему.

Зачем нужно кеширование? Представьте, что у вас есть дорогое вычисляемое свойство A, требующее цикла по огромному массиву и выполняющее множество вычислений. А ещё пусть будут другие вычисляемые свойства, в свою очередь, зависящие от A. Без кеширования геттер A будет запускаться куда чаще необходимого! В тех же случаях, когда кеширования нужно избежать — используйте методы.

P.S.: Взято с официального мануала. Судя по описанию можно сказать что computed кешируется, а methods вызывается каждый раз.