nichoth nichoth

FFlate is the fastest, smallest, and most effective JavaScript compressor/decompressor currently; to create it, I used a variety of modified or optimized algorithms.

Part 1: The DEFLATE spec

The core of most popular compressed file formats is DEFLATE, or RFC1951. GZIP data, Zlib data, .zip files, PNG images, and more all use some variant of DEFLATE under the hood. At its core, the DEFLATE format is actually not too complex: it's merely a combination of Huffman coding and LZ77 compression.

If you don't understand either of these concepts, feel free to read the following subsections, or skip to Part 2 if you already know what these are and just want to get to implementation details.

Section I: Huffman Coding

Computers think of basically everything as numbers. The smallest unit of information in a computer is a single bit, which can only be either a 0 or a 1. When multiple bits are stringed together, they can be interpreted as a ba

web components

CSS

Use the ::part selector

sl-dialog::part(close-button) {
  display: none;
}

JSON + Set & Map

Serialize + deserialize sets and maps. See this blog post.

function replacer(key, value) {
  if (value instanceof Map) {
    return { __type: 'Map', value: Object.fromEntries(value) }
  }
 if (value instanceof Set) {

	import * as blake3 from 'blake3';

	async function streamHash(stream:ReadableStream<Uint8Array>):Promise<string> {
	const hasher = blake3.createHash();
	const reader = stream.getReader();

	while (true) {
	const { done, value } = await reader.read();
	if (done) {
	break;

	import Database from 'better-sqlite3';
	import { createDatabaseClient } from './proxy.ts';

	// 1) Create an in-memory DB and your table(s).
	const db = new Database(':memory:');
	db.exec(`
	CREATE TABLE users (
	id TEXT PRIMARY KEY,
	data JSON
	);

	var client = window.client = new WebTorrent({
	tracker: {
	rtcConfig: rtcConfig
	}
	})
	client.on('warning', onWarning)
	client.on('error', onError)

	torrent = client.add(TORRENT, onTorrent)

	async function forceSync(account: Account) {
	const { syncManager } = account._raw.core.node;

	const peer = Object.values(syncManager.peers)[0];
	if (!peer) {
	throw new Error("no peer");
	}

	const values = Object.values(account._raw.core.node.coValues).flatMap((x) => {
	if ("coValue" in x.state) {

	/**
	* Returns PBKDF2 derived key from supplied password.
	*
	* Stored key can subsequently be used to verify that a password matches the original password used
	* to derive the key, using pbkdf2Verify().
	*
	* @param {String} password - Password to be hashed using key derivation function.
	* @param {Number} [iterations=1e6] - Number of iterations of HMAC function to apply.
	* @returns {String} Derived key as base64 string.
	*

	//
	// I always like an opportunity to use `Set` in JS.
	// There should be `difference` and `intersection` operators
	// in new environments, but my Node didn't have them,
	// so we're doing it slightly more laboriously.
	// (`node -v` = 20.16.0)
	//

	const recipe = ['eggs', 'flour', 'sugar', 'butter']
	const pantry = ['sugar', 'butter', 'milk']

	// see https://stackoverflow.com/questions/3221561/eliminate-flash-of-unstyled-content
	//
	// The problem with using a css style to initially hide some page
	// elements, and then using javascript to change the style back to
	// visible after page load, is that people who don't have javascript
	// enabled will never get to see those elements.
	//
	// so, use javascript to both initially hide as well as redisplay
	// those elements after page load
	//