perf(reactivity): high efficiency effect()

[johnsoncodehk]

This PR uses the same way as #5912 to minimize effect() callback called times.

For the following code, times were reduced from 20001 to 167.

let times = 0

const sec = ref(0)
const min = computed(() => {
  return Math.floor(sec.value / 60)
})
const hour = computed(() => {
  return Math.floor(min.value / 60)
})

effect(() => {
  times++
  min.value
  hour.value
})

for (sec.value = 0; sec.value < 10000; sec.value++) { }

console.log('min:', min.value, 'hour:', hour.value) // min: 166 hour: 2
console.log(times) // 20001 -> 167

[vercel]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

1 Ignored Deployment

Name	Status	Preview	Updated (UTC)
sfc-playground	⬜️ Ignored (Inspect)		Apr 7, 2023 1:31pm

[johnsoncodehk]

Combine to #5912.