fix(web): avoid skeleton flicker and cache overview while filtering

reaction_board/web/static/views/rankings.js

@@ -16,6 +16,21 @@ const UP_SORTS = [
   ["count", "视频数"], ["views", "总播放"],
 ];
 const METRIC_PRIMARY = new Set(["view", "like", "coin", "favorite", "share", "reply", "danmaku"]);
+const OVERVIEW_TTL = 60_000;
+let overviewCache = { at: 0, promise: null };
+
+async function getOverview() {
+  const now = Date.now();
+  if (!overviewCache.promise || now - overviewCache.at > OVERVIEW_TTL) {
+    overviewCache = { at: now, promise: api("/api/overview") };
+  }
+  try {
+    return await overviewCache.promise;
+  } catch (error) {
+    overviewCache = { at: 0, promise: null };
+    throw error;
+  }
+}
 
 function controls({ scope, sort, within, growthDays, q, folder, minVideos, folders }) {
   const sorts = scope === "up" ? UP_SORTS : VIDEO_SORTS;
@@ -87,7 +102,7 @@ export async function renderRankings(root, { query }) {
   const minVideos = query.get("min_videos") || "1";
   const page = Math.max(1, Number(query.get("page") || 1));
 
-  const overview = await api("/api/overview");
+  const overview = await getOverview();
   const folders = overview.folders || [];
 
   const params = {