JavaScript Library
Introduction
The Runware JavaScript SDK provides a high-performance WebSocket-based interface built for modern web applications requiring AI-powered media processing. Unlike traditional REST APIs that require establishing new connections for each request, the SDK maintains persistent connections that improve performance for applications requiring multiple operations or real-time feedback.
The SDK handles all the complexity of connection management, authentication, and error recovery while exposing Runware's complete feature set through an intuitive Promise-based API.
Key SDK benefits
Performance advantages
Reduced latency is achieved by eliminating the connection establishment overhead that occurs with each HTTP request. In applications performing multiple operations, this can significantly reduce total processing time compared to REST-based approaches.
Progressive result delivery allows your application to display completed results immediately as they finish, rather than waiting for entire batches. This creates a more responsive user experience, particularly valuable when generating multiple variations or conducting iterative workflows.
Reliability features
Automatic resilience ensures your application remains functional even when network conditions change. The SDK detects connection issues and re-establishes connectivity transparently, queuing operations during brief disconnections and resuming when connectivity returns.
Concurrent operation efficiency leverages the persistent connection to handle multiple simultaneous requests without connection overhead. This makes the SDK particularly effective for applications that need to perform different types of operations simultaneously.
When to choose the JavaScript SDK
The JavaScript SDK is optimal for applications that prioritize performance and real-time feedback. Consider this SDK when your application needs to perform multiple operations frequently, provide immediate user feedback during processing, or integrate AI capabilities as a core interactive feature rather than an occasional utility.
Installation
Install the SDK using your preferred package manager:
npm install @runware/sdk-js
Or using Yarn:
yarn add @runware/sdk-js
Basic setup
Get your API key from the Runware dashboard and initialize the SDK directly:
import { Runware } from "@runware/sdk-js";
const runware = new Runware({ apiKey: "your-api-key-here" });
const images = await runware.requestImages({
positivePrompt: "A serene mountain landscape at sunset",
model: "runware:101@1",
width: 1024,
height: 1024,
});
console.log('Generated image:', images[0].imageURL);
The SDK automatically handles connection establishment, authentication, and response formatting, allowing you to focus on your application logic rather than infrastructure concerns.
Initialization patterns
Synchronous initialization
The standard pattern creates the SDK instance immediately and establishes connections on-demand:
import { Runware } from "@runware/sdk-js";
const runware = new Runware({
apiKey: "your-api-key-here",
shouldReconnect: true,
globalMaxRetries: 3,
});
// Connection established automatically on first request
const images = await runware.requestImages({
positivePrompt: "A bustling city street at night",
model: "runware:101@1",
width: 1024,
height: 1024,
});
This approach is ideal for most applications because it's simple and the connection is established when needed.
Asynchronous initialization
For applications requiring guaranteed connection readiness before proceeding:
const runware = await Runware.initialize({
apiKey: "your-api-key-here",
timeoutDuration: 60000,
});
// Connection is established and ready
const images = await runware.requestImages({
positivePrompt: "Professional headshot portrait",
model: "runware:101@1",
width: 1024,
height: 1024,
});
// Clean shutdown when application terminates
await runware.disconnect();
This pattern is useful when you need to ensure connection establishment before performing operations, such as in server applications or when you want to handle connection errors upfront.
Manual connection control
For applications requiring explicit connection lifecycle management:
const runware = new Runware({ apiKey: "your-api-key-here" });
// Explicitly ensure connection is ready
await runware.ensureConnection();
// Perform operations with guaranteed connection
const images = await runware.requestImages({
positivePrompt: "Professional headshot portrait",
model: "runware:101@1",
width: 1024,
height: 1024,
});
// Clean shutdown when application terminates
await runware.disconnect();
The ensureConnection()
method guarantees that the WebSocket connection is established before proceeding, while disconnect()
provides clean connection termination.
Progressive result delivery
One of the SDK's most powerful features is progressive result delivery, which allows you to receive completed images immediately as they finish generating rather than waiting for entire batches:
const images = await runware.requestImages({
positivePrompt: "A collection of architectural sketches",
model: "runware:101@1",
width: 1024,
height: 1024,
numberResults: 5,
onPartialImages: (partialImages, error) => {
if (error) {
console.error('Generation error:', error);
return;
}
// Update UI immediately as each image completes
partialImages.forEach((image, index) => {
displayImage(image.imageURL);
updateProgress(partialImages.length, 5);
});
},
});
console.log('All images completed');
The progressive delivery pattern enables user experiences where users can see completed results immediately rather than waiting for entire batches to finish.
The onPartialImages
callback receives arrays of completed images as they become available.
Concurrent operations
The SDK's WebSocket architecture excels at handling multiple simultaneous operations without the connection overhead typical of HTTP-based approaches:
const runware = new Runware({ apiKey: "your-api-key-here" });
// Execute completely different operations simultaneously
const [
generatedImages,
upscaledImage,
backgroundRemoved,
imageCaption,
] = await Promise.all([
runware.requestImages({
positivePrompt: "Abstract digital art",
numberResults: 3,
width: 1024,
height: 1024,
}),
runware.upscaleGan({
inputImage: "some-uuid",
upscaleFactor: 4,
}),
runware.removeImageBackground({
inputImage: "some-uuid",
}),
runware.requestImageToText({
inputImage: "some-uuid",
}),
]);
This concurrent execution capability is particularly powerful for workflow automation or batch processing.
Configuration options
The SDK accepts several configuration options that control connection behavior and default settings:
const runware = new Runware({
apiKey: "your-api-key-here",
// Connection management
shouldReconnect: true, // Enable automatic reconnection (default: true)
globalMaxRetries: 3, // Default retry attempts for all requests (default: 2)
timeoutDuration: 90000, // Timeout in milliseconds (default: 60000)
// Custom WebSocket endpoint (optional)
url: "wss://custom-endpoint.com/v1",
});
The shouldReconnect option enables automatic reconnection when WebSocket connections are lost, which is essential for maintaining reliability in web applications where network conditions can vary.
globalMaxRetries sets the default number of retry attempts for all requests. Individual requests can override this setting using their own retry
parameter.
timeoutDuration controls how long the SDK waits for responses before timing out operations. This is particularly important for complex generations that may take longer to complete.
Error handling
The SDK provides error information to help you handle failures appropriately:
try {
const images = await runware.requestImages({
positivePrompt: "A detailed architectural rendering",
model: "runware:101@1",
width: 1024,
height: 1024,
steps: 50,
});
// Process successful results
console.log('Generated images:', images);
} catch (error) {
// Error information available for debugging and user feedback
console.error('Generation failed:', {
message: error.message,
taskUUID: error.taskUUID
});
// Handle the error appropriately for your application
showErrorMessage(error.message);
}
When using progressive result delivery, errors can occur during the generation process:
const images = await runware.requestImages({
positivePrompt: "A series of landscape photographs",
numberResults: 8,
width: 1024,
height: 1024,
onPartialImages: (partialImages, error) => {
if (error) {
console.error('Generation error:', error);
// Some images may have succeeded before the error
if (partialImages.length > 0) {
console.log(`Partial success: ${partialImages.length} images completed`);
processPartialResults(partialImages);
}
return;
}
// Normal progress
updateProgressBar(partialImages.length, 8);
displayResults(partialImages);
}
});
The onPartialImages
callback receives both successful partial results and any errors that occur, allowing you to handle partial successes gracefully.
Per-request configuration
Individual requests can override global SDK settings for specific needs:
const images = await runware.requestImages({
positivePrompt: "Ultra-detailed fantasy artwork",
model: "runware:101@1",
width: 1024,
height: 1024,
// Override global settings for this specific request
retry: 5, // More retries for important operations
includeCost: true, // Include cost information in response
onPartialImages: (partial) => {
// Custom progress handling for this specific request
updateSpecializedUI(partial);
},
});
The retry
parameter allows you to specify different retry behavior for individual requests, while includeCost
adds cost information to the response when needed. Each request can also have its own onPartialImages
callback for customized progress handling.
TypeScript support
The SDK includes TypeScript definitions that provide compile-time type checking and IntelliSense support:
import {
Runware,
IImageInference,
IImage,
IError,
ETaskType,
} from "@runware/sdk-js";
const runware = new Runware({ apiKey: "your-api-key-here" });
// Type-safe request parameters
const requestParams: IImageInference = {
positivePrompt: "A professional product photograph",
model: "runware:101@1",
width: 1024,
height: 1024,
steps: 30,
};
// Fully typed responses
const images: IImage[] = await runware.requestImages(requestParams);
// Type-safe error handling
const handleStreamingError = (
partialImages: IImage[],
error: IError | null
) => {
if (error) {
console.error(`Task ${error.taskUUID} failed: ${error.message}`);
}
};
TypeScript support extends to all SDK methods, configuration options, and response types, enabling better development experience and reduced runtime errors in production applications.