@squoosh-kit/core 0.2.2 → 0.2.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (2) hide show
  1. package/README.md +87 -42
  2. package/package.json +15 -15
package/README.md CHANGED
@@ -12,13 +12,13 @@
12
12
  Squoosh-Kit is built on a simple idea: provide a lightweight and modular bridge to the powerful, production-tested codecs from Google's Squoosh project.
13
13
 
14
14
  **Directly from the Source**
15
- We don't modify the core codecs. The WebAssembly (`.wasm`) binaries for WebP encoding and image resizing are taken directly from the official Squoosh repository builds. This means you get the exact same performance, quality, and reliability you'd expect from Squoosh.
15
+ We don't modify the core codecs. The WebAssembly (`.wasm`) binaries are taken directly from the official Squoosh repository builds. This means you get the exact same performance, quality, and reliability you'd expect from Squoosh.
16
16
 
17
17
  **A Thin, Modern Wrapper**
18
18
  Our goal is to provide a minimal, modern JavaScript wrapper around these codecs. We handle the tricky parts—like loading WASM, managing web workers, and providing a clean, type-safe API—so you can focus on your application. The library is designed to be a thin bridge, not a heavy framework.
19
19
 
20
20
  **Modular by Design**
21
- While this `core` package bundles everything for convenience, the Squoosh-Kit philosophy is to provide small, focused packages (e.g., `@squoosh-kit/webp`, `@squoosh-kit/resize`) so you only install what you need.
21
+ While this `core` package bundles everything for convenience, the Squoosh-Kit philosophy is to provide small, focused packages so you only install what you need. See the [Individual Packages](#individual-packages) section to use a specific codec directly.
22
22
 
23
23
  ## Installation
24
24
 
@@ -30,63 +30,108 @@ npm install @squoosh-kit/core
30
30
 
31
31
  ## Quick Start
32
32
 
33
- Everything you need, right at your fingertips:
33
+ All codecs are namespaced to avoid collisions — multiple packages export `encode` and `decode`, so they live under their own namespace:
34
34
 
35
35
  ```typescript
36
- import {
37
- encode,
38
- resize,
39
- createWebpEncoder,
40
- createResizer,
41
- } from '@squoosh-kit/core';
42
-
43
- // Quick one-off operations
44
- const webpData = await encode(imageData, {
45
- quality: 85,
46
- });
47
-
48
- const resizedImage = await resize(imageData, {
49
- width: 800,
50
- height: 600,
51
- });
52
-
53
- // Or create reusable processors for batch operations
54
- const encoder = createWebpEncoder('worker');
55
- const resizer = createResizer('worker');
36
+ import { webp, avif, mozjpeg, resize, png, rotate } from '@squoosh-kit/core';
37
+ import type { ImageInput } from '@squoosh-kit/core';
38
+
39
+ const imageData: ImageInput = {
40
+ data: rawPixelBuffer,
41
+ width: 1920,
42
+ height: 1080,
43
+ };
44
+
45
+ // Encode to WebP
46
+ const webpBuffer = await webp.encode(imageData, { quality: 85 });
47
+
48
+ // Encode to AVIF
49
+ const avifBuffer = await avif.encode(imageData, { quality: 60 });
50
+
51
+ // Resize first, then encode
52
+ const resized = await resize.resize(imageData, { width: 800, height: 600 });
53
+ const thumbnail = await mozjpeg.encode(resized, { quality: 80 });
54
+
55
+ // Lossless PNG
56
+ const pngBuffer = await png.encode(imageData);
57
+
58
+ // Rotate 90 degrees
59
+ const rotated = await rotate.rotate(imageData, { rotate: 90 });
56
60
  ```
57
61
 
58
62
  ## What's Included
59
63
 
60
- This package bundles together:
61
-
62
- - **WebP Encoding** - Convert images to the modern WebP format with fine-tuned quality control
63
- - **Image Resizing** - High-quality resizing with multiple algorithms (triangular, catrom, mitchell, lanczos3)
64
- - **Worker Management** - Automatic Web Worker integration to keep your app responsive
65
- - **TypeScript Support** - Full type definitions for a great development experience
66
- - **WebAssembly Codecs** - Pre-built WASM modules for fast processing (automatically resolved at runtime)
64
+ This package bundles all Squoosh-Kit codecs under a single import:
65
+
66
+ | Namespace | Package | Purpose |
67
+ | ------------ | ------------------------- | ------------------------------------ |
68
+ | `webp` | `@squoosh-kit/webp` | WebP encoding/decoding |
69
+ | `avif` | `@squoosh-kit/avif` | AVIF encoding/decoding |
70
+ | `mozjpeg` | `@squoosh-kit/mozjpeg` | Optimized JPEG encoding/decoding |
71
+ | `jxl` | `@squoosh-kit/jxl` | JPEG XL encoding/decoding |
72
+ | `wp2` | `@squoosh-kit/wp2` | WP2 encoding/decoding (experimental) |
73
+ | `png` | `@squoosh-kit/png` | Lossless PNG encoding/decoding |
74
+ | `qoi` | `@squoosh-kit/qoi` | QOI lossless encoding/decoding |
75
+ | `resize` | `@squoosh-kit/resize` | High-quality image resizing |
76
+ | `rotate` | `@squoosh-kit/rotate` | 90°/180°/270° rotation |
77
+ | `oxipng` | `@squoosh-kit/oxipng` | Lossless PNG optimization |
78
+ | `imagequant` | `@squoosh-kit/imagequant` | Palette quantization (PNG-8) |
79
+ | `hqx` | `@squoosh-kit/hqx` | Pixel-art upscaling (2x/3x/4x) |
80
+ | `visdif` | `@squoosh-kit/visdif` | Butteraugli perceptual comparison |
67
81
 
68
82
  ## When to Use Core vs Individual Packages
69
83
 
70
84
  **Use `@squoosh-kit/core` when:**
71
85
 
72
- - You're just getting started and want everything available
73
- - Your project needs both WebP encoding and resizing
74
- - You prefer a single dependency for simplicity
75
- - You're building a prototype or proof of concept
76
- - You're using the package in a browser or Node.js/Bun environment
86
+ - You need multiple codecs and want a single import
87
+ - You're exploring the library and want everything available
88
+ - Bundle size is not a concern (e.g., server-side tooling)
77
89
 
78
- **Consider individual packages when:**
90
+ **Use individual packages when:**
79
91
 
80
- - You only need one specific feature (like just WebP encoding)
81
- - Bundle size is critical and you want to minimize dependencies (install `@squoosh-kit/resize` or `@squoosh-kit/webp` directly)
92
+ - You only need one specific codec
93
+ - Bundle size is critical (install only `@squoosh-kit/webp`, `@squoosh-kit/avif`, etc.)
82
94
  - You need fine-grained control over versions
83
95
 
84
- ## API Reference
96
+ ## Individual Packages
97
+
98
+ Each codec is available as a standalone package on npm:
99
+
100
+ | Package | npm |
101
+ | -------------------------- | --------------------------------------------------------------------------------------------------------------------------- |
102
+ | `@squoosh-kit/webp` | [![npm](https://badge.fury.io/js/%40squoosh-kit%2Fwebp.svg)](https://www.npmjs.com/package/@squoosh-kit/webp) |
103
+ | `@squoosh-kit/avif` | [![npm](https://badge.fury.io/js/%40squoosh-kit%2Favif.svg)](https://www.npmjs.com/package/@squoosh-kit/avif) |
104
+ | `@squoosh-kit/mozjpeg` | [![npm](https://badge.fury.io/js/%40squoosh-kit%2Fmozjpeg.svg)](https://www.npmjs.com/package/@squoosh-kit/mozjpeg) |
105
+ | `@squoosh-kit/jxl` | [![npm](https://badge.fury.io/js/%40squoosh-kit%2Fjxl.svg)](https://www.npmjs.com/package/@squoosh-kit/jxl) |
106
+ | `@squoosh-kit/wp2` | [![npm](https://badge.fury.io/js/%40squoosh-kit%2Fwp2.svg)](https://www.npmjs.com/package/@squoosh-kit/wp2) |
107
+ | `@squoosh-kit/png` | [![npm](https://badge.fury.io/js/%40squoosh-kit%2Fpng.svg)](https://www.npmjs.com/package/@squoosh-kit/png) |
108
+ | `@squoosh-kit/qoi` | [![npm](https://badge.fury.io/js/%40squoosh-kit%2Fqoi.svg)](https://www.npmjs.com/package/@squoosh-kit/qoi) |
109
+ | `@squoosh-kit/resize` | [![npm](https://badge.fury.io/js/%40squoosh-kit%2Fresize.svg)](https://www.npmjs.com/package/@squoosh-kit/resize) |
110
+ | `@squoosh-kit/rotate` | [![npm](https://badge.fury.io/js/%40squoosh-kit%2Frotate.svg)](https://www.npmjs.com/package/@squoosh-kit/rotate) |
111
+ | `@squoosh-kit/oxipng` | [![npm](https://badge.fury.io/js/%40squoosh-kit%2Foxipng.svg)](https://www.npmjs.com/package/@squoosh-kit/oxipng) |
112
+ | `@squoosh-kit/imagequant` | [![npm](https://badge.fury.io/js/%40squoosh-kit%2Fimagequant.svg)](https://www.npmjs.com/package/@squoosh-kit/imagequant) |
113
+ | `@squoosh-kit/hqx` | [![npm](https://badge.fury.io/js/%40squoosh-kit%2Fhqx.svg)](https://www.npmjs.com/package/@squoosh-kit/hqx) |
114
+ | `@squoosh-kit/visdif` | [![npm](https://badge.fury.io/js/%40squoosh-kit%2Fvisdif.svg)](https://www.npmjs.com/package/@squoosh-kit/visdif) |
115
+ | `@squoosh-kit/runtime` | [![npm](https://badge.fury.io/js/%40squoosh-kit%2Fruntime.svg)](https://www.npmjs.com/package/@squoosh-kit/runtime) |
116
+ | `@squoosh-kit/vite-plugin` | [![npm](https://badge.fury.io/js/%40squoosh-kit%2Fvite-plugin.svg)](https://www.npmjs.com/package/@squoosh-kit/vite-plugin) |
85
117
 
86
- All functions follow the same patterns as the individual packages. For detailed documentation, see:
118
+ ## API Reference
87
119
 
88
- - [WebP Encoding API](../webp) - Advanced encoding options and examples
89
- - [Resize API](../resize) - Resizing algorithms and configuration details
120
+ All functions follow the same patterns as the individual packages. For detailed documentation including options, examples, and edge cases, see the individual package READMEs:
121
+
122
+ - [WebP](https://www.npmjs.com/package/@squoosh-kit/webp) — `encode`, `decode`, `createWebpEncoder`, `createWebpDecoder`
123
+ - [AVIF](https://www.npmjs.com/package/@squoosh-kit/avif) — `encode`, `decode`, `createAvifEncoder`, `createAvifDecoder`, `AVIFTune`
124
+ - [MozJPEG](https://www.npmjs.com/package/@squoosh-kit/mozjpeg) — `encode`, `decode`, `createMozjpegEncoder`, `createMozjpegDecoder`
125
+ - [JPEG XL](https://www.npmjs.com/package/@squoosh-kit/jxl) — `encode`, `decode`, `createJxlEncoder`, `createJxlDecoder`
126
+ - [WP2](https://www.npmjs.com/package/@squoosh-kit/wp2) — `encode`, `decode`, `createWp2Encoder`, `createWp2Decoder`, `UVMode`, `Csp`
127
+ - [PNG](https://www.npmjs.com/package/@squoosh-kit/png) — `encode`, `decode`, `createPngEncoder`, `createPngDecoder`
128
+ - [QOI](https://www.npmjs.com/package/@squoosh-kit/qoi) — `encode`, `decode`, `createQoiEncoder`, `createQoiDecoder`
129
+ - [Resize](https://www.npmjs.com/package/@squoosh-kit/resize) — `resize`, `createResizer`
130
+ - [Rotate](https://www.npmjs.com/package/@squoosh-kit/rotate) — `rotate`, `createRotator`
131
+ - [OxiPNG](https://www.npmjs.com/package/@squoosh-kit/oxipng) — `optimize`, `createOxipngOptimizer`
132
+ - [ImageQuant](https://www.npmjs.com/package/@squoosh-kit/imagequant) — `quantize`, `createImagequantQuantizer`
133
+ - [HQX](https://www.npmjs.com/package/@squoosh-kit/hqx) — `upscale`, `createHqxUpscaler`
134
+ - [VisDif](https://www.npmjs.com/package/@squoosh-kit/visdif) — `compare`, `createVisDiff`
90
135
 
91
136
  ## License
92
137
 
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@squoosh-kit/core",
3
- "version": "0.2.2",
3
+ "version": "0.2.4",
4
4
  "type": "module",
5
5
  "description": "Per-feature adapters around Squoosh codecs, worker/client runtimes.",
6
6
  "author": "Bartosz Nowak <bnowak008@gmail.com>",
@@ -62,19 +62,19 @@
62
62
  "typecheck": "tsc --noEmit"
63
63
  },
64
64
  "dependencies": {
65
- "@squoosh-kit/webp": "workspace:*",
66
- "@squoosh-kit/resize": "workspace:*",
67
- "@squoosh-kit/runtime": "workspace:*",
68
- "@squoosh-kit/avif": "workspace:*",
69
- "@squoosh-kit/mozjpeg": "workspace:*",
70
- "@squoosh-kit/jxl": "workspace:*",
71
- "@squoosh-kit/oxipng": "workspace:*",
72
- "@squoosh-kit/imagequant": "workspace:*",
73
- "@squoosh-kit/png": "workspace:*",
74
- "@squoosh-kit/qoi": "workspace:*",
75
- "@squoosh-kit/wp2": "workspace:*",
76
- "@squoosh-kit/hqx": "workspace:*",
77
- "@squoosh-kit/rotate": "workspace:*",
78
- "@squoosh-kit/visdif": "workspace:*"
65
+ "@squoosh-kit/webp": "0.2.4",
66
+ "@squoosh-kit/resize": "0.2.4",
67
+ "@squoosh-kit/runtime": "0.2.4",
68
+ "@squoosh-kit/avif": "0.2.4",
69
+ "@squoosh-kit/mozjpeg": "0.2.4",
70
+ "@squoosh-kit/jxl": "0.2.4",
71
+ "@squoosh-kit/oxipng": "0.2.4",
72
+ "@squoosh-kit/imagequant": "0.2.4",
73
+ "@squoosh-kit/png": "0.2.4",
74
+ "@squoosh-kit/qoi": "0.2.4",
75
+ "@squoosh-kit/wp2": "0.2.4",
76
+ "@squoosh-kit/hqx": "0.2.4",
77
+ "@squoosh-kit/rotate": "0.2.4",
78
+ "@squoosh-kit/visdif": "0.2.4"
79
79
  }
80
80
  }