{/* prettier-ignore */}
{/*
Copyright 2023 Comcast Cable Communications Management, LLC

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.

SPDX-License-Identifier: Apache-2.0
\*/}

import { Meta } from '@storybook/blocks';

<Meta title="Utilities/withClassCache" />

# withClassCache

The `withClassCache` mixin can be wrapped around a class to memoize class creation.

## Source

https://github.com/rdkcentral/Lightning-UI-Components/blob/develop/packages/@lightningjs/ui-components/src/mixins/withClassCache/index.js

## Usage

```js
withClassCache(base => class Example extends base {});
```

Returns a new function which takes a base class, and if the class is already created, returns the cached version.
This is very important when using patterns like withMetadata. Ideally you should create a single instance as a const
and reuse that class like so:

```js
//do this
export const myWithMeta = withMetadata(BaseComp);
//or this
const withMetaCache = withClassCache(withMetadata(BaseComp));
type: withMetaCache(BaseComp);

//not this
type: withMetadata(BaseComp);
```

The first two will reuse the class that you've created, the last will cause the browser to create a new class each
time the component is created.
