Crispix JavaScript SDK & Free Client API for Developers

Crispix offers a 100% free, client-side JavaScript SDK that allows developers to run state-of-the-art AI image upscaling and enhancement directly in the user’s browser.

No API keys, no monthly fees, and zero server GPU costs for your infrastructure.

Key Features

• Zero Server Compute: Processing runs on the client’s device using WebGPU (with automatic fallback to WASM/CPU).
• 100% Private: User images are processed in-memory and never sent to any external server.
• No API Key Required: Free to integrate into any web application or workflow.
• Multiple AI Models: Real-ESRGAN General (photos) & Real-ESRGAN Anime.

Quick Start

1. Include SDK in your Web App

You can import the SDK directly as an ES module:

import { CrispixSDK } from 'https://crispix.nibies.space/sdk.js';

// Initialize SDK pointing to Crispix model assets
const crispix = new CrispixSDK({
  baseUrl: 'https://crispix.nibies.space'
});

Or preload the AI model in the background:

// Preload model cache
await crispix.preload('general');

Usage Examples

Upscale Image from File Input / Blob

const fileInput = document.querySelector('input[type="file"]');

fileInput.addEventListener('change', async (e) => {
  const file = e.target.files[0];
  if (!file) return;

  console.log('Upscaling image...');

  const result = await crispix.enhance(file, {
    model: 'general', // 'general' | 'anime'
    scale: 4,         // 2 | 4
    filters: {
      sharpen: 15,
      denoise: 10
    },
    outputFormat: 'image/png', // 'image/png' | 'image/jpeg' | 'image/webp'
    onProgress: (percent) => {
      console.log(`Progress: ${Math.round(percent * 100)}%`);
    }
  });

  console.log(`Finished using ${result.backend} (Width: ${result.width}, Height: ${result.height})`);

  // Display or download
  const imgElement = document.getElementById('preview');
  imgElement.src = result.dataUrl;
});

API Reference

new CrispixSDK(options)

• options.baseUrl (optional): URL where model files are hosted (default: current origin or https://crispix.nibies.space).

crispix.enhance(blob, options)

• blob: Blob or File of the input image.
• options:
  • model: 'general' (default) or 'anime'.
  • scale: 4 (default) or 2.
  • filters: Object { denoise, sharpen, brightness, contrast, saturation, autoLevels }.
  • outputFormat: 'image/png' (default), 'image/jpeg', 'image/webp'.
  • quality: JPEG/WebP quality between 0 and 1 (default 0.92).
  • onProgress: Callback receiving float from 0 to 1.
  • signal: AbortSignal for cancellation.

Returns: Promise<EnhanceResult>

interface EnhanceResult {
  blob: Blob;
  dataUrl: string;
  width: number;
  height: number;
  backend: 'webgpu' | 'wasm';
}