Cache featured streamer results for 15 seconds

src/http.ts

@@ -159,6 +159,30 @@ export function fetchJSON<T>(url: string, opts?: RequestOpts, feedback = false):
   return request<T>(url, 'json', opts, feedback)
 }
 
+type ExpiringCacheEntry = {expires: ReturnType<DateConstructor['now']>, data: any}
+const responseCache = new Map<string, ExpiringCacheEntry>()
+
+async function getFromCacheOr<T>(cacheKey: string, cacheSeconds: number, getData: () => Promise<T>): Promise<T> {
+  const cacheEntry = responseCache.get(cacheKey)
+  if (cacheEntry && cacheEntry.expires >= Date.now()) {
+    return cacheEntry.data as T
+  } else {
+    responseCache.delete(cacheKey)
+  }
+
+  const newExpirationTime = Date.now() + (cacheSeconds * 1000)
+  return getData().then((data: T) => {
+    responseCache.set(cacheKey, {expires: newExpirationTime, data: data})
+    return data
+  })
+}
+
+export function fetchCachedJSON<T>(cacheKey: string, cacheSeconds: number, url: string, opts?: RequestOpts, feedback = false): Promise<T> {
+  return getFromCacheOr(cacheKey, cacheSeconds, () => {
+    return request<T>(url, 'json', opts, feedback)
+  })
+}
+
 export function fetchText(url: string, opts?: RequestOpts, feedback = false): Promise<string> {
   return request<string>(url, 'text', opts, feedback)
 }

src/ui/home/homeXhr.ts

@@ -1,4 +1,4 @@
-import { fetchJSON } from '../../http'
+import { fetchCachedJSON, fetchJSON } from '../../http'
 import { Streamer } from '../../lichess/interfaces'
 import { PuzzleData } from '../../lichess/interfaces/training'
 import { TournamentListItem } from '../../lichess/interfaces/tournament'
@@ -8,7 +8,11 @@ interface FeaturedTournamentData {
 }
 
 export function featuredStreamers(): Promise<readonly Streamer[]> {
-  return fetchJSON('/api/streamer/featured', undefined)
+  return fetchCachedJSON(
+    'streamer/featured',
+    15,
+    '/api/streamer/featured',
+  )
 }
 
 export function dailyPuzzle(): Promise<PuzzleData> {