scribe.js-ocr 0.2.4 → 0.2.6

package/README.md

@@ -17,7 +17,7 @@ Install from `npm` by running the following:
 npm i scribe.js-ocr
 ```
 
-Scribe.js is written in JavaScript using ESM, so can be imported directly from browser or Node.js JavaScript code.
+Scribe.js is written in JavaScript using ESM, so can be imported directly from browser or Node.js JavaScript code without a build step.
 ```js
 // Import statement in browser:
 import scribe from 'node_modules/scribe.js-ocr/scribe.js';
@@ -31,6 +31,15 @@ scribe.extractText(['https://tesseract.projectnaptha.com/img/eng_bw.png'])
 
 When using Scribe.js in the browser, all files must be served from the same origin as the file importing Scribe.js.  This means that importing Scribe.js from a CDN will not work.  There is no UMD version.
 
+# Templates
+The following are template repos showing how Scribe.js can be used within various frameworks/build systems.  
+
+- Browser with ESM (no build): https://github.com/scribeocr/scribe.js-example-esm-browser
+- Browser with Webpack 5: https://github.com/scribeocr/scribe.js-example-webpack5
+- Browser with Vue.js v2: https://github.com/scribeocr/scribe.js-example-vue2
+
+Contributions are appreciated--if you are using Scribe.js within a framework not listed below, consider making a basic repo and adding to this list with a PR, especially if non-obvious steps were required.
+
 # Scribe.js vs. Tesseract.js
 Considering whether Scribe.js or Tesseract.js is better for your project?  Read [this article](./docs/scribe_vs_tesseract.md).
 
@@ -40,6 +49,15 @@ Considering whether Scribe.js or Tesseract.js is better for your project?  Read
 - [Scribe.js vs. Tesseract.js Comparison](./docs/scribe_vs_tesseract.md)
 - [API](./docs/API.md)
 
+## Projects and Examples
+The following are examples and projects built using Scribe.js.  Additional examples can be found in the [examples](https://github.com/scribeocr/scribe.js/tree/master/examples) directory. 
+
+- Projects
+   - Scribe OCR: officially supported GUI front-end for Scribe.js
+      - Site at [scribeocr.com](https://scribeocr.com/), repo at [github.com/scribeocr/scribeocr](https://github.com/scribeocr/scribeocr)
+
+If you have a project or example repo that uses Scribe.js, feel free to add it to this list using a pull request. Examples submitted should be well documented such that new users can run them; projects should be functional and actively maintained.
+
 # Contributing
 To work on a local copy, simply clone with `--recurse-submodules` and install.  Please run the automated tests before making a PR.
 ```sh
@@ -55,4 +73,4 @@ npm i
 
 ## Run automated tests before making PR
 npm run test
-```
+```

package/cli/main.js

@@ -7,48 +7,10 @@ import path from 'path';
 import { tmpUnique } from '../js/worker/compareOCRModule.js';
 import scribe from '../scribe.js';
 
-// When `debugMode` is enabled:
-// (1) Comparison images are saved as .png files.
-// (2) Comparison logs are saved as .txt files.
-// (3) All OCR data is dumped as .hocr files.
 const debugMode = false;
 
 scribe.opt.saveDebugImages = debugMode;
 
-/** @type {import('canvas').CanvasRenderingContext2D} */
-let ctxDebug;
-if (debugMode) {
-  const { createCanvas } = await import('canvas');
-  const canvasAlt = createCanvas(200, 200);
-  ctxDebug = canvasAlt.getContext('2d');
-}
-
-const debugDir = `${__dirname}/../../dev/debug/`;
-
-/**
- *
- * @param {import('canvas').CanvasRenderingContext2D} ctx
- * @param {Array<Array<CompDebugNode>>} compDebugArrArr
- * @param {string} filePath
- */
-async function writeDebugImages(ctx, compDebugArrArr, filePath) {
-  await scribe.utils.drawDebugImages({ ctx, compDebugArrArr, context: 'node' });
-  const buffer0 = ctx.canvas.toBuffer('image/png');
-  fs.writeFileSync(filePath, buffer0);
-}
-
-async function dumpDebugImagesAll() {
-  if (!scribe.data.debug.debugImg.Combined || scribe.data.debug.debugImg.Combined.length === 0) {
-    console.log('No debug images to dump.');
-    return;
-  }
-
-  for (let i = 0; i < scribe.data.debug.debugImg.Combined.length; i++) {
-    const filePath = `${debugDir}legacy_lstm_comp_${i}.png`;
-    await writeDebugImages(ctxDebug, [scribe.data.debug.debugImg.Combined[i]], filePath);
-  }
-}
-
 /**
  * @param {string} func
  * @param {Object} params
@@ -75,15 +37,16 @@ async function main(func, params) {
 
   const output = {};
 
-  const debugComp = false;
-
   const files = [];
   if (params.pdfFile) files.push(params.pdfFile);
   if (params.ocrFile) files.push(params.ocrFile);
   await scribe.importFiles(files);
 
   const backgroundArg = params.pdfFile;
-  const backgroundArgStem = backgroundArg ? path.basename(backgroundArg).replace(/\.\w{1,5}$/i, '') : undefined;
+  const backgroundStem = backgroundArg ? path.basename(backgroundArg).replace(/\.\w{1,5}$/i, '') : undefined;
+  const ocrStem = params.ocrFile ? path.basename(params.ocrFile).replace(/\.\w{1,5}$/i, '') : undefined;
+  const outputStem = backgroundStem || ocrStem || 'output';
+
   const outputDir = params.outputDir || '.';
 
   if (outputDir) fs.mkdirSync(outputDir, { recursive: true });
@@ -126,12 +89,15 @@ async function main(func, params) {
     await scribe.download('pdf', outputPath);
   }
 
-  if (debugComp) {
-    const outputPath = `${__dirname}/../../dev/debug/${backgroundArgStem}_debug.csv`;
-    scribe.utils.writeDebugCsv(scribe.data.ocr.active, outputPath);
-  }
+  if (debugMode) {
+    const debugDir = `${outputDir}/${outputStem}_debug`;
+    fs.mkdirSync(debugDir, { recursive: true });
+    const outputPathCsv = `${debugDir}/_debug.csv`;
+    scribe.utils.writeDebugCsv(scribe.data.ocr.active, outputPathCsv);
 
-  if (debugMode) dumpDebugImagesAll();
+    scribe.utils.dumpDebugImages(debugDir);
+    scribe.utils.dumpHOCR(debugDir);
+  }
 
   // Delete temp directory with fonts
   await tmpUnique.delete();

package/js/clear.js

@@ -8,12 +8,12 @@ import {
   ocrAllRaw,
   pageMetricsArr,
 } from './containers/dataContainer.js';
-import { fontAll } from './containers/fontContainer.js';
+import { FontCont } from './containers/fontContainer.js';
 import { ImageCache } from './containers/imageContainer.js';
 import { replaceObjectProperties } from './utils/miscUtils.js';
 
 export function clearData() {
-  inputData.pageCount = 0;
+  inputData.clear();
   replaceObjectProperties(ocrAll, { active: [] });
   replaceObjectProperties(ocrAllRaw, { active: [] });
   layoutRegions.pages.length = 0;
@@ -23,5 +23,5 @@ export function clearData() {
   ImageCache.clear();
   // Clear optimized font data and reset fontAll to raw data.
   replaceObjectProperties(fontMetricsObj);
-  fontAll.clear();
+  FontCont.clear();
 }

package/js/containers/app.js

@@ -5,8 +5,6 @@ export class opt {
 
   static extractText = false;
 
-  static enableOpt = false;
-
   static enableUpscale = false;
 
   static ignorePunct = false;
@@ -82,4 +80,15 @@ export class inputData {
   static defaultDownloadFileName = '';
 
   static pageCount = 0;
+
+  static clear = () => {
+    inputData.xmlMode.length = 0;
+    inputData.pdfMode = false;
+    inputData.imageMode = false;
+    inputData.resumeMode = false;
+    inputData.evalMode = false;
+    inputData.inputFileNames = [];
+    inputData.defaultDownloadFileName = '';
+    inputData.pageCount = 0;
+  };
 }

package/js/containers/dataContainer.js

@@ -79,12 +79,6 @@ export const pageMetricsArr = [];
 export class DebugData {
   /** @type {{[key: string]: Array<Array<CompDebugBrowser|CompDebugNode>> | undefined}} */
   static debugImg = {};
-
-  /** @type {?Awaited<ReturnType<import('../fontEval.js').evaluateFonts>>} */
-  static evalRaw;
-
-  /** @type {?Awaited<ReturnType<import('../fontEval.js').evaluateFonts>>} */
-  static evalOpt;
 }
 
 /** @type {Array<Awaited<ReturnType<typeof import('../../scrollview-web/scrollview/ScrollView.js').ScrollView.prototype.getAll>>>} */

package/js/containers/fontContainer.js

@@ -221,117 +221,159 @@ export async function loadFontsFromSource(srcObj, opt = false) {
 // FontCont must contain no font data when initialized, and no data should be defined in this file.
 // This is because this file is run both from the main thread and workers, and fonts are defined different ways in each.
 // In the main thread, "raw" fonts are loaded from fetch requests, however in workers they are loaded from the main thread.
-class FontCont {
-  constructor() {
-    /** @type {?FontContainer} */
-    this.raw = null;
-    /** @type {?FontContainer} */
-    this.optInitial = null;
-    /** @type {?FontContainer} */
-    this.opt = null;
-    /** @type {?FontContainer} */
-    this.active = null;
-    /** @type {?FontContainer} */
-    this.export = null;
-    this.supp = {
-      /** @type {?FontContainerFont} */
-      chi_sim: null,
-    };
-    this.defaultFontName = 'SerifDefault';
-    this.serifDefaultName = 'NimbusRomNo9L';
-    this.sansDefaultName = 'NimbusSans';
-
-    this.loadedBuiltInRawWorker = false;
-    this.loadedBuiltInOptWorker = false;
-
-    /** @type {?('latin'|'all')} */
-    this.glyphSet = null;
-    /**
-     * Get raw/opt/active font, and throw exception if it does not exist.
-     * This method only exists for type inference purposes, as raw/opt/active may be accessed directly, but may be `null`.
-     * This method should therefore only be used in cases where an exception on `null` is a desirable behavior.
-     * @param {('raw'|'opt'|'active'|'optInitial')} container
-     * @returns {FontContainer}
-     */
-    this.getContainer = (container) => {
-      const fontRes = this[container];
-      if (!fontRes) throw new Error(`${container} font container does not exist.`);
-      return fontRes;
-    };
+export class FontCont {
+  /** @type {?FontContainer} */
+  static raw = null;
+
+  /** @type {?FontContainer} */
+  static opt = null;
+
+  /** @type {?FontContainer} */
+  static export = null;
+
+  static supp = {
+    /** @type {?FontContainerFont} */
+    chi_sim: null,
+  };
+
+  /** Optimized fonts will be used when believed to improve quality. */
+  static enableOpt = false;
+
+  /** Optimized fonts will always be used when they exist, even if believed to reduce quality. */
+  static forceOpt = false;
+
+  /** @type {?Awaited<ReturnType<import('../fontEval.js').evaluateFonts>>} */
+  static rawMetrics = null;
+
+  /** @type {?Awaited<ReturnType<import('../fontEval.js').evaluateFonts>>} */
+  static optMetrics = null;
+
+  static defaultFontName = 'SerifDefault';
+
+  static serifDefaultName = 'NimbusRomNo9L';
 
-    /**
+  static sansDefaultName = 'NimbusSans';
+
+  /** @type {?('latin'|'all')} */
+  static glyphSet = null;
+
+  /**
+   * Decide whether to use the optimized version of a font family.
+   * Note that even when this function returns `true`, optimized versions of every style will not exist.
+   * @param {string} family - Font family name.
+   */
+  static useOptFamily = (family) => {
+    const raw = FontCont.raw?.[family]?.normal;
+    if (!raw) return false;
+    const opt = FontCont.opt?.[family]?.normal;
+    if (opt && FontCont.forceOpt) {
+      return true;
+    // If optimized fonts are enabled (but not forced), the optimized version of a font will be used if:
+    // (1) The optimized version exists
+    // (2) The optimized version has a better metric (so quality should improve).
+    // (3) The optimized version of the default sans/serif font also has a better metric.
+    // This last condition avoids font optimization being enabled in the UI when it only improves an unused font.
+    } if (opt && FontCont.enableOpt) {
+      const defaultFamily = raw.type === 'serif' ? FontCont.serifDefaultName : FontCont.sansDefaultName;
+
+      const rawMetricDefault = FontCont.rawMetrics?.[defaultFamily];
+      const optMetricDefault = FontCont.optMetrics?.[defaultFamily];
+
+      const rawMetric = FontCont.rawMetrics?.[family];
+      const optMetric = FontCont.optMetrics?.[family];
+      if (rawMetric && optMetric && optMetric < rawMetric && optMetricDefault < rawMetricDefault) {
+        return true;
+      }
+    }
+    return false;
+  };
+
+  /**
      * Gets a font object.  Unlike accessing the font containers directly,
      * this method allows for special values 'Default', 'SansDefault', and 'SerifDefault' to be used.
      *
      * @param {('Default'|'SansDefault'|'SerifDefault'|string)} family - Font family name.
      * @param {('normal'|'italic'|'bold'|string)} [style='normal']
      * @param {string} [lang='eng']
-     * @param {('raw'|'opt'|'active'|'optInitial')} [container='active']
      * @returns {FontContainerFont}
      */
-    this.getFont = (family, style = 'normal', lang = 'eng', container = 'active') => {
-      const fontCont = this.getContainer(container);
+  static getFont = (family, style = 'normal', lang = 'eng') => {
+    if (lang === 'chi_sim') {
+      if (!FontCont.supp.chi_sim) throw new Error('chi_sim font does not exist.');
+      return FontCont.supp.chi_sim;
+    }
 
-      if (lang === 'chi_sim') {
-        if (!this.supp.chi_sim) throw new Error('chi_sim font does not exist.');
-        return this.supp.chi_sim;
+    if (!FontCont.raw) throw new Error('Raw fonts not yet initialized.');
+
+    // Option 1: If we have access to the font, use it.
+    // Option 2: If we do not have access to the font, but it closely resembles a built-in font, use the built-in font.
+    if (!FontCont.raw?.[family]?.[style]) {
+      if (/Times/i.test(family)) {
+        family = 'NimbusRomNo9L';
+      } else if (/Helvetica/i.test(family)) {
+        family = 'NimbusSans';
+      } else if (/Arial/i.test(family)) {
+        family = 'NimbusSans';
+      } else if (/Century/i.test(family)) {
+        family = 'Century';
+      } else if (/Palatino/i.test(family)) {
+        family = 'Palatino';
+      } else if (/Garamond/i.test(family)) {
+        family = 'Garamond';
+      } else if (/Carlito/i.test(family)) {
+        family = 'Carlito';
+      } else if (/Calibri/i.test(family)) {
+        family = 'Carlito';
       }
+    }
 
-      // Option 1: If we have access to the font, use it.
-      // Option 2: If we do not have access to the font, but it closely resembles a built-in font, use the built-in font.
-      if (!fontCont?.[family]?.[style]) {
-        if (/Times/i.test(family)) {
-          family = 'NimbusRomNo9L';
-        } else if (/Helvetica/i.test(family)) {
-          family = 'NimbusSans';
-        } else if (/Arial/i.test(family)) {
-          family = 'NimbusSans';
-        } else if (/Century/i.test(family)) {
-          family = 'Century';
-        } else if (/Palatino/i.test(family)) {
-          family = 'Palatino';
-        } else if (/Garamond/i.test(family)) {
-          family = 'Garamond';
-        } else if (/Carlito/i.test(family)) {
-          family = 'Carlito';
-        } else if (/Calibri/i.test(family)) {
-          family = 'Carlito';
-        }
-      }
+    // Option 3: If the font still is not identified, use the default sans/serif font.
+    if (!FontCont.raw?.[family]?.[style]) {
+      family = determineSansSerif(family);
+    }
 
-      // Option 3: If the font still is not identified, use the default sans/serif font.
-      if (!fontCont?.[family]?.[style]) {
-        family = determineSansSerif(family);
-      }
+    // This needs to come first as `defaultFontName` maps to either 'SerifDefault' or 'SansDefault'.
+    if (family === 'Default') family = FontCont.defaultFontName;
 
-      // This needs to come first as `defaultFontName` maps to either 'SerifDefault' or 'SansDefault'.
-      if (family === 'Default') family = this.defaultFontName;
+    if (family === 'SerifDefault') family = FontCont.serifDefaultName;
+    if (family === 'SansDefault') family = FontCont.sansDefaultName;
 
-      if (family === 'SerifDefault') family = this.serifDefaultName;
-      if (family === 'SansDefault') family = this.sansDefaultName;
-      const fontRes = fontCont[family][style];
-      if (!fontRes) throw new Error(`Font container does not contain ${family} (${style}).`);
-      return fontRes;
-    };
+    /** @type {FontContainerFont} */
+    let fontRes = FontCont.raw?.[family]?.[style];
+    if (!fontRes) throw new Error(`Font container does not contain ${family} (${style}).`);
 
-    /**
-     *
-     * @param {OcrWord} word
-     * @param {('raw'|'opt'|'active'|'optInitial')} [container='active']
-     */
-    this.getWordFont = (word, container = 'active') => {
-      const wordFontFamily = word.font || fontAll.defaultFontName;
-      return this.getFont(wordFontFamily, word.style, word.lang, container);
-    };
-
-    this.clear = () => {
-      this.active = this.raw;
-      this.optInitial = null;
-      this.opt = null;
-      this.loadedBuiltInRawWorker = false;
-      this.loadedBuiltInOptWorker = false;
-    };
-  }
-}
+    const opt = FontCont.opt?.[family]?.[style];
+    const useOpt = FontCont.useOptFamily(family);
+    if (opt && useOpt) fontRes = opt;
 
-export const fontAll = new FontCont();
+    return fontRes;
+  };
+
+  /**
+   *
+   * @param {OcrWord} word
+   */
+  static getWordFont = (word) => {
+    const wordFontFamily = word.font || FontCont.defaultFontName;
+    return FontCont.getFont(wordFontFamily, word.style, word.lang);
+  };
+
+  /**
+   * Reset font container to original state but do not unload default resources.
+   */
+  static clear = () => {
+    FontCont.opt = null;
+    FontCont.rawMetrics = null;
+    FontCont.optMetrics = null;
+
+    FontCont.defaultFontName = 'SerifDefault';
+    FontCont.serifDefaultName = 'NimbusRomNo9L';
+    FontCont.sansDefaultName = 'NimbusSans';
+  };
+
+  static terminate = () => {
+    FontCont.clear();
+    FontCont.raw = null;
+    FontCont.glyphSet = null;
+  };
+}

package/js/containers/imageContainer.js

@@ -4,86 +4,21 @@ import {
 
 import { initMuPDFWorker } from '../../mupdf/mupdf-async.js';
 
-import { getImageBitmap, getJpegDimensions, getPngDimensions } from '../utils/imageUtils.js';
+import { getImageBitmap } from '../utils/imageUtils.js';
 
 import { setUploadFontsWorker } from '../fontContainerMain.js';
 import { pageMetricsArr } from './dataContainer.js';
 import {
+  FontCont,
   FontContainerFont,
-  fontAll,
   loadOpentype,
 } from './fontContainer.js';
 
 import { gs } from '../generalWorkerMain.js';
+import { imageUtils } from '../objects/imageObjects.js';
 import { determineSansSerif, range } from '../utils/miscUtils.js';
 import { opt } from './app.js';
 
-/**
- *
- * @param {ImageWrapper} img
- * @returns
- */
-const getDims = async (img) => {
-  if (!img._dims) {
-    if (img.format === 'jpeg') {
-      img._dims = getJpegDimensions(img.src);
-    } else {
-      img._dims = getPngDimensions(img.src);
-    }
-  }
-  return img._dims;
-};
-
-/**
- * Checks whether existing transformations need to be undone by re-rendering raw image.
- * When an existing image has an unwanted tranformation, it is re-rendered from the original source,
- * rather than attempting to unrotate/downscale/etc. the transformed image.
- *
- * @param {(ImageWrapper|ImageProperties)} img
- * @param {?ImagePropertiesRequest|ImageWrapper} [props]
- * @returns
- */
-const requiresUndo = (img, props) => {
-  if (!props) return false;
-  if (img.rotated && props.rotated === false) return true;
-  if (img.upscaled && props.upscaled === false) return true;
-  // This condition should only apply to PDFs.
-  if (img.colorMode === 'color' && props.colorMode === 'gray' || img.colorMode === 'gray' && props.colorMode === 'color') return true;
-  return false;
-};
-
-/**
- * Whether the image properties are compatible with the requested properties.
- * @param {ImageWrapper|ImageProperties} img
- * @param {?ImagePropertiesRequest|ImageWrapper} [props]
- */
-const compatible = (img, props) => {
-  if (!props) return true;
-  if (props.rotated === false && img.rotated === true) {
-    // Requests to unrotate an image are always respected, even if the angle is very close to 0.
-    // This is because the intent may be to restore the raw user-uploaded image for an export, which should always be possible.
-    return false;
-  } if (props.rotated === true && img.rotated === false) {
-    // An unrotated image is considered compatible with a rotated request if the angle is very close to 0.
-    if (Math.abs(pageMetricsArr[img.n].angle || 0) > 0.05) {
-      return false;
-    }
-  }
-
-  if (props.upscaled === true && img.upscaled === false || props.upscaled === false && img.upscaled === true) return false;
-
-  // The value 'native' is used for images uploaded from the user, and is essentially a default value.
-  // These cannot be considered incompatible with any color mode as the color of user-uploaded images is never edited (binarization aside).
-  if (props.colorMode && props.colorMode !== img.colorMode && img.colorMode !== 'native' && img.colorMode !== 'native') return false;
-  return true;
-};
-
-export const imageUtils = {
-  getDims,
-  requiresUndo,
-  compatible,
-};
-
 let skipTextMode = false;
 
 export class MuPDFScheduler {
@@ -306,7 +241,7 @@ export class ImageCache {
   /**
    * @param {ImageWrapper} inputImage
    * @param {number} n - Page number
-   * @param {?ImagePropertiesRequest} [props] - Image properties needed.
+   * @param {ImagePropertiesRequest} [props] - Image properties needed.
    *  Image properties should only be defined if needed, as they can require the image to be re-rendered.
    * @param {boolean} [saveNativeImage=true] - Whether the native image should be saved.
    */
@@ -350,20 +285,22 @@ export class ImageCache {
 
   /**
    * @param {number} n - Page number
-   * @param {?ImagePropertiesRequest} [props] - Image properties needed.
+   * @param {ImagePropertiesRequest} [props] - Image properties needed.
    *  Image properties should only be defined if needed, as they can require the image to be re-rendered.
    * @param {boolean} [nativeOnly=true]
    */
   static getImages = (n, props, nativeOnly = true) => {
-    const newNative = !ImageCache.native[n] || !imageUtils.compatible(ImageCache.nativeProps[n], props);
-    const newBinary = !nativeOnly && (!ImageCache.binary[n] || !imageUtils.compatible(ImageCache.binaryProps[n], props));
+    const significantRotation = Math.abs(pageMetricsArr[n].angle || 0) > 0.05;
+
+    const newNative = !ImageCache.native[n] || !imageUtils.compatible(ImageCache.nativeProps[n], props, significantRotation);
+    const newBinary = !nativeOnly && (!ImageCache.binary[n] || !imageUtils.compatible(ImageCache.binaryProps[n], props, significantRotation));
 
     if (newNative || newBinary) {
       const renderRaw = !ImageCache.native[n] || imageUtils.requiresUndo(ImageCache.nativeProps[n], props);
       const propsRaw = {
         colorMode: opt.colorMode, rotated: false, upscaled: false, n,
       };
-      const renderTransform = newBinary || !imageUtils.compatible(propsRaw, props);
+      const renderTransform = newBinary || !imageUtils.compatible(propsRaw, props, significantRotation);
 
       const propsNew = renderRaw ? propsRaw : JSON.parse(JSON.stringify(ImageCache.nativeProps[n]));
       propsNew.colorMode = props?.colorMode || propsNew.colorMode;
@@ -387,7 +324,6 @@ export class ImageCache {
         if (renderTransform) {
           return ImageCache.transformImage(img1, n, props, true);
         }
-        console.assert(nativeOnly, 'Binary should not be null when binary is needed');
         return { native: img1, binary: null };
       })();
 
@@ -400,20 +336,20 @@ export class ImageCache {
 
   /**
    * @param {number} n
-   * @param {Parameters<ImageCache.getImages>[1]} [props]
+   * @param {ImagePropertiesRequest} [props]
    */
   static getNative = async (n, props) => ImageCache.getImages(n, props, true).native;
 
   /**
    * @param {number} n
-   * @param {Parameters<ImageCache.getImages>[1]} [props]
+   * @param {ImagePropertiesRequest} [props]
    */
   static getBinary = async (n, props) => ImageCache.getImages(n, props, false).binary;
 
   /**
    *
    * @param {number} n - Page number
-   * @param {?ImagePropertiesRequest} [props] - Image properties needed.
+   * @param {ImagePropertiesRequest} [props] - Image properties needed.
    *  Image properties should only be defined if needed, as they can require the image to be re-rendered.
    */
   static getNativeBitmap = async (n, props) => {
@@ -431,7 +367,7 @@ export class ImageCache {
   /**
    *
    * @param {number} n - Page number
-   * @param {?ImagePropertiesRequest} [props] - Image properties needed.
+   * @param {ImagePropertiesRequest} [props] - Image properties needed.
    *  Image properties should only be defined if needed, as they can require the image to be re-rendered.
    */
   static getBinaryBitmap = async (n, props) => {
@@ -454,9 +390,9 @@ export class ImageCache {
    * @param {number} min - Min page to render.
    * @param {number} max - Max page to render.
    * @param {boolean} binary - Whether to render binary images.
-   * @param {?ImagePropertiesRequest} [props=null]
+   * @param {ImagePropertiesRequest} [props]
    */
-  static preRenderRange = async (min, max, binary, props = null) => {
+  static preRenderRange = async (min, max, binary, props) => {
     const pagesArr = range(min, max);
     if (binary) {
       await Promise.all(pagesArr.map((n) => ImageCache.getBinary(n, props).then(() => {
@@ -624,12 +560,12 @@ export class ImageCache {
           // mupdf replaces spaces with underscores in font names.
           const fontName = fontFamilyEmbedded.replace(/[^+]+\+/g, '').replace(/\s/g, '_');
 
-          if (!fontAll.raw[fontName]) {
-            fontAll.raw[fontName] = {};
+          if (!FontCont.raw[fontName]) {
+            FontCont.raw[fontName] = {};
           }
 
-          if (!fontAll.raw[fontName][fontStyle]) {
-            fontAll.raw[fontName][fontStyle] = new FontContainerFont(fontName, fontStyle, src, false, fontObj);
+          if (!FontCont.raw[fontName][fontStyle]) {
+            FontCont.raw[fontName][fontStyle] = new FontContainerFont(fontName, fontStyle, src, false, fontObj);
           }
         }