🚀 Введение в Server-Side Rendering (SSR) с Next.js

⚡️ Server-Side Rendering (SSR) — это процесс рендеринга страниц на сервере, что позволяет значительно улучшить SEO и ускорить время загрузки первой страницы.

Почему стоит использовать SSR?
- SEO: Поисковые системы лучше индексируют страницы с SSR.
- Быстрый первый рендер: Контент отображается быстрее, особенно на медленных устройствах.
- Предварительный рендеринг: Возможность рендерить страницы заранее и кэшировать их.

Как использовать SSR с Next.js?
Next.js — это популярный фреймворк для React, который поддерживает SSR "из коробки". Вот простой пример:

import React from 'react';

export async function getServerSideProps() {
  // Запрос данных на сервере
  const res = await fetch('https://api.example.com/data');
  const data = await res.json();

  return { props: { data } };
}

function Page({ data }) {
  return <div>{data.title}</div>;
}

export default Page;

Полезные ссылки:

Документация Next.js
SSR vs CSR: Что выбрать?(ru)