Schedule public snapshot refreshes and optimize historical loading

This commit is contained in:
devRaGonSa
2026-06-10 14:32:41 +02:00
parent 1d2af10458
commit ae5355c326
12 changed files with 1128 additions and 105 deletions

View File

@@ -1,6 +1,7 @@
(() => {
const RECENT_MATCHES_ENDPOINT = "/api/historical/recent-matches";
const RECENT_MATCHES_ENDPOINT = "/api/historical/snapshots/recent-matches";
const REFRESH_DELAYS_MS = [150, 1000, 3000, 6000];
const RECENT_MATCHES_POLL_INTERVAL_MS = 60000;
const RECENT_MATCHES_LIMIT = 100;
const DEFAULT_RECENT_MATCHES_PAGE_SIZE = 10;
const RECENT_MATCHES_PAGE_SIZES = Object.freeze([10, 25, 50, 100]);
@@ -26,6 +27,9 @@
void refreshDynamicRecentMatches();
}, delay);
});
window.setInterval(() => {
void refreshDynamicRecentMatches();
}, RECENT_MATCHES_POLL_INTERVAL_MS);
document.querySelectorAll("[data-server-slug]").forEach((button) => {
button.addEventListener("click", () => {
@@ -360,4 +364,4 @@
.replaceAll('"', """)
.replaceAll("'", "'");
}
})();
})();

View File

@@ -175,7 +175,7 @@ document.addEventListener("DOMContentLoaded", () => {
`Preparando datos ${activeTimeframeConfig.shortLabel}...`,
);
resetRecentMatchesPagination();
recentListNode.innerHTML = "";
renderRecentMatchesLoading(recentListNode);
recentNoteNode.textContent = buildRecentMatchesNote(activeServerSlug);
setState(recentStateNode, "Cargando partidas recientes...");
setSnapshotMeta(recentSnapshotMetaNode, "Cargando datos de partidas...");
@@ -637,6 +637,8 @@ function hydrateWeeklyLeaderboard(
function hydrateRecentMatches(result, stateNode, listNode, snapshotMetaNode) {
const emptyState = getHistoricalEmptyState(activeServerSlug);
if (result.status !== "fulfilled") {
resetRecentMatchesPagination();
listNode.innerHTML = "";
setState(stateNode, "No se pudieron cargar las partidas recientes.", true);
setSnapshotMeta(snapshotMetaNode, "Error al leer los datos de partidas.");
return;
@@ -666,6 +668,34 @@ function hydrateRecentMatches(result, stateNode, listNode, snapshotMetaNode) {
stateNode.hidden = true;
}
function renderRecentMatchesLoading(listNode) {
if (!listNode) {
return;
}
listNode.innerHTML = Array.from({ length: 3 }, (_, index) => `
<article class="historical-match-card historical-match-card--clean" aria-hidden="true">
<div class="historical-match-card__top historical-match-card__top--clean">
<h3 class="historical-match-card__title">Cargando partida ${index + 1}</h3>
</div>
<div class="historical-match-meta historical-match-meta--clean">
<article>
<p class="historical-match-meta__label">Mapa</p>
<strong>Preparando registro</strong>
</article>
<article>
<p class="historical-match-meta__label">Cierre</p>
<strong>...</strong>
</article>
<article>
<p class="historical-match-meta__label">Resultado</p>
<strong>...</strong>
</article>
</div>
</article>
`).join("");
}
function initializeRecentMatchesPagination(listNode) {
if (!listNode) {
return null;