🆙 Memory usage fixes

src/common/layout/LayoutAvatarImageView.tsx

@@ -2,6 +2,7 @@ import { AvatarScaleType, AvatarSetType, GetAvatarRenderManager } from '@nitrots
 import { CSSProperties, FC, useEffect, useMemo, useRef, useState } from 'react';
 import { Base, BaseProps } from '../Base';
 
+const AVATAR_CACHE_MAX_SIZE = 200;
 const AVATAR_IMAGE_CACHE: Map<string, string> = new Map();
 
 export interface LayoutAvatarImageViewProps extends BaseProps<HTMLDivElement>
@@ -75,7 +76,16 @@ export const LayoutAvatarImageView: FC<LayoutAvatarImageViewProps> = props =>
 
                 if(imageUrl && !isDisposed.current)
                 {
-                    if(!avatarImage.isPlaceholder()) AVATAR_IMAGE_CACHE.set(figureKey, imageUrl);
+                    if(!avatarImage.isPlaceholder())
+                    {
+                        if(AVATAR_IMAGE_CACHE.size >= AVATAR_CACHE_MAX_SIZE)
+                        {
+                            const firstKey = AVATAR_IMAGE_CACHE.keys().next().value;
+                            AVATAR_IMAGE_CACHE.delete(firstKey);
+                        }
+
+                        AVATAR_IMAGE_CACHE.set(figureKey, imageUrl);
+                    }
 
                     setAvatarUrl(imageUrl);
                 }

src/common/layout/LayoutRoomObjectImageView.tsx

@@ -1,5 +1,5 @@
 import { GetRoomEngine, TextureUtils, Vector3d } from '@nitrots/nitro-renderer';
-import { CSSProperties, FC, useEffect, useMemo, useState } from 'react';
+import { CSSProperties, FC, useEffect, useMemo, useRef, useState } from 'react';
 import { Base, BaseProps } from '../Base';
 
 interface LayoutRoomObjectImageViewProps extends BaseProps<HTMLDivElement>
@@ -15,6 +15,14 @@ export const LayoutRoomObjectImageView: FC<LayoutRoomObjectImageViewProps> = pro
 {
     const { roomId = -1, objectId = 1, category = -1, direction = 2, scale = 1, style = {}, ...rest } = props;
     const [ imageElement, setImageElement ] = useState<HTMLImageElement>(null);
+    const isMounted = useRef(true);
+
+    useEffect(() =>
+    {
+        isMounted.current = true;
+
+        return () => { isMounted.current = false; };
+    }, []);
 
     const getStyle = useMemo(() =>
     {
@@ -42,15 +50,23 @@ export const LayoutRoomObjectImageView: FC<LayoutRoomObjectImageViewProps> = pro
     useEffect(() =>
     {
         const imageResult = GetRoomEngine().getRoomObjectImage(roomId, objectId, category, new Vector3d(direction * 45), 64, {
-            imageReady: async (id, texture, image) => setImageElement(await TextureUtils.generateImage(texture)),
+            imageReady: async (id, texture, image) =>
+            {
+                const img = await TextureUtils.generateImage(texture);
+
+                if(img && isMounted.current) setImageElement(img);
+            },
             imageFailed: null
         });
 
-        // needs (roomObjectImage.data.width > 140) || (roomObjectImage.data.height > 200) scale 1
-
         if(!imageResult) return;
 
-        (async () => setImageElement(await TextureUtils.generateImage(imageResult.data)))();
+        (async () =>
+        {
+            const img = await TextureUtils.generateImage(imageResult.data);
+
+            if(img && isMounted.current) setImageElement(img);
+        })();
     }, [ roomId, objectId, category, direction, scale ]);
 
     if(!imageElement) return null;

src/common/layout/LayoutRoomPreviewerView.tsx

@@ -38,10 +38,11 @@ export const LayoutRoomPreviewerView: FC<{
                 clear: true
             });
 
-            let canvas = GetRenderer().texture.generateCanvas(texture);
+            const canvas = GetRenderer().texture.generateCanvas(texture);
             const base64 = canvas.toDataURL('image/png');
 
-            canvas = null;
+            canvas.width = 0;
+            canvas.height = 0;
 
             elementRef.current.style.backgroundImage = `url(${ base64 })`;
         };