Conflux

Build and read zip files with whatwg streams in the browser.

/ˈkänˌfləks/ (noun) a flowing together of two or more streams

Blazing Fast

• ~100 kB import
• Uses streams, minimizing memory overhead

Compatibility

Chrome	✅
Safari	✅
Edge	✅
Firefox	✅

Examples

• Writing zips
• Reading zips

Usage

Importing Conflux

Package Manager

# With Yarn
yarn add @transcend-io/conflux

# With NPM
npm install --save @transcend-io/conflux

import { Reader, Writer } from '@transcend-io/conflux';

CDN

<script src="https://cdn.jsdelivr.net/npm/@transcend-io/conflux@3"></script>

const { Reader, Writer } = window.conflux;

Writing a ZIP

import { Writer } from '@transcend-io/conflux';

import streamSaver from "streamsaver";

// Set up conflux
const { readable, writable } = new Writer();
const writer = writable.getWriter();

// Set up streamsaver
const fileStream = streamSaver.createWriteStream("conflux.zip");

// Add a file
writer.write({
  name: "/cat.txt",
  lastModified: new Date(0),
  stream: () => new Response("mjau").body
});

readable.pipeTo(fileStream);

writer.close();

Incorporating other streams

import { Writer } from '@transcend-io/conflux';

const { readable, writable } = new Writer();
const writer = writable.getWriter();
const reader = readable.getReader();

(async () => {
  writer.write({
    name: "/cat.txt",
    lastModified: new Date(0),
    stream: () => new Response("mjau").body
  });

  const imgStream = await fetch(
    "https://s3-us-west-2.amazonaws.com/bencmbrook/Earth.jpg"
  ).then(r => r.body);

  writer.write({
    name: "/Earth.jpg",
    lastModified: new Date(0),
    stream: () => imgStream
  });

  readable.pipeTo(fileStream);

  writer.close();
})();

Reading ZIP files

import { Reader } from '@transcend-io/conflux';

fetch("https://cdn.jsdelivr.net/gh/Stuk/jszip/test/ref/deflate.zip").then(
  async res => {
    const zip = await res.blob();
    for await (const entry of Reader(zip)) {
      console.log(entry);
    }
  }
);

License