@huggingface/transformers 4.0.0-next.0 → 4.0.0-next.10

package/src/utils/cache.js

@@ -1,12 +1,16 @@
 import { apis, env } from '../env.js';
-import { FileCache } from './hub/files.js';
+import { FileCache } from './cache/FileCache.js';
+import { logger } from './logger.js';
+import { CrossOriginStorage } from './cache/CrossOriginStorageCache.js';
 
 /**
  * @typedef {Object} CacheInterface
- * @property {(request: string) => Promise<Response|import('./hub/files.js').FileResponse|undefined|string>} match
+ * @property {(request: string) => Promise<Response|import('./hub/FileResponse.js').FileResponse|undefined|string>} match
  * Checks if a request is in the cache and returns the cached response if found.
  * @property {(request: string, response: Response, progress_callback?: (data: {progress: number, loaded: number, total: number}) => void) => Promise<void>} put
  * Adds a response to the cache.
+ * @property {(request: string) => Promise<boolean>} [delete]
+ * Deletes a request from the cache. Returns true if deleted, false otherwise.
  */
 
 /**
@@ -35,6 +39,10 @@ export async function getCache(file_cache_dir = null) {
         cache = env.customCache;
     }
 
+    if (!cache && env.experimental_useCrossOriginStorage && CrossOriginStorage.isAvailable()) {
+        cache = new CrossOriginStorage();
+    }
+
     if (!cache && env.useBrowserCache) {
         if (typeof caches === 'undefined') {
             throw Error('Browser cache is not available in this environment.');
@@ -47,7 +55,7 @@ export async function getCache(file_cache_dir = null) {
             // So, instead of crashing, we just ignore the error and continue without using the cache.
             cache = await caches.open(env.cacheKey);
         } catch (e) {
-            console.warn('An error occurred while opening the browser cache:', e);
+            logger.warn('An error occurred while opening the browser cache:', e);
         }
     }
 
@@ -67,7 +75,7 @@ export async function getCache(file_cache_dir = null) {
  * Searches the cache for any of the provided names and returns the first match found.
  * @param {CacheInterface} cache The cache to search
  * @param {...string} names The names of the items to search for
- * @returns {Promise<import('./hub/files.js').FileResponse|Response|undefined|string>} The item from the cache, or undefined if not found.
+ * @returns {Promise<import('./hub/FileResponse.js').FileResponse|Response|undefined|string>} The item from the cache, or undefined if not found.
  */
 export async function tryCache(cache, ...names) {
     for (let name of names) {

package/src/utils/core.js

@@ -31,6 +31,28 @@
  * @property {number} total The total number of bytes to be loaded.
  */
 
+/**
+ * @typedef {Object} FileLoadingProgress
+ * @property {number} loaded The number of bytes loaded for this file.
+ * @property {number} total The total number of bytes for this file.
+ */
+
+/**
+ * @typedef {Record<string, FileLoadingProgress>} FilesLoadingMap
+ * A mapping of file names to their loading progress. Each key is a file path and each value contains
+ * the loaded and total bytes for that file.
+ */
+
+/**
+ * @typedef {Object} TotalProgressInfo
+ * @property {'progress_total'} status
+ * @property {string} name The model id or directory path.
+ * @property {number} progress A number between 0 and 100.
+ * @property {number} loaded The number of bytes loaded.
+ * @property {number} total The total number of bytes to be loaded.
+ * @property {FilesLoadingMap} files A mapping of file names to their loading progress.
+ */
+
 /**
  * @typedef {Object} DoneProgressInfo
  * @property {'done'} status
@@ -46,7 +68,7 @@
  */
 
 /**
- * @typedef {InitiateProgressInfo | DownloadProgressInfo | ProgressStatusInfo | DoneProgressInfo | ReadyProgressInfo} ProgressInfo
+ * @typedef {InitiateProgressInfo | DownloadProgressInfo | ProgressStatusInfo | DoneProgressInfo | ReadyProgressInfo | TotalProgressInfo} ProgressInfo
  */
 
 /**

package/src/utils/devices.js

@@ -1,3 +1,5 @@
+import { apis } from '../env.js';
+
 /**
  * The list of devices supported by Transformers.js
  */
@@ -16,7 +18,27 @@ export const DEVICE_TYPES = Object.freeze({
     'webnn-gpu': 'webnn-gpu', // WebNN GPU
     'webnn-cpu': 'webnn-cpu', // WebNN CPU
 });
+const DEFAULT_DEVICE = apis.IS_NODE_ENV ? 'cpu' : 'wasm';
 
 /**
  * @typedef {keyof typeof DEVICE_TYPES} DeviceType
  */
+
+/**
+ * Resolves a device configuration value to a concrete device string.
+ * Handles string, per-file object, or undefined config, with a default fallback.
+ * @param {string|Record<string, string>|null|undefined} deviceConfig The device config value.
+ * @param {string} fileName The model file name to look up if deviceConfig is an object.
+ * @param {Object} [options]
+ * @param {(message: string) => void} [options.warn] Optional callback invoked when deviceConfig is a per-file object but fileName is not found.
+ * @returns {string} The resolved device string.
+ */
+export function selectDevice(deviceConfig, fileName, { warn } = {}) {
+    if (!deviceConfig) return DEFAULT_DEVICE;
+    if (typeof deviceConfig === 'string') return deviceConfig;
+    if (deviceConfig.hasOwnProperty(fileName)) return deviceConfig[fileName];
+    if (warn) {
+        warn(`device not specified for "${fileName}". Using the default device (${DEFAULT_DEVICE}).`);
+    }
+    return DEFAULT_DEVICE;
+}

package/src/utils/dtypes.js

@@ -45,6 +45,7 @@ export const DATA_TYPES = Object.freeze({
 });
 /** @typedef {keyof typeof DATA_TYPES} DataType */
 
+export const DEFAULT_DEVICE_DTYPE = DATA_TYPES.fp32;
 export const DEFAULT_DEVICE_DTYPE_MAPPING = Object.freeze({
     // NOTE: If not specified, will default to fp32
     [DEVICE_TYPES.wasm]: DATA_TYPES.q8,
@@ -62,6 +63,60 @@ export const DEFAULT_DTYPE_SUFFIX_MAPPING = Object.freeze({
     [DATA_TYPES.bnb4]: '_bnb4',
 });
 
+/**
+ * Resolves a dtype configuration value to a concrete dtype string.
+ * Handles string, per-file object, and "auto" forms with device-based fallback.
+ * @param {DataType|Record<string, DataType>|null|undefined} dtype The dtype config value.
+ * @param {string} fileName The model file name to look up if dtype is an object.
+ * @param {string} selectedDevice The resolved device string for fallback.
+ * @param {Object} [options]
+ * @param {DataType|Record<string, DataType>|null} [options.configDtype=null] Config dtype used as fallback when dtype is "auto" (supports device_config overlay in session.js).
+ * @param {(message: string) => void} [options.warn] Optional callback invoked when dtype is a per-file object but fileName is not found.
+ * @returns {DataType} The resolved dtype string.
+ */
+export function selectDtype(dtype, fileName, selectedDevice, { configDtype = null, warn } = {}) {
+    /** @type {string|null|undefined} */
+    let resolved;
+    let needsWarn = false;
+    if (dtype && typeof dtype !== 'string') {
+        if (dtype.hasOwnProperty(fileName)) {
+            resolved = dtype[fileName];
+        } else {
+            resolved = null;
+            needsWarn = true;
+        }
+    } else {
+        resolved = /** @type {string|null|undefined} */ (dtype);
+    }
+
+    /** @type {DataType} */
+    let result;
+
+    // Handle 'auto': try configDtype fallback
+    if (resolved === DATA_TYPES.auto) {
+        if (configDtype) {
+            const fallback = typeof configDtype === 'string' ? configDtype : configDtype?.[fileName];
+            if (fallback && fallback !== DATA_TYPES.auto && DATA_TYPES.hasOwnProperty(fallback)) {
+                return /** @type {DataType} */ (fallback);
+            }
+        }
+        result = DEFAULT_DEVICE_DTYPE_MAPPING[selectedDevice] ?? DEFAULT_DEVICE_DTYPE;
+    } else if (resolved && DATA_TYPES.hasOwnProperty(resolved)) {
+        // Valid known dtype
+        result = /** @type {DataType} */ (resolved);
+    } else {
+        // Fallback to device default
+        result = DEFAULT_DEVICE_DTYPE_MAPPING[selectedDevice] ?? DEFAULT_DEVICE_DTYPE;
+    }
+
+    if (needsWarn && warn) {
+        warn(
+            `dtype not specified for "${fileName}". Using the default dtype (${result}) for this device (${selectedDevice}).`,
+        );
+    }
+    return result;
+}
+
 export const DataTypeMap = Object.freeze({
     float32: Float32Array,
     // @ts-ignore ts(2552) Limited availability of Float16Array across browsers:

package/src/utils/hub/{files.js → FileResponse.js}

@@ -1,5 +1,4 @@
 import fs from 'node:fs';
-import path from 'node:path';
 
 /**
  * Mapping from file extensions to MIME types.
@@ -120,92 +119,3 @@ export class FileResponse {
         return JSON.parse(await this.text());
     }
 }
-
-/**
- * File system cache implementation that implements the CacheInterface.
- * Provides `match` and `put` methods compatible with the Web Cache API.
- */
-export class FileCache {
-    /**
-     * Instantiate a `FileCache` object.
-     * @param {string} path
-     */
-    constructor(path) {
-        this.path = path;
-    }
-
-    /**
-     * Checks whether the given request is in the cache.
-     * @param {string} request
-     * @returns {Promise<FileResponse | undefined>}
-     */
-    async match(request) {
-        let filePath = path.join(this.path, request);
-        let file = new FileResponse(filePath);
-
-        if (file.exists) {
-            return file;
-        } else {
-            return undefined;
-        }
-    }
-
-    /**
-     * Adds the given response to the cache.
-     * @param {string} request
-     * @param {Response} response
-     * @param {(data: {progress: number, loaded: number, total: number}) => void} [progress_callback] Optional.
-     * The function to call with progress updates
-     * @returns {Promise<void>}
-     */
-    async put(request, response, progress_callback = undefined) {
-        let filePath = path.join(this.path, request);
-
-        try {
-            const contentLength = response.headers.get('Content-Length');
-            const total = parseInt(contentLength ?? '0');
-            let loaded = 0;
-
-            await fs.promises.mkdir(path.dirname(filePath), { recursive: true });
-            const fileStream = fs.createWriteStream(filePath);
-            const reader = response.body.getReader();
-
-            while (true) {
-                const { done, value } = await reader.read();
-                if (done) {
-                    break;
-                }
-
-                await new Promise((resolve, reject) => {
-                    fileStream.write(value, (err) => {
-                        if (err) {
-                            reject(err);
-                            return;
-                        }
-                        resolve();
-                    });
-                });
-
-                loaded += value.length;
-                const progress = total ? (loaded / total) * 100 : 0;
-
-                progress_callback?.({ progress, loaded, total });
-            }
-
-            fileStream.close();
-        } catch (error) {
-            // Clean up the file if an error occurred during download
-            try {
-                await fs.promises.unlink(filePath);
-            } catch {}
-            throw error;
-        }
-    }
-
-    // TODO add the rest?
-    // addAll(requests: RequestInfo[]): Promise<void>;
-    // delete(request: RequestInfo | URL, options?: CacheQueryOptions): Promise<boolean>;
-    // keys(request?: RequestInfo | URL, options?: CacheQueryOptions): Promise<ReadonlyArray<Request>>;
-    // match(request: RequestInfo | URL, options?: CacheQueryOptions): Promise<Response | undefined>;
-    // matchAll(request?: RequestInfo | URL, options?: CacheQueryOptions): Promise<ReadonlyArray<Response>>;
-}

package/src/utils/hub/utils.js

@@ -1,4 +1,5 @@
 import { ERROR_MAPPING, REPO_ID_REGEX } from './constants.js';
+import { logger } from '../logger.js';
 
 /**
  * Joins multiple parts of a path into a single path, while handling leading and trailing slashes.
@@ -79,16 +80,21 @@ export function handleError(status, remoteURL, fatal) {
 /**
  * Read and track progress when reading a Response object
  *
- * @param {Response|import('./files.js').FileResponse} response The Response object to read
+ * @param {Response|import('./FileResponse.js').FileResponse} response The Response object to read
  * @param {(data: {progress: number, loaded: number, total: number}) => void} progress_callback The function to call with progress updates
+ * @param {number} [expectedSize] The expected size of the file (used when content-length header is missing)
  * @returns {Promise<Uint8Array>} A Promise that resolves with the Uint8Array buffer
  */
-export async function readResponse(response, progress_callback) {
+export async function readResponse(response, progress_callback, expectedSize) {
     const contentLength = response.headers.get('Content-Length');
-    if (contentLength === null) {
-        console.warn('Unable to determine content-length from response headers. Will expand buffer when needed.');
+
+    // Use content-length if available, otherwise fall back to expectedSize (from metadata)
+    let total = contentLength ? parseInt(contentLength, 10) : (expectedSize ?? 0);
+
+    if (contentLength === null && !expectedSize) {
+        logger.warn('Unable to determine content-length from response headers. Will expand buffer when needed.');
     }
-    let total = parseInt(contentLength ?? '0');
+
     let buffer = new Uint8Array(total);
     let loaded = 0;
 
@@ -126,3 +132,37 @@ export async function readResponse(response, progress_callback) {
 
     return buffer;
 }
+
+/**
+ * Checks if the given URL is a blob URL (created via URL.createObjectURL).
+ * Blob URLs should not be cached as they are temporary in-memory references.
+ * @param {string} url - The URL to check.
+ * @returns {boolean} True if the URL is a blob URL, false otherwise.
+ */
+export function isBlobURL(url) {
+    return isValidUrl(url, ['blob:']);
+}
+
+/**
+ * Converts any URL to an absolute URL if needed.
+ * If the URL is already absolute (http://, https://, or blob:), returns it unchanged (handled by new URL(...)).
+ * Otherwise, resolves it relative to the current page location (browser) or module location (Node/Bun/Deno).
+ * @param {string} url - The URL to convert (can be relative or absolute).
+ * @returns {string} The absolute URL.
+ */
+export function toAbsoluteURL(url) {
+    let baseURL;
+
+    if (typeof location !== 'undefined' && location.href) {
+        // Browser environment: use location.href
+        baseURL = location.href;
+    } else if (typeof import.meta !== 'undefined' && import.meta.url) {
+        // Node.js/Bun/Deno module environment: use import.meta.url
+        baseURL = import.meta.url;
+    } else {
+        // Fallback: if no base is available, return the URL unchanged
+        return url;
+    }
+
+    return new URL(url, baseURL).href;
+}

package/src/utils/hub.js

@@ -6,9 +6,12 @@
 
 import { apis, env } from '../env.js';
 import { dispatchCallback } from './core.js';
-import { FileResponse, FileCache } from './hub/files.js';
+import { FileResponse } from './hub/FileResponse.js';
+import { FileCache } from './cache/FileCache.js';
 import { handleError, isValidUrl, pathJoin, isValidHfModelId, readResponse } from './hub/utils.js';
 import { getCache, tryCache } from './cache.js';
+import { get_file_metadata } from './model_registry/get_file_metadata.js';
+import { logger } from './logger.js';
 
 export { MAX_EXTERNAL_DATA_CHUNKS } from './hub/constants.js';
 
@@ -37,7 +40,7 @@ export { MAX_EXTERNAL_DATA_CHUNKS } from './hub/constants.js';
  * @typedef {Object} ModelSpecificPretrainedOptions Options for loading a pretrained model.
  * @property {string} [subfolder='onnx'] In case the relevant files are located inside a subfolder of the model repo on huggingface.co,
  * you can specify the folder name here.
- * @property {string} [model_file_name=null] If specified, load the model with this name (excluding the .onnx suffix). Currently only valid for encoder- or decoder-only models.
+ * @property {string} [model_file_name=null] If specified, load the model with this name (excluding the dtype and .onnx suffixes). Currently only valid for encoder- or decoder-only models.
  * @property {import("./devices.js").DeviceType|Record<string, import("./devices.js").DeviceType>} [device=null] The device to run the model on. If not specified, the device will be chosen from the environment settings.
  * @property {import("./dtypes.js").DataType|Record<string, import("./dtypes.js").DataType>} [dtype=null] The data type to use for the model. If not specified, the data type will be chosen from the environment settings.
  * @property {ExternalData|Record<string, ExternalData>} [use_external_data_format=false] Whether to load the model using the external data format (used for models >= 2GB in size).
@@ -63,14 +66,30 @@ export async function getFile(urlOrPath) {
                     : urlOrPath.toString()
                 : urlOrPath,
         );
-    } else if (typeof process !== 'undefined' && process?.release?.name === 'node') {
+    } else {
+        return env.fetch(urlOrPath, {
+            headers: getFetchHeaders(urlOrPath),
+        });
+    }
+}
+
+/**
+ * Generates appropriate HTTP headers for fetching resources.
+ * In Node.js environments, adds User-Agent and Authorization headers when applicable.
+ * In browser environments, returns minimal headers for security.
+ *
+ * @param {URL|string} urlOrPath The URL or path being fetched.
+ * @returns {Headers} A Headers object with appropriate headers for the request.
+ */
+export function getFetchHeaders(urlOrPath) {
+    const isNode = typeof process !== 'undefined' && process?.release?.name === 'node';
+    const headers = new Headers();
+
+    if (isNode) {
         const IS_CI = !!process.env?.TESTING_REMOTELY;
         const version = env.version;
-
-        const headers = new Headers();
         headers.set('User-Agent', `transformers.js/${version}; is_ci/${IS_CI};`);
 
-        // Check whether we are making a request to the Hugging Face Hub.
         const isHFURL = isValidUrl(urlOrPath, ['http:', 'https:'], ['huggingface.co', 'hf.co']);
         if (isHFURL) {
             // If an access token is present in the environment variables,
@@ -81,13 +100,13 @@ export async function getFile(urlOrPath) {
                 headers.set('Authorization', `Bearer ${token}`);
             }
         }
-        return fetch(urlOrPath, { headers });
     } else {
         // Running in a browser-environment, so we use default headers
         // NOTE: We do not allow passing authorization headers in the browser,
         // since this would require exposing the token to the client.
-        return fetch(urlOrPath);
     }
+
+    return headers;
 }
 
 /**
@@ -103,7 +122,7 @@ export async function getFile(urlOrPath) {
  * @returns {{ requestURL: string, localPath: string, remoteURL: string, proposedCacheKey: string, validModelId: boolean }}
  * An object containing all the paths and URLs for the resource.
  */
-function buildResourcePaths(path_or_repo_id, filename, options = {}, cache = null) {
+export function buildResourcePaths(path_or_repo_id, filename, options = {}, cache = null) {
     const revision = options.revision ?? 'main';
     const requestURL = pathJoin(path_or_repo_id, filename);
 
@@ -142,7 +161,7 @@ function buildResourcePaths(path_or_repo_id, filename, options = {}, cache = nul
  * @param {import('./cache.js').CacheInterface | null} cache The cache instance to check.
  * @param {string} localPath The local path to try first.
  * @param {string} proposedCacheKey The proposed cache key to try second.
- * @returns {Promise<Response|import('./hub/files.js').FileResponse|undefined|string>}
+ * @returns {Promise<Response|import('./hub/FileResponse.js').FileResponse|undefined|string>}
  * The cached response if found, undefined otherwise.
  */
 export async function checkCachedResource(cache, localPath, proposedCacheKey) {
@@ -164,7 +183,7 @@ export async function checkCachedResource(cache, localPath, proposedCacheKey) {
  * @param {string} filename The name of the file to cache.
  * @param {import('./cache.js').CacheInterface} cache The cache instance to store in.
  * @param {string} cacheKey The cache key to use.
- * @param {Response|import('./hub/files.js').FileResponse} response The response to cache.
+ * @param {Response|import('./hub/FileResponse.js').FileResponse} response The response to cache.
  * @param {Uint8Array} [result] The result buffer if already read.
  * @param {PretrainedOptions} [options] Options containing progress callback and context for progress updates.
  * @returns {Promise<void>}
@@ -190,17 +209,20 @@ export async function storeCachedResource(path_or_repo_id, filename, cache, cach
         await cache.put(cacheKey, /** @type {Response} */ (response), wrapped_progress);
     } else if (typeof response !== 'string') {
         // NOTE: We use `new Response(buffer, ...)` instead of `response.clone()` to handle LFS files
+        // Explicitly set content-length from the buffer size, since the browser Cache API may strip it.
+        const headers = new Headers(response.headers);
+        headers.set('content-length', result.byteLength.toString());
         await cache
             .put(
                 cacheKey,
                 new Response(/** @type {any} */ (result), {
-                    headers: response.headers,
+                    headers,
                 }),
             )
             .catch((err) => {
                 // Do not crash if unable to add to cache (e.g., QuotaExceededError).
                 // Rather, log a warning and proceed with execution.
-                console.warn(`Unable to add response to browser cache: ${err}.`);
+                logger.warn(`Unable to add response to browser cache: ${err}.`);
             });
     }
 }
@@ -241,7 +263,7 @@ export async function loadResourceFile(
     // Whether to cache the final response in the end.
     let toCacheResponse = false;
 
-    /** @type {Response|import('./hub/files.js').FileResponse|undefined|string} */
+    /** @type {Response|import('./hub/FileResponse.js').FileResponse|undefined|string} */
     let response;
 
     // Check cache
@@ -262,7 +284,7 @@ export async function loadResourceFile(
                 } catch (e) {
                     // Something went wrong while trying to get the file locally.
                     // NOTE: error handling is done in the next step (since `response` will be undefined)
-                    console.warn(`Unable to load from local path "${localPath}": "${e}"`);
+                    logger.warn(`Unable to load from local path "${localPath}": "${e}"`);
                 }
             } else if (options.local_files_only) {
                 throw new Error(`\`local_files_only=true\`, but attempted to load a remote file from: ${requestURL}.`);
@@ -354,14 +376,36 @@ export async function loadResourceFile(
                     total: buffer.length,
                 });
             } else {
-                buffer = await readResponse(response, (data) => {
-                    dispatchCallback(options.progress_callback, {
-                        status: 'progress',
-                        name: path_or_repo_id,
-                        file: filename,
-                        ...data,
-                    });
-                });
+                // Get expected file size from response headers or metadata
+                // This helps with progress tracking when content-length is missing
+                let expectedSize;
+                const contentLength = response.headers.get('content-length');
+                if (contentLength) {
+                    expectedSize = parseInt(contentLength, 10);
+                } else {
+                    // Try to get size from metadata (useful when content-length is missing during download)
+                    try {
+                        const metadata = await get_file_metadata(path_or_repo_id, filename, options);
+                        if (metadata.size) {
+                            expectedSize = metadata.size;
+                        }
+                    } catch (e) {
+                        // Ignore metadata fetch errors
+                    }
+                }
+
+                buffer = await readResponse(
+                    response,
+                    (data) => {
+                        dispatchCallback(options.progress_callback, {
+                            status: 'progress',
+                            name: path_or_repo_id,
+                            file: filename,
+                            ...data,
+                        });
+                    },
+                    expectedSize,
+                );
             }
         }
         result = buffer;

package/src/utils/image.js

@@ -15,16 +15,16 @@ import { saveBlob } from './io.js';
 
 // Will be empty (or not used) if running in browser or web-worker
 import sharp from 'sharp';
+import { logger } from './logger.js';
 
 let createCanvasFunction;
 let ImageDataClass;
 let loadImageFunction;
-const IS_BROWSER_OR_WEBWORKER = apis.IS_BROWSER_ENV || apis.IS_WEBWORKER_ENV;
-if (IS_BROWSER_OR_WEBWORKER) {
+if (apis.IS_WEB_ENV) {
     // Running in browser or web-worker
     createCanvasFunction = (/** @type {number} */ width, /** @type {number} */ height) => {
         if (!self.OffscreenCanvas) {
-            throw new Error('OffscreenCanvas not supported by this browser.');
+            throw new Error('OffscreenCanvas not supported by this environment.');
         }
         return new self.OffscreenCanvas(width, height);
     };
@@ -133,7 +133,7 @@ export class RawImage {
      * @returns {RawImage} The image object.
      */
     static fromCanvas(canvas) {
-        if (!IS_BROWSER_OR_WEBWORKER) {
+        if (!apis.IS_WEB_ENV) {
             throw new Error('fromCanvas() is only supported in browser environments.');
         }
 
@@ -164,7 +164,7 @@ export class RawImage {
      * @returns {Promise<RawImage>} The image object.
      */
     static async fromBlob(blob) {
-        if (IS_BROWSER_OR_WEBWORKER) {
+        if (apis.IS_WEB_ENV) {
             // Running in environment with canvas
             const img = await loadImageFunction(blob);
 
@@ -378,7 +378,7 @@ export class RawImage {
             height = (width / this.width) * this.height;
         }
 
-        if (IS_BROWSER_OR_WEBWORKER) {
+        if (apis.IS_WEB_ENV) {
             // TODO use `resample` in browser environment
 
             // Store number of channels before resizing
@@ -406,7 +406,7 @@ export class RawImage {
                 case 'box':
                 case 'hamming':
                     if (resampleMethod === 'box' || resampleMethod === 'hamming') {
-                        console.warn(
+                        logger.warn(
                             `Resampling method ${resampleMethod} is not yet supported. Using bilinear instead.`,
                         );
                         resampleMethod = 'bilinear';
@@ -452,7 +452,7 @@ export class RawImage {
             return this;
         }
 
-        if (IS_BROWSER_OR_WEBWORKER) {
+        if (apis.IS_WEB_ENV) {
             // Store number of channels before padding
             const numChannels = this.channels;
 
@@ -494,7 +494,7 @@ export class RawImage {
         const crop_width = x_max - x_min + 1;
         const crop_height = y_max - y_min + 1;
 
-        if (IS_BROWSER_OR_WEBWORKER) {
+        if (apis.IS_WEB_ENV) {
             // Store number of channels before resizing
             const numChannels = this.channels;
 
@@ -541,7 +541,7 @@ export class RawImage {
         const width_offset = (this.width - crop_width) / 2;
         const height_offset = (this.height - crop_height) / 2;
 
-        if (IS_BROWSER_OR_WEBWORKER) {
+        if (apis.IS_WEB_ENV) {
             // Store number of channels before resizing
             const numChannels = this.channels;
 
@@ -649,7 +649,7 @@ export class RawImage {
     }
 
     async toBlob(type = 'image/png', quality = 1) {
-        if (!IS_BROWSER_OR_WEBWORKER) {
+        if (!apis.IS_WEB_ENV) {
             throw new Error('toBlob() is only supported in browser environments.');
         }
 
@@ -672,7 +672,7 @@ export class RawImage {
     }
 
     toCanvas() {
-        if (!IS_BROWSER_OR_WEBWORKER) {
+        if (!apis.IS_WEB_ENV) {
             throw new Error('toCanvas() is only supported in browser environments.');
         }
 
@@ -773,7 +773,7 @@ export class RawImage {
      * @returns {Promise<void>}
      */
     async save(path) {
-        if (IS_BROWSER_OR_WEBWORKER) {
+        if (apis.IS_WEB_ENV) {
             if (apis.IS_WEBWORKER_ENV) {
                 throw new Error('Unable to save an image from a Web Worker.');
             }
@@ -798,7 +798,7 @@ export class RawImage {
      * @returns {import('sharp').Sharp} The Sharp instance.
      */
     toSharp() {
-        if (IS_BROWSER_OR_WEBWORKER) {
+        if (apis.IS_WEB_ENV) {
             throw new Error('toSharp() is only supported in server-side environments.');
         }