Vistas diferidas : @defer {} @placeholder{} @loading{} @error{}

Hemos dicho que cuando definimos una vista diferida, el único bloque obligatorio es el @defer {}.

A parte del @defer podemos agregar:

@placeholder : Ya dijimos y hemos trabajado con este bloque que aparece mientras la vista no ha sido activada. Este contenido se reemplaza con el contenido principal una vez que se completa la carga.
@loading : El bloque @loadinge es un bloque opcional que le permite declarar el contenido que se mostrará durante la carga de del bloque @defer. Por ejemplo, podría mostrar una rueda giratoria de carga mientras el contenido se recupera de un servidor.
```
@defer {
  <componente></componente>
} @loading (after 100ms; minimum 1s) {
  <img alt="cargando..." src="cargando.gif" />
}
```
El bloque @loading acepta dos parámetros opcionales para especificar la mínima cantidad de tiempo que se debe mostrar el bloque y la cantidad de tiempo que se debe esperar para que comience la carga antes de mostrar la plantilla de carga. minimum y after los parámetros se especifican en incrementos de tiempo de milisegundos (ms) o segundos (s).

Al igual que @placeholder, estos parámetros existen para evitar el parpadeo rápido del contenido en el caso de que las dependencias diferidas se recuperen rápidamente. Tanto los temporizadores minimum como after para el bloque @loading comienzan inmediatamente después de que se haya activado la carga del @defer.
@error : El bloque @error permite declarar contenido que se mostrará si falla la carga diferida.
```
@defer {
  <componente></componente>
} @loading (after 100ms; minimum 1s) {
  <img alt="cargando..." src="cargando.gif" />
} @error {
  <p>Problemas con el servidor</p>
}
```
Imaginemos que se corta la conexión con el servidor, cuando se trate de recuperar el archivo que almacena <componente></componente>, se dispara el bloque @error.

Retornar

45 - Vistas diferidas : @defer {} @placeholder{} @loading{} @error{}