|
1 |
| -# Migration Guide: From itk.js to itk-wasm |
| 1 | +# Migration Guide: From itk.js to ITK-Wasm |
2 | 2 |
|
3 |
| -*Note: itk-wasm is currently in the beta development stage. The interface is relatively stable while functionality is currently being fleshed out. Updates for the rest of the documentation for changes from itk.js to itk-wasm is in progress. Last updated August 5th, 2023.* |
| 3 | +*Note: ITK-Wasm is currently in the beta development stage. The interface is relatively stable while functionality is currently being fleshed out. Updates for the rest of the documentation for changes from itk.js to ITK-Wasm is in progress. Last updated December 14th, 2023.* |
4 | 4 |
|
5 |
| -**itk-wasm** is a major upgrade with a focus on universal, performant computing in WebAssembly. The itk.js to itk-wasm transition also brings improvements, including modern, elegant programming interfaces, accelerated performance, and execution beyond JavaScript thanks to [WASI](https://wasi.dev). |
| 5 | +**ITK-Wasm** is a major upgrade with a focus on universal, performant computing in WebAssembly. The itk.js to ITK-Wasm transition also brings improvements, including modern, elegant programming interfaces, accelerated performance, and execution beyond JavaScript thanks to [WASI](https://wasi.dev). |
6 | 6 |
|
7 |
| -Most itk.js client code will simply need to update its import statements to leverage itk-wasm. However, there are also other more advanced changes. A description of the changes, their motivation, and example migration code can be found below. |
| 7 | +Most itk.js client code will simply need to update its import statements to leverage ITK-Wasm. However, there are also other more advanced changes. A description of the changes, their motivation, and example migration code can be found below. |
8 | 8 |
|
9 | 9 | ## Module import statements
|
10 | 10 |
|
@@ -37,57 +37,103 @@ import { IntTypes } from 'itk-wasm'
|
37 | 37 |
|
38 | 38 | ## TypeScript support
|
39 | 39 |
|
40 |
| -Typescript support was added, but, of course, you can still just use JavaScript if you wish. In itk-wasm, adoption of modern JavaScript constructs was extended, e.g. classes. |
| 40 | +Typescript support was added, but, of course, you can still just use JavaScript if you wish. In ITK-Wasm, adoption of modern JavaScript constructs was extended, e.g. classes. |
41 | 41 |
|
42 | 42 | ## Bundlers
|
43 | 43 |
|
44 |
| -ECMAScript Module (ESM) support was improved. |
| 44 | +ECMAScript Module (ESM) support is now standard. |
45 | 45 |
|
46 | 46 | There is now an improved approach for web workers for bundlers, CORS constraints.
|
47 | 47 |
|
| 48 | +## itkConfig.js removed |
| 49 | + |
| 50 | +The `itkConfig.js` module in itk-js and initial versions of ITK-Wasm specified where to look for the io webassembly modules and an optional default base URL for pipeline modules. |
| 51 | + |
| 52 | +This build-time approach has been replaced by a run-time configuration approach, which is much easier to specify and works transparently in a nested dependency situation. |
| 53 | + |
| 54 | +There are now only two configuration settings. |
| 55 | + |
| 56 | +1. The location of the web worker module. |
| 57 | +2. The location of wasm module assets. |
| 58 | + |
| 59 | +### Specification of the web worker module location |
| 60 | + |
| 61 | +By default, the web worker module will be picked up by modern bundlers like Vite or WebPack without additional configuration, and the bundler will manage the location of and deployment of the bundle in a application build. |
| 62 | + |
| 63 | +ITK-Wasm packages also contain module bundle that embed the web workers. |
| 64 | + |
| 65 | +Finally, on an individual ITK-Wasm package scope or bundle scope via the `itk-wasm` package, the web worker can be vendored and its location at specified at runtime via `setPipelineWorkerUrl`. |
| 66 | + |
| 67 | +### Specification of the wasm asset location |
| 68 | + |
| 69 | +Previously, separate wasm asset locations were configured for io modules and general pipelines. Now, there is a single wasm asset configuration. It can be set on a per-package level or a common configuration for a bundle can be set. |
| 70 | + |
| 71 | +By default, the wasm asset location is configured to use the [JsDelivr](https://www.jsdelivr.com/) CDN for a package. |
| 72 | + |
| 73 | +On an individual ITK-Wasm package scope or bundle scope via the `itk-wasm` package, wasm assets can be vendored and their location specified at runtime via `setPipelinesBaseUrl`. |
| 74 | + |
48 | 75 | ## IO modules are available in separate packages.
|
49 | 76 |
|
50 | 77 | IO modules are now installed in separate npm packages to limit the `itk-wasm` package size. You can install only the packages that you need.
|
51 | 78 |
|
52 |
| -The version of these packages follow the `itk-wasm` package version and should be kept in sync. The io packages are: |
| 79 | +The io packages are: |
53 | 80 |
|
54 |
| -1. `itk-image-io` |
55 |
| -2. `itk-mesh-io` |
| 81 | +1. `@itk-wasm/image-io` |
| 82 | +2. `@itk-wasm/mesh-io` |
56 | 83 | 3. `@itk-wasm/dicom`
|
57 | 84 |
|
58 |
| -An example that vendors these package's webassembly assets into an application for deployment can be found in the [Webpack Example](https://github.com/InsightSoftwareConsortium/itk-wasm/tree/main/examples/Webpack). |
| 85 | +An example that vendors these package's webassembly assets into an application for deployment can be found in the [Vite-based test applcation configuration](https://github.com/InsightSoftwareConsortium/itk-wasm/blob/main/packages/mesh-io/typescript/vite.config.js). |
59 | 86 |
|
60 | 87 | ### DICOM image IO functions
|
61 | 88 |
|
62 | 89 | The following DICOM image IO functions have been migrated to the `@itk-wasm/dicom` package. Their interface changed in some cases.
|
63 | 90 |
|
64 | 91 | 1. `readImageLocalDICOMFileSeries` -> `readImageDicomFileSeriesNode`
|
65 |
| -1. `readImageDICOMFileSeries` -> `readImageDicomFileSeries` |
66 |
| -1. `readImageDICOMArrayBufferSeries` -> `readImageDicomFileSeries` |
67 |
| -1. `readDICOMTags` -> `readDicomTags` |
68 |
| -1. `readDICOMTagsArrayBuffer` -> `readDicomTags` |
69 |
| -1. `readDICOMTagsLocalFile` -> `readDicomTagsNode` |
| 92 | +2. `readImageDICOMFileSeries` -> `readImageDicomFileSeries` |
| 93 | +3. `readImageDICOMArrayBufferSeries` -> `readImageDicomFileSeries` |
| 94 | +4. `readDICOMTags` -> `readDicomTags` |
| 95 | +5. `readDICOMTagsArrayBuffer` -> `readDicomTags` |
| 96 | +6. `readDICOMTagsLocalFile` -> `readDicomTagsNode` |
70 | 97 |
|
71 |
| -## itkConfig.js content and usage |
| 98 | +### Migrated image-io and mesh-io functions |
72 | 99 |
|
73 |
| -The `itkConfig.js` specifies where to look for the io webassembly modules and an optional default base URL for pipeline modules. |
| 100 | +The following image and mesh IO functions have been migrated to the `@itk-wasm/image-io` |
| 101 | +and `@itk-wasm/mesh-io` package. Their interface changed in some cases. |
74 | 102 |
|
75 |
| -The default `itkConfig.js` is configured to use the [JsDelivr](https://www.jsdelivr.com/) CDN, but you may want to override this default. |
| 103 | +1. `readImageArrayBuffer` -> `readImageFile` |
| 104 | +2. `readImageBlob` -> `readImageFile` |
| 105 | +3. `readImageFileSeries` -> `readImageFileSeries` |
| 106 | +4. `readImageHTTP` -> `readImageHttp` |
| 107 | +5. `readImageLocalFile` -> `readImageNode` |
| 108 | +6. `readMeshArrayBuffer` -> `readMeshFile` |
| 109 | +7. `readMeshBlob` -> `readMeshFile` |
| 110 | +8. `readMeshLocalFile` -> `readMeshNode` |
| 111 | +9. `writeImageArrayBuffer` -> `writeImageFile` |
| 112 | +10. `writeImageLocalFile` -> `writeImageFileNode` |
| 113 | +11. `writeMeshArrayBuffer` -> `writeMeshFile` |
| 114 | +12. `writeMeshLocalFile` -> `writeMeshNode` |
76 | 115 |
|
77 |
| -In the [Webpack Example](https://github.com/InsightSoftwareConsortium/itk-wasm/tree/main/examples/Webpack) the io webassembly module assets are vendored into `/itk` directories, this module looks like: |
| 116 | +### MeshToPolyData |
78 | 117 |
|
79 |
| -```js |
80 |
| -const itkConfig = { |
81 |
| - pipelineWorkerUrl: '/itk/web-workers/bundles/pipeline-worker.js', |
82 |
| - imageIOUrl: '/itk/image-io', |
83 |
| - meshIOUrl: '/itk/mesh-io', |
84 |
| - pipelinesUrl: '/itk/pipelines', |
85 |
| -} |
86 |
| - |
87 |
| -export default itkConfig |
88 |
| -``` |
| 118 | +The following mesh to polydata conversion functions have been migrated to the `@itk-wasm/mesh-to-poly-data` package. |
| 119 | + |
| 120 | +1. `meshToPolyData` |
| 121 | +2. `meshToPolyDataNode` |
| 122 | +3. `polyDataToMesh` |
| 123 | +4. `polyDataToMeshNode` |
| 124 | + |
| 125 | +### Removed high level IO functions |
| 126 | + |
| 127 | +The high level IO functions, that dealt with both images and meshes have been removed. |
| 128 | + |
| 129 | +These are: |
89 | 130 |
|
90 |
| -And it can be injected into an application bundle by setting defining `alias`'s to the configuration module for `../itkConfig.js` and `../../itkConfig.js`. For other override configuration options, see the [Webpack](https://github.com/InsightSoftwareConsortium/itk-wasm/tree/main/examples/Webpack) and Rollup (todo) examples. |
| 131 | +1. readArrayBuffer |
| 132 | +2. readBlob |
| 133 | +3. readFile |
| 134 | +4. readLocalFile |
| 135 | +5. writeArrayBuffer |
| 136 | +5. writeLocalFile |
91 | 137 |
|
92 | 138 | ## CLI options
|
93 | 139 |
|
@@ -135,7 +181,7 @@ Support for the legacy GE image file formats, i.e. GE4, GE5, GEAdw, is no longer
|
135 | 181 |
|
136 | 182 | ## IOTypes
|
137 | 183 |
|
138 |
| -The use of `IOTypes` in pipelines is deprecated and not expected to work in the future. These have been replaced by `InterfaceTypes`. |
| 184 | +The use of `IOTypes` in pipelines is deprecated has been removed. These have been replaced by `InterfaceTypes`. |
139 | 185 |
|
140 | 186 | ## Argument order when writing image, mesh binaries
|
141 | 187 |
|
|
0 commit comments