From 6a7a56886c28578b60ed3a1b30d817126a0fd928 Mon Sep 17 00:00:00 2001 From: Jan Prochazka Date: Sun, 26 Dec 2021 10:17:58 +0100 Subject: [PATCH] worker thread - using rollup config instead of plugin --- packages/web/rollup.config.js | 156 +++++++++++++----------- packages/web/src/query/AceEditor.svelte | 8 +- 2 files changed, 93 insertions(+), 71 deletions(-) diff --git a/packages/web/rollup.config.js b/packages/web/rollup.config.js index edea2d17..cf0c345c 100644 --- a/packages/web/rollup.config.js +++ b/packages/web/rollup.config.js @@ -7,10 +7,9 @@ import { terser } from 'rollup-plugin-terser'; import sveltePreprocess from 'svelte-preprocess'; import typescript from '@rollup/plugin-typescript'; import replace from '@rollup/plugin-replace'; -import webWorkerLoader from 'rollup-plugin-web-worker-loader'; +// import webWorkerLoader from 'rollup-plugin-web-worker-loader'; import css from 'rollup-plugin-css-only'; - const production = !process.env.ROLLUP_WATCH; function serve() { @@ -34,77 +33,98 @@ function serve() { }; } -export default { - input: 'src/main.ts', - output: { - sourcemap: true, - format: 'iife', - name: 'app', - file: 'public/build/bundle.js', +export default [ + { + input: 'src/query/QueryParserWorker.js', + output: { + sourcemap: true, + format: 'iife', + file: 'public/build/QueryParserWorker.js', + }, + plugins: [ + commonjs(), + resolve({ + browser: true, + }), + + // If we're building for production (npm run build + // instead of npm run dev), minify + production && terser(), + ], }, - plugins: [ - copy({ - targets: [ - { - src: '../../node_modules/@mdi/font/css/materialdesignicons.css', - dest: 'public/build/fonts/', + + { + input: 'src/main.ts', + output: { + sourcemap: true, + format: 'iife', + name: 'app', + file: 'public/build/bundle.js', + }, + plugins: [ + copy({ + targets: [ + { + src: '../../node_modules/@mdi/font/css/materialdesignicons.css', + dest: 'public/build/fonts/', + }, + { + src: '../../node_modules/@mdi/font/fonts/*', + dest: 'public/build/fonts/', + }, + { + src: '../../node_modules/diff2html/bundles/css/diff2html.min.css', + dest: 'public/build/', + }, + ], + }), + + replace({ + 'process.env.API_URL': JSON.stringify(process.env.API_URL), + }), + + svelte({ + preprocess: sveltePreprocess({ sourceMap: !production }), + compilerOptions: { + // enable run-time checks when not in production + dev: !production, }, - { - src: '../../node_modules/@mdi/font/fonts/*', - dest: 'public/build/fonts/', - }, - { - src: '../../node_modules/diff2html/bundles/css/diff2html.min.css', - dest: 'public/build/', - }, - ], - }), + }), + // we'll extract any component CSS out into + // a separate file - better for performance + css({ output: 'bundle.css' }), - replace({ - 'process.env.API_URL': JSON.stringify(process.env.API_URL), - }), + // If you have external dependencies installed from + // npm, you'll most likely need these plugins. In + // some cases you'll need additional configuration - + // consult the documentation for details: + // https://github.com/rollup/plugins/tree/master/packages/commonjs + resolve({ + browser: true, + dedupe: ['svelte'], + }), + commonjs(), + typescript({ + sourceMap: !production, + inlineSources: !production, + }), - svelte({ - preprocess: sveltePreprocess({ sourceMap: !production }), - compilerOptions: { - // enable run-time checks when not in production - dev: !production, - }, - }), - // we'll extract any component CSS out into - // a separate file - better for performance - css({ output: 'bundle.css' }), + // In dev mode, call `npm run start` once + // the bundle has been generated + !production && serve(), - // If you have external dependencies installed from - // npm, you'll most likely need these plugins. In - // some cases you'll need additional configuration - - // consult the documentation for details: - // https://github.com/rollup/plugins/tree/master/packages/commonjs - resolve({ - browser: true, - dedupe: ['svelte'], - }), - commonjs(), - typescript({ - sourceMap: !production, - inlineSources: !production, - }), + // Watch the `public` directory and refresh the + // browser on changes when not in production + !production && livereload('public'), - // In dev mode, call `npm run start` once - // the bundle has been generated - !production && serve(), + // If we're building for production (npm run build + // instead of npm run dev), minify + production && terser(), - // Watch the `public` directory and refresh the - // browser on changes when not in production - !production && livereload('public'), - - // If we're building for production (npm run build - // instead of npm run dev), minify - production && terser(), - - webWorkerLoader(), - ], - watch: { - clearScreen: true, + // webWorkerLoader(), + ], + watch: { + clearScreen: true, + }, }, -}; +]; diff --git a/packages/web/src/query/AceEditor.svelte b/packages/web/src/query/AceEditor.svelte index 952acbdb..e3f702f9 100644 --- a/packages/web/src/query/AceEditor.svelte +++ b/packages/web/src/query/AceEditor.svelte @@ -26,7 +26,7 @@ import { handleCommandKeyDown } from '../commands/CommandListener.svelte'; import resizeObserver from '../utility/resizeObserver'; // @ts-ignore - import QueryParserWorker from 'web-worker:./QueryParserWorker'; + // import QueryParserWorker from 'web-worker:./QueryParserWorker'; import queryParserWorkerFallback from './queryParserWorkerFallback'; const EDITOR_ID = `svelte-ace-editor-div:${Math.floor(Math.random() * 10000000000)}`; @@ -138,12 +138,14 @@ if (enabled) { if (!queryParserWorker) { try { - queryParserWorker = new QueryParserWorker(); + queryParserWorker = new Worker('build/QueryParserWorker.js'); + // console.log('WORKER', queryParserWorker); queryParserWorker.onmessage = e => { processParserResult(e.data); }; } catch (err) { - console.warn('WORKER ERROR, using fallback worker', err.message); + // console.error('WORKER ERROR', err); + console.log('WORKER ERROR, using fallback worker', err.message); queryParserWorker = 'fallback'; } }