No SSR

NoSsr quita a proposito los componentes de la materia de procesamiento del Lado del Servidor (SSR).

Este componente puede ser útil en una variedad de situaciones:

Escape hatch for broken dependencies not supporting SSR.
Improve the time-to-first paint on the client by only rendering above the fold.
Reducir el tiempo de procesamiento en el servidor.
Bajo demasiado pesada carga del servidor, puede activar la degradación del servicio.
Improve the time-to-interactive by only rendering what's important (with the defer property).

Aplazamiento del lado del cliente

Server and Client

<Box sx={{ p: 2, bgcolor: 'primary.main', color: 'primary.contrastText' }}>
  Server and Client
</Box>
<NoSsr>
  <Box
    sx={{
      p: 2,
      bgcolor: 'secondary.main',
      color: 'primary.contrastText',
    }}
  >
    Client only
  </Box>
</NoSsr>

Aplazar fotograma

In it's core, the NoSsr component purpose is to defer rendering. Como se ilustra en la demo anterior, puede utilizarla para diferir el renderizado del servidor al cliente.

Pero también se puede utilizar para aplazar la representación dentro del propio cliente. Puedes esperar un marco de pantalla con la propiedad diferir para renderizar los hijos. React hace 2 commits en lugar de 1.

API

<NoSsr />