⬅️ Back to Table of Contents

📄 demo.vue

📊 Analysis Summary

Metric	Count
🔧 Functions	4
📦 Imports	6
📊 Variables & Constants	1
⚡ Async/Await Patterns	2
🟢 Vue Composition API	1

📚 Table of Contents

• Imports
• Variables & Constants
• Async/Await Patterns
• Vue Composition API
• Functions

🛠️ File Location:

📂 packages/core/useWebWorkerFn/demo.vue

📦 Imports

Name	Source
useDateFormat	@vueuse/core
useTimestamp	@vueuse/core
useWebWorkerFn	@vueuse/core
computed	vue
nextTick	vue
shallowRef	vue

---

Variables & Constants

Name	Type	Kind	Value	Exported
data	number	let/var	shallowRef<number[] | null>(null)	✗

---

Async/Await Patterns

Type	Function	Await Expressions	Promise Chains
async-function	baseSort	nextTick()	none
async-function	workerSort	nextTick(), workerFn()	none

---

Vue Composition API

Name	Type	Reactive Variables	Composables
computed	computed	none	none

---

Functions

heavyTask(): number[]

Code

function heavyTask() {
  const randomNumber = () => Math.trunc(Math.random() * 5_000_00)
  const numbers: number[] = Array.from({ length: 5_000_000 }).fill(undefined).map(randomNumber)
  numbers.sort()
  return numbers.slice(0, 5)
}

• Return Type: number[]
• Calls:
• Math.trunc
• Math.random
• Array.from({ length: 5_000_000 }).fill(undefined).map
• numbers.sort
• numbers.slice

randomNumber(): number

Code

() => Math.trunc(Math.random() * 5_000_00)

• Return Type: number
• Calls:
• Math.trunc

baseSort(): Promise<void>

Code

async function baseSort() {
  data.value = null
  await nextTick()
  data.value = heavyTask()
  runner.value = 'Main'
}

• Return Type: Promise<void>
• Calls:
• nextTick (from vue)
• heavyTask

workerSort(): Promise<void>

Code

async function workerSort() {
  data.value = null
  await nextTick()
  data.value = await workerFn()
  runner.value = 'Worker'
}

• Return Type: Promise<void>
• Calls:
• nextTick (from vue)
• workerFn

---