Что закэшируешь на Frontend для SSR

Для SSR на Frontend кэшируются данные, которые не меняются часто, но требуют вычислительных ресурсов для генерации:

1. HTML-страницы – результаты рендеринга на сервере
2. API-ответы – данные, полученные с бэкенда
3. Статические ассеты – CSS, JS, изображения (через Cache-Control)
4. Сессионные данные – авторизация, пользовательские настройки

Пример кэширования в Next.js:

// pages/about.js
export async function getServerSideProps({ req, res }) {
  res.setHeader(
    'Cache-Control',
    'public, s-maxage=10, stale-while-revalidate=59'
  );
  
  return { props: {} };
}

Ключевые нюансы:

• Учитывать TTL для разных типов данных
• Инвалидация кэша при изменениях
• Разделение кэша для авторизованных/анонимных пользователей
• Кэширование на уровне CDN для географически распределённых пользователей