推送新项目时如何防止列表重新呈现旧项目

Question

目前，我正在使用v-for在屏幕上显示列表，并使用按钮将一些新项目推送到列表中

<div v-for="(item, index) in contentList" :key="'content' + index" >
    {{ $textFormat.formatText(item) }}
</div>
<div class="btn" @click="pushitem">CLICK</div>

pushitem () {
  const self = this
  self.contentList.push(...self.newItems)
},

mounted () {
    const self = this
    self.contentList = []
    self.newItems = ['a', 'b', 'c', 'd']
}

我还写了一个插件来格式化屏幕上的文本

const TextFormat = {


install (Vue) {
    Vue.prototype.$textFormat = {
      formatText (value) {
        setTimeout(function () {
          console.log(value)
          return value
        })
      }
    }
  }
}
export default TextFormat

我的问题是，每当我单击添加新项目时，Vue似乎都会重新渲染v-for中的所有项目，因此，对于每个项目，都会再次调用我的formatText插件，对于列表中的大量项目，性能较差。那么，有什么解决方案可以使我的插件在每次单击pushItem按钮时仅针对新项目运行，而不对旧项目运行？还是我创建格式文本插件的方式正确吗？