Skip to main content


Cornerstone is a set of JavaScript libraries that can be used to build web-based medical imaging applications. It provides a framework to build radiology applications such as the OHIF Viewer.

This library, @cornerstonejs/core, provides CPU and GPU-based rendering support, image/volume loading API, and caching utilities.

You can find the Cornerstone documentation on the website.




Renames and re-exports Events


Renames and re-exports requestPoolManager




cache: Cache = ...

This module deals with Caching of images and volumes The cache has two main components: a volatile portion for images and a non-volatile portion for volumes. Individual 2D images are volatile and will be replaced by new images hitting the cache. When you allocate volumes, these are non-volatile and reserve a block of memory from the cache. Volumes must be released manually. We will have a shared block of memory allocated for the entire cache, e.g. 1GB which will be shared for images and volumes.

When a new image is added: We check if there is enough unallocated + volatile space for the single image

if so

  • We allocate the image in image cache, and if necessary oldest images are decached to match the maximumCacheSize criteria
  • If a volume contains that imageId, copy it over using TypedArray’s set method. If no volumes contain the imageId, the image is fetched by image loaders

If not (cache is mostly/completely full with volumes)

  • throw that the cache does not have enough working space to allocate the image

When a new volume is added: Check if there is enough unallocated + volatile space to allocate the volume:

If so:

  • Decache oldest images which won’t be included in this volume until we have enough free space for the volume
  • If not enough space from previous space, decache images that will be included in the volume until we have enough free space (These will need to be re-fetched, but we must do this not to straddle over the given memory limit, even for a short time, as this may crash the app)
  • At this point, if any of the frames (indexed by imageId) are present in the volatile image cache, copy these over to the volume now

If not (cache is mostly/completely full with volumes),

  • throw that the cache does not have enough working space to allocate the volume.


eventTarget: CornerstoneEventTarget = ...

EventTarget - Provides the EventTarget interface


imageRetrievalPoolManager: RequestPoolManager = ...

ImageRetrievalPoolManager You don’t need to directly use the imageRetrievalPoolManager to load images since the imageLoadPoolManager will automatically use it for retrieval. However, maximum number of concurrent requests can be set by calling setMaxConcurrentRequests.

Retrieval (usually) === XHR requests


requestPoolManager: RequestPoolManager = ...

You can use the imageLoadPoolManager to load images, by providing a requestFn that returns a promise for the image. You can provide a type to specify the type of request (interaction, thumbnail, prefetch), and you can provide additional details that will be passed to the requestFn. Below is an example of a requestFn that loads an image from an imageId:

const priority = -5
const requestType = RequestType.Interaction
const additionalDetails = { imageId }
const options = {
targetBuffer: {
type: 'Float32Array',
offset: null,
length: null,
preScale: {

loadAndCacheImage(imageId, options).then(() => { // set on viewport}),