# Web Workers

- Human documentation: [https://docs.univer.ai/fr-FR/guides/sheets/getting-started/worker](https://docs.univer.ai/fr-FR/guides/sheets/getting-started/worker)

- Agent Markdown: [https://docs.univer.ai/fr-FR/guides/sheets/getting-started/worker.md](https://docs.univer.ai/fr-FR/guides/sheets/getting-started/worker.md)

- Requested language: `fr-FR`

- Content language: `fr-FR`

- Documentation version: `1.2.0`

- Source: [sheets/getting-started/worker.fr-FR.mdx](https://github.com/dream-num/documentation/blob/dev/content/guides/sheets/getting-started/worker.fr-FR.mdx)

---

Les exemples suivants illustrent l’utilisation de base des Workers[^web-worker] dans Univer.

Dans Sheets, les Workers servent généralement à exécuter des tâches de calcul intensives, comme le calcul des formules. L’exécution de ce calcul dans un processus Worker réduit la charge du thread principal et préserve la fluidité du rendu et des interactions lorsqu’un classeur contient de nombreuses formules.

## Mode Plugin

Partez de la configuration du mode plugin de [l’installation](https://docs.univer.ai/fr-FR/guides/sheets/getting-started/installation.md). Gardez les plugins de rendu et d’interface sur le thread principal. Remplacez les trois enregistrements de calcul ci-dessous et ajoutez le plugin RPC avant de créer le classeur.

```typescript title="main.ts"
import { UniverFormulaEnginePlugin } from '@univerjs/engine-formula'
import { UniverRPCMainThreadPlugin } from '@univerjs/rpc'
import { UniverSheetsPlugin } from '@univerjs/sheets'
import { UniverSheetsFormulaPlugin } from '@univerjs/sheets-formula'

univer.registerPlugin(UniverRPCMainThreadPlugin, {
  workerURL: new Worker(new URL('./worker.ts', import.meta.url), { type: 'module' }),
})
univer.registerPlugin(UniverFormulaEnginePlugin, { notExecuteFormula: true })
univer.registerPlugin(UniverSheetsPlugin, { notExecuteFormula: true })
univer.registerPlugin(UniverSheetsFormulaPlugin, { notExecuteFormula: true })
```

Le Worker ne contient que les plugins de données et de calcul ci-dessous. N’y enregistrez aucun plugin UI ou de rendu. `notExecuteFormula: true` délègue le calcul au Worker.

```typescript title="worker.ts"
import { LocaleType, Univer } from '@univerjs/core'
import { UniverFormulaEnginePlugin } from '@univerjs/engine-formula'
import { UniverRPCWorkerThreadPlugin } from '@univerjs/rpc'
import { UniverSheetsPlugin } from '@univerjs/sheets'
import { UniverRemoteSheetsFormulaPlugin } from '@univerjs/sheets-formula'

const univer = new Univer({ locale: LocaleType.FR_FR })
univer.registerPlugin(UniverSheetsPlugin, { onlyRegisterFormulaRelatedMutations: true })
univer.registerPlugin(UniverFormulaEnginePlugin)
univer.registerPlugin(UniverRPCWorkerThreadPlugin)
univer.registerPlugin(UniverRemoteSheetsFormulaPlugin)
```

Avec les filtres, enregistrez `UniverSheetsFilterPlugin` de `@univerjs/sheets-filter` des deux côtés pour que `SUBTOTAL` tienne compte des lignes filtrées. Gardez `UniverSheetsFilterUIPlugin` sur le thread principal.

Pour les tableaux croisés, enregistrez aussi `UniverLicensePlugin`, `UniverProFormulaEnginePlugin` et `UniverSheetsPivotTablePlugin` des deux côtés. Pour les deux derniers, utilisez `notExecuteFormula: true` sur le thread principal et `false` dans le Worker. Fournissez la licence aux deux runtimes. Gardez l’UI sur le thread principal et enregistrez les formules personnalisées dans les deux moteurs.

## Mode Preset

L’option `workerURL` de la configuration de `UniverSheetsCorePreset` permet de spécifier l’URL du Worker et d’activer le mode Worker.

### Exemple : sheets-core-with-worker

Cet exemple importe le package de preset `sheets-filter`, car le calcul de la formule `SUBTOTAL` tient compte des lignes masquées par sheets-filter. Lorsque le calcul des formules est exécuté dans un Worker, sheets-filter doit également y être exécuté.

```typescript title="main.ts"
import { UniverSheetsCorePreset } from '@univerjs/preset-sheets-core'
import UniverPresetSheetsCoreEnUS from '@univerjs/preset-sheets-core/locales/en-US'
import { UniverSheetsFilterPreset } from '@univerjs/preset-sheets-filter'
import UniverPresetSheetsFilterEnUS from '@univerjs/preset-sheets-filter/locales/en-US'
import { createUniver, LocaleType, mergeLocales } from '@univerjs/presets'

import '@univerjs/preset-sheets-core/lib/index.css'
import '@univerjs/preset-sheets-filter/lib/index.css'

const { univerAPI } = createUniver({
  locale: LocaleType.EN_US,
  locales: {
    [LocaleType.EN_US]: mergeLocales(
      UniverPresetSheetsCoreEnUS,
      UniverPresetSheetsFilterEnUS,
    ),
  },
  presets: [
    UniverSheetsCorePreset({
      workerURL: new Worker(new URL('./worker.ts', import.meta.url), { type: 'module' }),
    }),
    UniverSheetsFilterPreset(),
  ],
})

univerAPI.createWorkbook({ name: 'Test Sheet' })
```

```typescript title="worker.ts"
import UniverPresetSheetsCoreEnUS from '@univerjs/preset-sheets-core/locales/en-US'
import { UniverSheetsCoreWorkerPreset } from '@univerjs/preset-sheets-core/worker'
import UniverPresetSheetsFilterEnUS from '@univerjs/preset-sheets-filter/locales/en-US'
import { UniverSheetsFilterWorkerPreset } from '@univerjs/preset-sheets-filter/worker'
import { createUniver, LocaleType, mergeLocales } from '@univerjs/presets'

createUniver({
  locale: LocaleType.EN_US,
  locales: {
    [LocaleType.EN_US]: mergeLocales(
      UniverPresetSheetsCoreEnUS,
      UniverPresetSheetsFilterEnUS,
    ),
  },
  presets: [
    UniverSheetsCoreWorkerPreset(),
    UniverSheetsFilterWorkerPreset(),
  ],
})
```

### Exemple : sheets-collaboration-with-worker

```typescript title="main.ts"
import { UniverSheetsAdvancedPreset } from '@univerjs/preset-sheets-advanced'
import UniverPresetSheetsAdvancedEnUS from '@univerjs/preset-sheets-advanced/locales/en-US'
import { UniverSheetsCollaborationPreset } from '@univerjs/preset-sheets-collaboration'
import UniverPresetSheetsCollaborationEnUS from '@univerjs/preset-sheets-collaboration/locales/en-US'
import { UniverSheetsCorePreset } from '@univerjs/preset-sheets-core'
import UniverPresetSheetsCoreEnUS from '@univerjs/preset-sheets-core/locales/en-US'
import { UniverSheetsDrawingPreset } from '@univerjs/preset-sheets-drawing'
import UniverPresetSheetsDrawingEnUS from '@univerjs/preset-sheets-drawing/locales/en-US'
import { createUniver, LocaleType, mergeLocales } from '@univerjs/presets'

import '@univerjs/preset-sheets-core/lib/index.css'
import '@univerjs/preset-sheets-drawing/lib/index.css'
import '@univerjs/preset-sheets-advanced/lib/index.css'
import '@univerjs/preset-sheets-collaboration/lib/index.css'

const { univerAPI } = createUniver({
  locale: LocaleType.EN_US,
  locales: {
    [LocaleType.EN_US]: mergeLocales(
      UniverPresetSheetsCoreEnUS,
      UniverPresetSheetsDrawingEnUS,
      UniverPresetSheetsAdvancedEnUS,
      UniverPresetSheetsCollaborationEnUS,
    ),
  },
  collaboration: true,
  presets: [
    UniverSheetsCorePreset({
      workerURL: new Worker(new URL('./worker.ts', import.meta.url), { type: 'module' }),
    }),
    UniverSheetsDrawingPreset({
      collaboration: true,
    }),
    UniverSheetsAdvancedPreset({
      useWorker: true,
      license: process.env.UNIVER_CLIENT_LICENSE || 'your license.txt',
    }),
    UniverSheetsCollaborationPreset({
    }),
  ],
})
```

```typescript title="worker.ts"
import UniverPresetSheetsAdvancedEnUS from '@univerjs/preset-sheets-advanced/locales/en-US'
import { UniverSheetsAdvancedWorkerPreset } from '@univerjs/preset-sheets-advanced/worker'
import UniverPresetSheetsCoreEnUS from '@univerjs/preset-sheets-core/locales/en-US'
import { UniverSheetsCoreWorkerPreset } from '@univerjs/preset-sheets-core/worker'
import { createUniver, LocaleType, mergeLocales } from '@univerjs/presets'

createUniver({
  locale: LocaleType.EN_US,
  locales: {
    [LocaleType.EN_US]: mergeLocales(
      UniverPresetSheetsCoreEnUS,
      UniverPresetSheetsAdvancedEnUS,
    ),
  },
  presets: [
    UniverSheetsCoreWorkerPreset(),
    UniverSheetsAdvancedWorkerPreset({
      license: process.env.UNIVER_CLIENT_LICENSE || 'your license.txt',
    }),
  ],
})
```

[^web-worker]: Un Web Worker exécute JavaScript hors du thread principal du navigateur et communique par messages. Il ne peut pas accéder directement au DOM : déplacer les calculs ne déplace pas l’interface de l’éditeur.