@cache

The decorator allows you to cache the result of executing any getter of the UI component.
The result of the getter execution will be cached and returned in subsequent calls, but only within one instance of the class.

import { cache, component } from 'jodit/core/decorators';

@component
class UIComponent extends UIElement {
  @cache()
  get someHeavyGetter() {
    return someHeaveCalculation(param1, param2);
  }
}

const elm = new UIComponent(jodit);
elm.someHeavyGetter; // someHeaveCalculation will execute only once
elm.someHeavyGetter;

It is also possible to cache returned HTML elements. The next time the method is called, the element will be cloned;

import { cacheHTML, component } from 'jodit/core/decorators';

@component
class UIComponent extends UIElement {
  @cacheHTML()
  someHeavyMethod() {
    const div = document.createElement('div');
    div.innerHTML = someHeaveCalculation();
    return div;
  }
}

const elm = new UIComponent(jodit);
const div1 = elm.someHeavyMethod(); // call once
const div2 = elm.someHeavyMethod();

const elm2 = new UIComponent(jodit);
const div3 = elm2.someHeavyMethod();

console.log(div1 === div2); // false
console.log(div3 === div2); // false
console.log(div3 === div1); // false

InterfacesInterfaces

• CachePropertyDescriptor

cachedcached

cached<T>(object, property): Nullable<T>

Retrieves a cached property value from an object if it exists; otherwise, returns null.

This utility is particularly useful when working with properties that are lazily initialized
or dynamically created, such as getters or cached computations. It ensures you can safely
access the value without triggering initialization or creating a new instance.

Usage Example:Usage Example:

import type { IUIElement } from "jodit";

const { component, cache, cached } = Jodit.decorators;
const { UIElement } = Jodit.modules;

@component
class SomeComponent extends UIElement {
  @cache
  get someElement(): IUIElement {
    return new UIElement(this.jodit);
  }

  destruct() {
    // Use the cached utility to clean up only if the property is initialized
    cached(this, 'someElement')?.destruct();
    super.destruct();
  }
}

Type parametersType parameters

ParametersParameters

ReturnsReturns

Nullable<T>

The cached value of the property if it exists; otherwise, null.

Notes:Notes:

• If the property is defined as a getter, the function will return null
  instead of invoking the getter.
• This function is non-destructive and does not alter the object's state.

Defined inDefined in

src/core/decorators/cache/cache.ts#68

cachecache

cache<T, R>(_, name, descriptor): void

A decorator that caches the result of a getter method. Once the getter is accessed for the first time,
its computed value is stored as a property of the object. Subsequent accesses return the cached value
without recalculating it, improving performance and avoiding redundant computations.

Key Features:Key Features:

• Lazy Initialization: The original getter is invoked only once, the first time the property is accessed.
• Immutability: After caching, the value is stored as a non-writable, non-configurable property, preventing accidental modifications.
• Conditional Caching: If the returned value has a property noCache set to true, the caching mechanism is bypassed, and the getter is invoked each time.

Usage Example 1: Basic CachingUsage Example 1: Basic Caching

import { cache } from './decorators';

class Example {
  private counter = 0;

  @cache
  get expensiveComputation(): number {
    console.log('Calculating...');
    return ++this.counter;
  }
}

const instance = new Example();
console.log(instance.expensiveComputation); // Logs "Calculating..." and returns 1
console.log(instance.expensiveComputation); // Returns 1 (cached value, no calculation)

Usage Example 2: Integration with Cached UtilitiesUsage Example 2: Integration with Cached Utilities

import { cache, cached } from './decorators';
import type { IUIElement } from "jodit";

const { component } = Jodit.decorators;
const { UIElement } = Jodit.modules;

@component
class SomeComponent extends UIElement {
  @cache
  get someElement(): IUIElement {
    return new UIElement(this.jodit);
  }

  destruct() {
    // Use the cached utility to clean up only if the property is initialized
    cached(this, 'someElement')?.destruct();
    super.destruct();
  }
}

Type parametersType parameters

ParametersParameters

ReturnsReturns

void

Throws

Will throw an error if the descriptor does not include a getter.

Notes:Notes:

• Performance: Ideal for properties that are computationally expensive and do not change after the initial computation.
• Flexibility: Supports conditional caching via the noCache property in the returned value.
• Compatibility: Designed to work seamlessly with objects and classes in TypeScript or JavaScript.

Defined inDefined in

src/core/decorators/cache/cache.ts#138

cacheHTMLcacheHTML

cacheHTML<T, R>(target, _, descriptor): void

Type parametersType parameters

ParametersParameters

ReturnsReturns

void

Defined inDefined in

jodit/src/core/decorators/cache/cache.ts:174