Problem with wasm file

[tiuvi]

I encountered a challenging error with version 1.5.2. Does anyone have any suggestions?

It seems the issue is related to the WASM file or its configuration. Since these files are not available on GitHub, I can't track down the exact problem. However, version 1.5.1 works correctly.

I also encountered issues when downloading the asset files and had to create a script to download them myself.

const axios = require('axios');
const fs = require('fs');
const path = require('path');

// URL del archivo JSON
const url = 'https://staticimgly.com/@imgly/background-removal-data/1.5.1/dist/resources.json';

async function downloadFile(fileUrl, filePath) {
try {
const response = await axios({
method: 'get',
url: fileUrl,
responseType: 'stream'
});

const fileStream = fs.createWriteStream(filePath);
response.data.pipe(fileStream);

return new Promise((resolve, reject) => {
  fileStream.on('finish', () => {
    console.log(`Archivo guardado como: ${filePath}`);
    resolve();
  });
  fileStream.on('error', err => {
    console.error('Error al escribir el archivo:', err);
    reject(err);
  });
});
} catch (error) {
console.error(Error al descargar el archivo desde ${fileUrl}:, error);
throw error;
}
}

async function main() {
try {
const response = await axios.get(url);
const jsonData = response.data;

for (const key in jsonData) {
  for (const item of jsonData[key].chunks) {
    const fileUrl = `https://staticimgly.com/@imgly/background-removal-data/1.5.2/dist/${item.hash}`;
    const filePath = path.join(__dirname, `${item.hash}.hash`);
    
    await downloadFile(fileUrl, filePath);
  }
}

console.log("Todas las descargas han terminado.");
} catch (error) {
console.error('Error al obtener el archivo JSON:', error);
}
}

main();

Additionally, some documentation is only available on npm:

{
  publicPath: string; // The public path used for model and wasm files. Default: 'https://staticimgly.com/${PACKAGE_NAME}-data/${PACKAGE_VERSION}/dist/'
  debug: bool; // Enable or disable useful console.log outputs
  device: 'cpu' | 'gpu'; // Choose the execution device. GPU will use WebGPU if available
  proxyToWorker: bool; // Whether to proxy the calculations to a web worker. (Default true)
  model: 'small' | 'medium'; // The model to use. (Default "medium")
  output: {
    format: 'image/png' | 'image/jpeg' | 'image/webp'; // The output format. (Default "image/png")
    quality: number; // The quality. (Default: 0.8)
    type: 'foreground' | 'background' | 'mask'; // The output type. (Default "foreground")
  };
}

Additionally, preload does not function correctly as it requests all 100 files at once, which can cause client failures when downloading the files, especially on mobile devices. The best approach is to download them one by one and cache them in the service worker before calling the backgroundRemove function.

(async ()=>{
    
    const resource = await json("resource", "ia/backgroundRemovalWasm/resources");
    console.log($Jsonresource);
    for(const value in $Jsonresource){

        for(const url of $Jsonresource[value].chunks){
            
            await fetch("https://cell1.tiuvi.com:1030/ia/backgroundRemovalWasm/" + url.hash )
            
        }
        
    }
    
})()

In addition, hash URLs do not have an extension, all URLs, unless they are dynamic, must have an extension and the extension specifies the type of content.

Good luck fixing 1.5.2

[DanielHauschildt]

Sorry for the inconvenience. We encountered issues with providing the data files via npm due to Package Size limitation of NPM.

Therefore, now we have decided to make the data downloadable as one package via the CDN

See #127.

Additionally, I agree with preload.

The better version to preload is to just run the background removal once with a empty image.

As soon as there is some time we'll fix this.

[tiuvi]

I suggest making the repository compatible with huggingface or tensorflowjs:
Link to mediapipe
https://mediapipe-studio.webapps.google.com/home
Link to transformer
https://huggingface.co/docs/transformers.js/index
I think that implementing the solution of removing the background here would be good for the participation of the community, more focused on artificial intelligence and also obtaining the benefits of importing the models that are already fully resolved.

I have implemented mediapipe and transformer in my web application and it was very quick to do.
Don't worry about the problems the other way around, thank you very much for this great solution to remove background.
I currently tested it with webcodecs and although it was slow it was able to remove the background frame by frame very precisely.