0

I need 16 bit greyscale images because of the detail accuracy for depth information. I use fast-png and am very happy with it. After the import, I only have to use the decode command to get the image information. What confuses me now is that when I import fast-png in the main program or anywhere else with this command

import {decode} from 'fast-png';

then that works. I can decode images and then read out the information. Now I would like to do this with a web worker and the import doesn't work there. I can call every module in the web worker with import but unfortunately not fast-png and I don't understand that. Does anyone understand?

//**********thread-manager-class*******************

import {decode} from 'fast-png';    // here it works but i don't need it here


export const texture_loader_threaded = (function() {

  class _TextureLoader_Threaded {
    constructor(params) {
      
      this.TextureLoaderWorker = new Worker('src/texture-loader-threaded-worker.js', {type: 'module'});
      this.TextureLoaderWorker.onmessage = (e) => { 
        this.result = e.data;
      };
    }//end constructor

  }//end class

  return {
    TextureLoader_Threaded: _TextureLoader_Threaded
  }
})();



//****************texture-loader-threaded-worker.js**********************

//import { decode } from 'fast-png';        
//But importing fast-png here causes the worker to stop working. 
//I can import all other modules from the project here without any problems. 
//But I don't need any of the other modules here, I need fast-png



async function imageLoader() {

    const arrayBuffer = await(await fetch('./resources/textures/png/native.png')).arrayBuffer();
    
    //const data = await decode(arrayBuffer);   //I need this to decode the arrayBuffer and get the data from the image

    postMessage(arrayBuffer);   //just a test, it works. But i don't need to return the arrayBuffer. 
//I neet to return the decoded data array
//As soon as I import fast-png in the worker above, the return value of the postMessage becomes "undefined", 
//even though I haven't changed anything else, just by importing fast-png


}

imageLoader();

this is the link to fast-png.

https://github.com/image-js/fast-png

unfortunately there is no javascript module to import there, that is typescript. I installed fast-png with npm.

Spiri
  • 331
  • 2
  • 9
  • This seems to have something to do with that fast-png requires node modules. But I still don't understand why it doesn't work – Spiri Dec 20 '22 at 10:45
  • Ok it is probably the case that webpack does not bundle node_modules. These can be integrated anywhere in the program and then work, but workers are an exception. So I have to integrate the corresponding node modules that I need for fast-png and fast-png itself in the webpack.config.js and in the index.js file. Does anyone have experience with that? – Spiri Dec 21 '22 at 05:59

0 Answers0