Test zip methods

main.js

async function inflatePNG(buffer, mark) {
  const canvas = document.createElement('canvas');
  canvas.width = 512;
  canvas.height = 512;
  const context = canvas.getContext('2d');
  const result = new Uint8Array(512 * 512);
  performance.mark(`${mark}-start`);
  const url = window.URL.createObjectURL(new Blob([buffer], { type: 'image/png' }));
  const image = await new Promise(resolve => {
    const i = new Image();
    i.onload = () => resolve(i);
    i.src = url;
  });
  context.drawImage(image, 0, 0);
  const imageData = context.getImageData(0, 0, 512, 512).data;
  for (var i = 0; i < 512 * 512; i++) {
    result[i] = imageData[i * 4];
  }
  performance.mark(`${mark}-end`);
  performance.measure(mark, `${mark}-start`, `${mark}-end`);
}

function inflateLib(buffer, mark) {
  const content = new Uint8Array(buffer);
  performance.mark(`${mark}-start`);
  const output = (new JXG.Util.Unzip(content)).unzip();
  performance.mark(`${mark}-end`);
  performance.measure(mark, `${mark}-start`, `${mark}-end`);
}

function inflateWA(buffer, mark) {
  const content = new Uint8Array(buffer);
  const metadata = Gziped.getMetadata(content);
  const output = Module._malloc((1e6) * content.BYTES_PER_ELEMENT);
  // console.log('malloc', output, metadata.filesize, 'B');
  // We could allocate once and always copy the data into the same place
  const input = Module._malloc((content.length + metadata.offset) * content.BYTES_PER_ELEMENT);
  // console.log('malloc', input, (content.length + metadata.offset) * content.BYTES_PER_ELEMENT, 'B');
  Module.HEAP8.set(content.slice(metadata.offset), input);
  performance.mark(`${mark}-start`);
  Module._em_inflate(input, output);
  performance.mark(`${mark}-end`);
  performance.measure(mark, `${mark}-start`, `${mark}-end`);
  Module._free(input);
  Module._free(output);
}

function inflateJS(buffer, mark) {
  const content = new Uint8Array(buffer);
  const metadata = Gziped.getMetadata(content);
  const output = new Uint8Array(metadata.filesize);
  const input = content.slice(metadata.offset);
  performance.mark(`${mark}-start`);
  Gziped.inflate(input, output);
  performance.mark(`${mark}-end`);
  performance.measure(mark, `${mark}-start`, `${mark}-end`);
}

function readFileAsText(file) {
  return new Promise(resolve => {
    const reader = new FileReader();
    reader.onload = (event) => {
      if (event.target.readyState === FileReader.DONE) {
        resolve(event.target.result);
      }
    }
    reader.readAsText(file);
  });
}

function readFile(file) {
  return new Promise(resolve => {
    const reader = new FileReader();
    reader.onload = (event) => {
      if (event.target.readyState === FileReader.DONE) {
        resolve(event.target.result);
      }
    }
    reader.readAsArrayBuffer(file);
  });
}

function report(mark) {
  const measures = performance.getEntriesByName(mark);
  const mean = measures.reduce((acc, m) => acc + m.duration, 0) / measures.length;
  const stddev = Math.sqrt(measures.reduce((acc, m) => acc + ((m.duration - mean) ** 2), 0) / (measures.length - 1));
  console.log(`${mark}: mean: ${mean.toFixed(2)} ms, standard deviation: ${stddev.toFixed(2)} ms`);
}

async function handleFiles(fileList) {
  const files = []
  // First, convert that ugly object to a proper array
  for (let i = 0; i < fileList.length; ++i) {
    files.push(fileList[i]);
  }

  const zipfiles = files.filter(f => f.name.endsWith('.gz'));
  const pngfiles = files.filter(f => f.name.endsWith('.png'));

  for (let zipfile of zipfiles) {
    console.log(`inflating ${zipfile.name}`);
    const content = await readFile(zipfile);
    inflateJS(content, 'inflateJS');
    inflateWA(content, 'inflateWA');
    inflateLib(content, 'inflateLib');
  }
  for (let pngfile of pngfiles) {
    const content = await readFile(pngfile);
    await inflatePNG(content, 'png');
  }
  report('inflateJS');
  report('inflateWA');
  report('inflateLib');
  report('png');
}

function main() {
  Module.onRuntimeInitialized = _ => {
    console.log(Module);
  };
}

window.onload = main