feat: Complete fleet — 94 skills across 10+ domains
Pulled ALL skills from 15 source repositories: - anthropics/skills: 16 (docs, design, MCP, testing) - obra/superpowers: 14 (TDD, debugging, agents, planning) - coreyhaines31/marketingskills: 25 (marketing, CRO, SEO, growth) - better-auth/skills: 5 (auth patterns) - vercel-labs/agent-skills: 5 (React, design, Vercel) - antfu/skills: 16 (Vue, Vite, Vitest, pnpm, Turborepo) - Plus 13 individual skills from various repos Mosaic Stack is not limited to coding — the Orchestrator and subagents serve coding, business, design, marketing, writing, logistics, analysis, and more. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
102
skills/vueuse-functions/references/useWebWorkerFn.md
Normal file
102
skills/vueuse-functions/references/useWebWorkerFn.md
Normal file
@@ -0,0 +1,102 @@
|
||||
---
|
||||
category: Browser
|
||||
---
|
||||
|
||||
# useWebWorkerFn
|
||||
|
||||
Run expensive functions without blocking the UI, using a simple syntax that makes use of Promise. A port of [alewin/useWorker](https://github.com/alewin/useWorker).
|
||||
|
||||
## Usage
|
||||
|
||||
### Basic example
|
||||
|
||||
```ts
|
||||
import { useWebWorkerFn } from '@vueuse/core'
|
||||
|
||||
const { workerFn } = useWebWorkerFn(() => {
|
||||
// some heavy works to do in web worker
|
||||
})
|
||||
```
|
||||
|
||||
### With dependencies
|
||||
|
||||
```ts {7-9}
|
||||
import { useWebWorkerFn } from '@vueuse/core'
|
||||
|
||||
const { workerFn, workerStatus, workerTerminate } = useWebWorkerFn(
|
||||
dates => dates.sort(dateFns.compareAsc),
|
||||
{
|
||||
timeout: 50000,
|
||||
dependencies: [
|
||||
'https://cdnjs.cloudflare.com/ajax/libs/date-fns/1.30.1/date_fns.js', // dateFns
|
||||
],
|
||||
},
|
||||
)
|
||||
```
|
||||
|
||||
### With local dependencies
|
||||
|
||||
```ts {9-9}
|
||||
import { useWebWorkerFn } from '@vueuse/core'
|
||||
|
||||
const pow = (a: number) => a * a
|
||||
|
||||
const { workerFn, workerStatus, workerTerminate } = useWebWorkerFn(
|
||||
numbers => pow(numbers),
|
||||
{
|
||||
timeout: 50000,
|
||||
localDependencies: [pow]
|
||||
},
|
||||
)
|
||||
```
|
||||
|
||||
## Web Worker
|
||||
|
||||
Before you start using this function, we suggest you read the [Web Worker](https://developer.mozilla.org/en-US/docs/Web/API/Web_Workers_API/Using_web_workers) documentation.
|
||||
|
||||
## Credit
|
||||
|
||||
This function is a Vue port of https://github.com/alewin/useWorker by Alessio Koci, with the help of [@Donskelle](https://github.com/Donskelle) to migration.
|
||||
|
||||
## Type Declarations
|
||||
|
||||
```ts
|
||||
export type WebWorkerStatus =
|
||||
| "PENDING"
|
||||
| "SUCCESS"
|
||||
| "RUNNING"
|
||||
| "ERROR"
|
||||
| "TIMEOUT_EXPIRED"
|
||||
export interface UseWebWorkerOptions extends ConfigurableWindow {
|
||||
/**
|
||||
* Number of milliseconds before killing the worker
|
||||
*
|
||||
* @default undefined
|
||||
*/
|
||||
timeout?: number
|
||||
/**
|
||||
* An array that contains the external dependencies needed to run the worker
|
||||
*/
|
||||
dependencies?: string[]
|
||||
/**
|
||||
* An array that contains the local dependencies needed to run the worker
|
||||
*/
|
||||
localDependencies?: Function[]
|
||||
}
|
||||
/**
|
||||
* Run expensive function without blocking the UI, using a simple syntax that makes use of Promise.
|
||||
*
|
||||
* @see https://vueuse.org/useWebWorkerFn
|
||||
* @param fn
|
||||
* @param options
|
||||
*/
|
||||
export declare function useWebWorkerFn<T extends (...fnArgs: any[]) => any>(
|
||||
fn: T,
|
||||
options?: UseWebWorkerOptions,
|
||||
): {
|
||||
workerFn: (...fnArgs: Parameters<T>) => Promise<ReturnType<T>>
|
||||
workerStatus: ShallowRef<WebWorkerStatus, WebWorkerStatus>
|
||||
workerTerminate: (status?: WebWorkerStatus) => void
|
||||
}
|
||||
export type UseWebWorkerFnReturn = ReturnType<typeof useWebWorkerFn>
|
||||
```
|
||||
Reference in New Issue
Block a user