From 76c2414b4e4022add0f47f7610a3380000f44113 Mon Sep 17 00:00:00 2001 From: Matt McCormick Date: Fri, 20 Oct 2023 11:37:39 -0400 Subject: [PATCH] PERF: Update to @itk-wasm/image-io Also work around issue detecting input format type (use .isq extension). --- app/package.json | 6 +++--- app/pnpm-lock.yaml | 35 ++++++++++++++++++-------------- app/src/conversion-controller.ts | 11 +++++----- app/src/index.ts | 6 ++++++ app/vite.config.js | 19 +++++++---------- 5 files changed, 41 insertions(+), 36 deletions(-) diff --git a/app/package.json b/app/package.json index 035d2b0..433bf69 100644 --- a/app/package.json +++ b/app/package.json @@ -23,8 +23,8 @@ "license": "Apache-2.0", "homepage": "https://github.com/KitwareMedical/ITKIOScanco#readme", "dependencies": { - "itk-image-io": "1.0.0-b.132", - "itk-wasm": "1.0.0-b.132" + "@itk-wasm/image-io": "^0.3.0", + "itk-wasm": "1.0.0-b.149" }, "devDependencies": { "@itk-wasm/dam": "^1.0.1", @@ -38,4 +38,4 @@ "type": "git", "url": "https://github.com/KitwareMedical/ITKIOScanco" } -} \ No newline at end of file +} diff --git a/app/pnpm-lock.yaml b/app/pnpm-lock.yaml index db8ab5a..baeec34 100644 --- a/app/pnpm-lock.yaml +++ b/app/pnpm-lock.yaml @@ -5,12 +5,12 @@ settings: excludeLinksFromLockfile: false dependencies: - itk-image-io: - specifier: 1.0.0-b.132 - version: 1.0.0-b.132 + '@itk-wasm/image-io': + specifier: ^0.3.0 + version: 0.3.0 itk-wasm: - specifier: 1.0.0-b.132 - version: 1.0.0-b.132 + specifier: 1.0.0-b.149 + version: 1.0.0-b.149 devDependencies: '@itk-wasm/dam': @@ -313,6 +313,14 @@ packages: - debug dev: true + /@itk-wasm/image-io@0.3.0: + resolution: {integrity: sha512-xXOmQdQ2Pp7N7xgaHeHriVRKav694uXUPikqsesfWcf++zHaJc2RoRvN4/kWcewanWc/zM7RlTLF3Jnxype74Q==} + dependencies: + itk-wasm: 1.0.0-b.149 + transitivePeerDependencies: + - debug + dev: false + /@lit-labs/react@1.2.1: resolution: {integrity: sha512-DiZdJYFU0tBbdQkfwwRSwYyI/mcWkg3sWesKRsHUd4G+NekTmmeq9fzsurvcKTNVa0comNljwtg4Hvi1ds3V+A==} dev: true @@ -449,6 +457,10 @@ packages: qr-creator: 1.0.0 dev: true + /@thewtex/zstddec@0.1.2: + resolution: {integrity: sha512-Bv50pouFqlmIZDcAA2Nrpk9tjJpAPlqHHeD5h0noK+oNXMimrZ/hMbJK2N09Svr6TI/S6nT63dzkWoim4ZzTuw==} + dev: false + /@types/emscripten@1.39.7: resolution: {integrity: sha512-tLqYV94vuqDrXh515F/FOGtBcRMTPGvVV1LzLbtYDcQmmhtpf/gLYf+hikBbQk8MzOHNz37wpFfJbYAuSn8HqA==} dev: false @@ -930,19 +942,12 @@ packages: engines: {node: '>=16.0.0', npm: '>=7.0.0'} dev: true - /itk-image-io@1.0.0-b.132: - resolution: {integrity: sha512-WHvubOh9zaXLnAGJO0wmElRoBxaq9JvHmrmP05obujBjP1n1LwkH4WXtud6LcWHfSp9BuTM7rdUGyzMigLZbmw==} - dependencies: - itk-wasm: 1.0.0-b.132 - transitivePeerDependencies: - - debug - dev: false - - /itk-wasm@1.0.0-b.132: - resolution: {integrity: sha512-sGiOR2hKqdGxDywESg71cdDUzFo3d5RJ882DB5Tdc6j2idGDyguKiJ2BcbjRdpFD+sXmpehgAI/Vmb0me0d9iw==} + /itk-wasm@1.0.0-b.149: + resolution: {integrity: sha512-G1wvURAGMz/0XjHK1TKb4dZLwMV4+zsUZcuEkokH2fVtxWotj93OL3mrJvs7fhQ0Jenusf4COFN4yZ9Xt37SEA==} hasBin: true dependencies: '@babel/runtime': 7.22.6 + '@thewtex/zstddec': 0.1.2 '@types/emscripten': 1.39.7 axios: 1.4.0 commander: 9.5.0 diff --git a/app/src/conversion-controller.ts b/app/src/conversion-controller.ts index 658e196..c45bcfa 100644 --- a/app/src/conversion-controller.ts +++ b/app/src/conversion-controller.ts @@ -1,4 +1,4 @@ -import { readImageArrayBuffer, writeImageArrayBuffer } from "itk-wasm" +import { readImage, writeImage } from "@itk-wasm/image-io" import conversionLoadSampleInputs from "./conversion-load-sample-inputs.js" import { notify, downloadFile } from "./utilities.js" @@ -91,19 +91,18 @@ class ConversionController { runButton.loading = true const t0 = performance.now() - const { webWorker, image } = await readImageArrayBuffer(this.webWorker, - model.inputVolume.slice(), - 'volume.aim' + const { webWorker, image } = await readImage(this.webWorker, + { data: model.inputVolume.slice(), path: 'volume.isq' } ) this.webWorker = webWorker // Avoid later use of detached buffer const direction = image.direction.slice() - const { arrayBuffer } = await writeImageArrayBuffer(webWorker, image, `${model.inputFileName}.${model.outputFormat}`) + const { serializedImage } = await writeImage(webWorker, image, `${model.inputFileName}.${model.outputFormat}`) const t1 = performance.now() notify("conversion successfully completed", `in ${t1 - t0} milliseconds.`, "success", "rocket-fill") - model.outputVolume = new Uint8Array(arrayBuffer) + model.outputVolume = new Uint8Array(serializedImage.data) outputOutputDownload.variant = "success" outputOutputDownload.disabled = false diff --git a/app/src/index.ts b/app/src/index.ts index fed2a3d..21e5cee 100644 --- a/app/src/index.ts +++ b/app/src/index.ts @@ -1,2 +1,8 @@ +import * as imageIo from '@itk-wasm/image-io' + +// Use local, vendored WebAssembly module assets +const pipelinesBaseUrl: string | URL = new URL('/itk/image-io', document.location.origin).href +imageIo.setPipelinesBaseUrl(pipelinesBaseUrl) + import './conversion-controller.js' // import './calibration-controller.js' diff --git a/app/vite.config.js b/app/vite.config.js index cb40710..393c02b 100644 --- a/app/vite.config.js +++ b/app/vite.config.js @@ -9,23 +9,18 @@ export default defineConfig({ outDir: 'dist', emptyOutDir: true, }, + worker: { + format: 'es' + }, + optimizeDeps: { + exclude: ['@itk-wasm/image-io'] + }, plugins: [ // put lazy loaded JavaScript and Wasm bundles in dist directory viteStaticCopy({ targets: [ - { src: 'node_modules/itk-wasm/dist/web-workers/*', dest: 'itk/web-workers' }, - { - src: 'node_modules/itk-image-io/*', - dest: 'itk/image-io', - }, + { src: 'node_modules/@itk-wasm/image-io/dist/pipelines/*.{js,wasm.zst}', dest: 'itk/image-io' }, ], }) ], - resolve: { - // where itk-wasm code has 'import ../itkConfig.js` point to the path of itkConfig - alias: { - '../itkConfig.js': itkConfig, - '../../itkConfig.js': itkConfig - } - } })