Add batched status endpoint and optimize frontend performance

Server-side batched /api/v1/services/status endpoint replaces N
individual browser probes with a single API call (HEAD-first with
GET fallback, concurrency-limited, CA-aware HTTPS agent).

Frontend: clock reuses DOM instead of rebuilding innerHTML every
second with drift-correcting timer that pauses on hidden tabs.
Card animations use CSS transitionDelay + requestAnimationFrame.
Internet dot blink moved from JS intervals to CSS keyframes with
prefers-reduced-motion support. Service worker rewritten with
network-first navigation, stale-while-revalidate assets, and
navigation preload. Font faces drop TTF fallbacks, use font-display
swap.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
2026-03-11 22:39:29 -07:00
parent 063bf948b1
commit 0f4bd419e1
6 changed files with 476 additions and 150 deletions

View File

@@ -25,14 +25,28 @@
function animateTopCards() {
const topCards = document.querySelectorAll('.top .card');
topCards.forEach((card, index) => {
card.style.opacity = '0';
card.style.transform = 'translateY(20px)';
setTimeout(() => {
card.style.transition = 'opacity 0.3s cubic-bezier(0.4, 0, 0.2, 1), transform 0.3s cubic-bezier(0.4, 0, 0.2, 1)';
card.style.opacity = '1';
card.style.transform = 'translateY(0)';
}, index * 150); // 150ms delay between top cards
card.style.transitionDelay = `${Math.min(index * 60, 300)}ms`;
});
requestAnimationFrame(() => {
topCards.forEach(card => card.classList.add('loaded'));
});
}
function registerServiceWorker() {
if (!('serviceWorker' in navigator)) return;
if (!window.isSecureContext && location.hostname !== 'localhost' && location.hostname !== '127.0.0.1') return;
const register = () => {
navigator.serviceWorker.register('/sw.js', { updateViaCache: 'none' }).catch((error) => {
console.warn('[init] Service worker registration failed:', error);
});
};
if (document.readyState === 'complete') {
register();
} else {
window.addEventListener('load', register, { once: true });
}
}
// Initialize dashboard (called after TOTP gate check or directly if TOTP disabled)
@@ -184,6 +198,7 @@
window.initializeDashboard = initializeDashboard;
window.loadCustomServices = loadCustomServices;
registerServiceWorker();
// TOTP-gated initialization
(async () => {