Agrupamiento de Requests (Request Bundling)

Cada actualización de un componente en Livewire desencadena una solicitud de red. Por defecto, cuando varios componentes activan actualizaciones al mismo tiempo, se agrupan en una única solicitud.

El resultado es un menor número de conexiones de red al servidor, lo que puede reducir drásticamente la carga del servidor.

Además de mejorar el rendimiento, también se desbloquean internamente funciones que requieren la colaboración entre varios componentes (propiedades reactivas, propiedades modelables, etc.).

Sin embargo, hay ocasiones en las que se desea desactivar esta agrupación por razones de rendimiento. La siguiente página describe varias formas de personalizar este comportamiento en Livewire.

Aislando peticiones de componentes

Utilizando el atributo de clase #[Isolate] de Livewire, puede marcar un componente como «aislado». Esto significa que siempre que ese componente haga un viaje de ida y vuelta al servidor, intentará aislarse de las peticiones de otros componentes.

Esto es útil si la actualización es costosa y prefiere ejecutar la actualización de este componente en paralelo con otros. Por ejemplo, si varios componentes utilizan wire:poll o están a la espera de un evento en la página, es posible que desee aislar un componente específico cuyas actualizaciones son costosas y, de lo contrario, retrasarían toda la solicitud.

use Livewire\Attributes\Isolate;
use Livewire\Component;

#[Isolate]
class ShowPost extends Component
{
    // ...
}

Al añadir el atributo #[Isolate], las solicitudes de este componente ya no se agruparán con las actualizaciones de otros componentes.

Los componentes “perezosos” (lazy) se aíslan por defecto

Cuando muchos componentes de una misma página se cargan de forma “perezosa” (utilizando el atributo #[Lazy]), a menudo se desea que sus peticiones se aíslen y se envíen en paralelo. Por lo tanto, Livewire aísla las actualizaciones perezosas por defecto.

Si desea desactivar este comportamiento, puede pasar un parámetro isolate: false al atributo #[Lazy] de la siguiente manera:

<?php

namespace App\Livewire;

use Livewire\Component;
use Livewire\Attributes\Lazy;

#[Lazy(isolate: false)]
class Revenue extends Component
{
    // ...
}

Ahora, si hay varios componentes de Revenue en la misma página, las diez actualizaciones se agruparán y se enviarán al servidor como una única solicitud de red de carga lenta.