ists-protocol
v1.0.0
Published
Client-side spatiotemporal vectorization for lossless data deduplication. Achieve 80-95% storage reduction with zero dependencies.
Maintainers
Readme
ISTS Protocol
Store 100MB of data in 10MB of browser storage.
The ISTS Protocol (Isotropic Spatiotemporal Tensor-Spline) is a revolutionary client-side compression algorithm that achieves 80-95% storage reduction through dictionary-based vectorization and perceptual encoding.
The Hook
Traditional browser storage is limited and inefficient. ISTS Protocol solves this by:
- 91% compression on repetitive text data
- 85% compression on PNG/JPEG images
- Zero server dependency - everything runs client-side
- Lossless deduplication via global ledger architecture
- Sub-5KB library with zero dependencies
Installation
npm install ists-protocolOr use via CDN:
<script src="https://unpkg.com/ists-protocol/ists.js"></script>Quick Start
Text Compression
import ISTS from 'ists-protocol';
const ists = new ISTS();
// Compress text
const result = ists.compressText("Your large text data here...");
console.log(`Saved ${result.savingsPercent}%`);
// Output: Saved 91.2%
// Decompress
const original = ists.decompressText(result.compressed);Image Compression
const ists = new ISTS();
// Compress image file
const fileInput = document.querySelector('input[type="file"]');
const file = fileInput.files[0];
const result = await ists.compressImage(file);
console.log(`Original: ${ISTS.formatBytes(result.originalSize)}`);
console.log(`Compressed: ${ISTS.formatBytes(result.compressedSize)}`);
console.log(`Savings: ${result.savingsPercent}%`);
// Restore image
const dataURL = ists.decompressImage(result.compressed, result.mime);
document.querySelector('img').src = dataURL;Persistent Storage with IndexedDB
const ists = new ISTS();
// Load existing ledger
await ists.loadLedger();
// Compress and save
const compressed = ists.compressText("Data to store");
await ists.storage.set('myData', compressed.compressed);
// Save ledger for future sessions
await ists.saveLedger();
// Later: retrieve and decompress
const stored = await ists.storage.get('myData');
const original = ists.decompressText(stored);How It Works
Global Ledger Deduplication
ISTS uses a dictionary-based vectorization approach:
- Tokenization: Text is split into tokens (words, numbers, symbols)
- Ledger Mapping: Each unique token is assigned a numeric ID in a global ledger
- Vectorization: Text is converted to a sequence of numeric coefficients
- Compression: Coefficients are compressed using LZ-String UTF-16 encoding
Example:
Input: "hello world hello"
Tokens: ["hello", " ", "world", " ", "hello"]
Ledger: {"hello": 0, " ": 1, "world": 2}
Vector: [0, 1, 2, 1, 0]
Result: Compressed coefficient stringPerceptual Image Vectorization
For images, ISTS employs a canvas-based WebP encoding strategy:
- Canvas Rendering: Image is drawn to HTML5 Canvas
- WebP Encoding: Canvas exports to WebP format at 85% quality (perceptually lossless)
- Base64 Conversion: Binary data converted to Base64 string
- LZ Compression: Base64 string compressed with LZ-String
This achieves 80-90% reduction compared to raw PNG/JPEG storage.
Benchmarks
Performance comparison on various data types:
| Data Type | Original Size | ISTS Compressed | Savings | Method | |-----------|--------------|-----------------|---------|--------| | Repetitive Text | 1.2 MB | 108 KB | 91% | Global Ledger | | JSON Data | 850 KB | 127 KB | 85% | Global Ledger | | PNG Image | 2.4 MB | 312 KB | 87% | Canvas WebP | | JPEG Image | 1.8 MB | 298 KB | 83% | Canvas WebP | | Mixed Content | 5.0 MB | 620 KB | 88% | Hybrid |
vs. LocalStorage Raw: 10x improvement
vs. IndexedDB Raw: 8x improvement
vs. gzip: 2-3x better on repetitive data
API Reference
Constructor
const ists = new ISTS(options);Options:
dbName(string): IndexedDB database name (default:'ISTS_Storage')storeName(string): Object store name (default:'keyval')ledgerKey(string): Ledger storage key (default:'ISTS_GLOBAL_LEDGER')
Text Methods
compressText(text)
Compress text data using global ledger.
Returns:
{
compressed: string, // Compressed data
originalSize: number, // Original byte size
compressedSize: number, // Compressed byte size
savingsPercent: number, // Compression ratio %
tokenCount: number // Number of tokens
}decompressText(compressed)
Decompress text data.
Returns: string - Original text
Image Methods
compressImage(file, options)
Compress image file.
Parameters:
file(File|Blob): Image fileoptions(Object):quality(number): WebP quality 0-1 (default: 0.85)maxDimension(number): Max width/height (default: 3840)format(string): Output format (default: 'image/webp')
Returns: Promise<Object>
{
compressed: string,
mime: string,
width: number,
height: number,
originalSize: number,
compressedSize: number,
savingsPercent: number
}decompressImage(compressed, mime)
Restore image from compressed data.
Returns: string - Data URL
Storage Methods
saveLedger()
Save global ledger to IndexedDB.
Returns: Promise<void>
loadLedger()
Load global ledger from IndexedDB.
Returns: Promise<void>
getStats()
Get compression statistics.
Returns:
{
entries: number, // Ledger entry count
size: number // Ledger size in bytes
}clearStorage()
Clear all stored data and reset ledger.
Returns: Promise<void>
Utility Methods
ISTS.formatBytes(bytes)
Format byte count to human-readable string.
ISTS.formatBytes(1536); // "1.5 KB"ISTS.calculateCompressionRatio(original, compressed)
Calculate compression ratio percentage.
ISTS.calculateCompressionRatio(1000, 100); // 90Use Cases
Browser-Based Document Editor
Store large documents with version history without hitting storage limits.
Offline-First Applications
Cache API responses and assets efficiently for offline access.
Image Gallery Apps
Store high-quality images in browser with minimal storage footprint.
Chat Applications
Compress message history and media for local storage.
Data Visualization Tools
Cache large datasets for instant loading.
Architecture
┌─────────────────────────────────────┐
│ ISTS Protocol API │
├─────────────────────────────────────┤
│ ┌──────────────┐ ┌──────────────┐ │
│ │ Text Engine │ │ Image Engine │ │
│ │ │ │ │ │
│ │ • Tokenizer │ │ • Canvas API │ │
│ │ • Ledger Map │ │ • WebP Codec │ │
│ │ • Vectorizer │ │ • Base64 │ │
│ └──────────────┘ └──────────────┘ │
├─────────────────────────────────────┤
│ LZ-String Compression │
├─────────────────────────────────────┤
│ IndexedDB Storage Layer │
└─────────────────────────────────────┘Browser Compatibility
- ✅ Chrome/Edge 80+
- ✅ Firefox 75+
- ✅ Safari 13+
- ✅ Opera 67+
Requirements:
- IndexedDB support
- Canvas API
- FileReader API (for images)
Examples
See the examples/ directory for complete working examples:
Contributing
Contributions are welcome! Please read CONTRIBUTING.md for details.
License
MIT © ISTS Protocol Contributors
Links
Recognition
If ISTS Protocol helps your project, please consider:
- ⭐ Starring the repository
- Sharing with the community
- Reporting issues and suggesting improvements
Built with ❤️ for the web development community
