perf(app): keep more twemoji urls cached instead of dropping them all (#1969)

fluxer_app/src/features/expressions/utils/EmojiUtils.ts

@@ -3,13 +3,23 @@
 import RuntimeConfig from '@app/features/app/state/RuntimeConfig';
 import {convertToCodePoints} from '@app/features/expressions/utils/EmojiCodepointUtils';
 import {MODE} from '@app/features/platform/types/Env';
-import type {FC, SVGProps} from 'react';
 
 const TWEMOJI_VERSION = '2';
-const TWEMOJI_URL_CACHE_LIMIT = 2048;
+const TWEMOJI_URL_CACHE_LIMIT = 8192;
 
-type TwemojiComponent = FC<SVGProps<SVGSVGElement>>;
-const TWEMOJI_URL_CACHE = new Map<string, string | null>();
+const TWEMOJI_URL_CACHE = new Map<string, string>();
+
+let normalizedEndpointSource = '';
+let normalizedEndpoint = '';
+
+function getStaticOrigin(): string {
+	const endpoint = RuntimeConfig.staticCdnEndpoint;
+	if (endpoint !== normalizedEndpointSource) {
+		normalizedEndpointSource = endpoint;
+		normalizedEndpoint = endpoint.replace(/\/+$/, '');
+	}
+	return normalizedEndpoint;
+}
 
 export function fromHexCodePoint(hex: string): string {
 	return String.fromCodePoint(Number.parseInt(hex, 16));
@@ -19,14 +29,18 @@ export function getTwemojiURL(codePoints: string): string | null {
 	if (MODE === 'test' || !codePoints) {
 		return null;
 	}
-	const key = `${RuntimeConfig.staticCdnEndpoint}:${codePoints}`;
+	const origin = getStaticOrigin();
+	const key = `${origin}:${codePoints}`;
 	const cached = TWEMOJI_URL_CACHE.get(key);
 	if (cached !== undefined) {
 		return cached;
 	}
-	const url = `${RuntimeConfig.staticCdnEndpoint}/emoji/${codePoints}.svg?v=${TWEMOJI_VERSION}`;
+	const url = `${origin}/emoji/${codePoints}.svg?v=${TWEMOJI_VERSION}`;
 	if (TWEMOJI_URL_CACHE.size >= TWEMOJI_URL_CACHE_LIMIT) {
-		TWEMOJI_URL_CACHE.clear();
+		const oldest = TWEMOJI_URL_CACHE.keys().next();
+		if (!oldest.done) {
+			TWEMOJI_URL_CACHE.delete(oldest.value);
+		}
 	}
 	TWEMOJI_URL_CACHE.set(key, url);
 	return url;
@@ -35,11 +49,3 @@ export function getTwemojiURL(codePoints: string): string | null {
 export function getEmojiURL(unicode: string): string | null {
 	return getTwemojiURL(convertToCodePoints(unicode));
 }
-
-export function getTwemojiSvg(_codePoints: string): TwemojiComponent | null {
-	return null;
-}
-
-export function getEmojiSvg(_unicode: string): TwemojiComponent | null {
-	return null;
-}