Trabajadores web

Los siguientes ejemplos demuestran el uso básico de Worker1 en Univer.

En Sheets, los Workers se usan comúnmente para tareas de computación intensiva, como el cálculo de fórmulas. Ejecutar el cálculo de fórmulas en un proceso de trabajo puede reducir la presión sobre el hilo principal y mantener la representación de la página y las interacciones receptivas cuando un libro contiene muchas fórmulas.

Modo predeterminado

La opción workerURL en la configuración UniverSheetsCorePreset le permite especificar la URL del trabajador y habilitar el modo de trabajador.

Ejemplo: hojas-núcleo-con-trabajador

Este ejemplo importa el sheets-filter paquete preestablecido porque el cálculo de la fórmula SUBTOTAL se ve afectado por filas ocultas en el filtro de hojas. Cuando los cálculos de fórmulas se ejecutan en un trabajador, el filtro de hojas también debe ejecutarse en el trabajador.

TypeScript
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
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(),  ],})

Ejemplo: hojas-colaboración-con-trabajador

TypeScript
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
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',    }),  ],})

Modo plugin

Parte de la configuración del modo plugin de la instalación. Mantén los plugins de renderizado e interfaz en el hilo principal. Sustituye los tres registros de cálculo siguientes y añade el plugin RPC antes de crear el libro.

TypeScript
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 })

El Worker solo contiene los plugins de datos y cálculo que se muestran abajo. No registres plugins de interfaz ni renderizado. notExecuteFormula: true delega el cálculo al Worker.

TypeScript
import { LocaleType, Univer } from '@univerjs/core'import { UniverFormulaEnginePlugin } from '@univerjs/engine-formula/worker'import { UniverRPCWorkerThreadPlugin } from '@univerjs/rpc/worker'import { UniverSheetsPlugin } from '@univerjs/sheets/worker'import { UniverRemoteSheetsFormulaPlugin } from '@univerjs/sheets-formula/worker'const univer = new Univer({ locale: LocaleType.ES_ES })univer.registerPlugin(UniverSheetsPlugin, { onlyRegisterFormulaRelatedMutations: true })univer.registerPlugin(UniverFormulaEnginePlugin)univer.registerPlugin(UniverRPCWorkerThreadPlugin)univer.registerPlugin(UniverRemoteSheetsFormulaPlugin)

Con filtros, registre UniverSheetsFilterPlugin en ambos hilos para que SUBTOTAL tenga en cuenta las filas filtradas: impórtelo de @univerjs/sheets-filter en el hilo principal y de @univerjs/sheets-filter/worker en el Worker. Mantenga UniverSheetsFilterUIPlugin en el hilo principal.

Use estas entradas para los plugins de cálculo adicionales del Worker. El hilo principal usa la raíz de cada paquete. Mantenga alineadas todas las versiones del SDK.

TypeScript
import { UniverProFormulaEnginePlugin } from '@univerjs-pro/engine-formula/worker'import { UniverSheetsPivotChartWorkerPlugin } from '@univerjs-pro/sheets-pivot-chart/worker'import { UniverSheetsPivotTablePlugin } from '@univerjs-pro/sheets-pivot/worker'import { UniverSheetsSlicerPlugin } from '@univerjs-pro/sheets-slicer/worker'import { UniverSheetsTablePlugin } from '@univerjs/sheets-table/worker'

Para tablas dinámicas, sustituya UniverFormulaEnginePlugin por UniverProFormulaEnginePlugin en ambos hilos y registre también UniverLicensePlugin y UniverSheetsPivotTablePlugin. Configure notExecuteFormula: true en el motor Pro y el plugin de tablas dinámicas del hilo principal, y false en el Worker. Proporcione la licencia en ambos entornos, mantenga la interfaz en el hilo principal y registre las funciones personalizadas en ambos motores.

Footnotes

  1. Un Web Worker ejecuta JavaScript fuera del hilo principal del navegador y se comunica mediante mensajes. No puede acceder directamente al DOM; mover los cálculos no mueve la interfaz del editor. ↩

¿Cómo es esta guía?

© 2026 DreamNum Co., Ltd.