Директива `wire:poll`⚓︎

Опрос — это методика, используемая в веб-приложениях для «опроса» сервера (отправки запросов через регулярные интервалы) для получения обновлений. Это простой способ поддерживать актуальность страницы без необходимости использования более сложных технологий, таких как WebSockets.

Базовое использование⚓︎

Использование опроса в Livewire настолько же просто, как добавление wire:poll к элементу.

Ниже приведён пример компонента SubscriberCount, который показывает количество подписчиков пользователя:

<?php

namespace App\Livewire;

use Illuminate\Support\Facades\Auth;
use Livewire\Component;

class SubscriberCount extends Component
{
    public function render()
    {
        return view('livewire.subscriber-count', [
            'count' => Auth::user()->subscribers->count(),
        ]);
    }
}

<div wire:poll>
    Подписчики: {{ $count }}
</div>

Обычно этот компонент показывал бы количество подписчиков пользователя и никогда не обновлялся бы до тех пор, пока страница не будет перезагружена. Однако благодаря wire:poll в шаблоне компонента он теперь будет обновляться каждые 2,5 секунды, поддерживая актуальное количество подписчиков.

Вы также можете указать действие, которое будет выполняться через интервал опроса, передав значение в wire:poll:

<div wire:poll="refreshSubscribers">
    Подписчики: {{ $count }}
</div>

Теперь метод refreshSubscribers() компонента будет вызываться каждые 2,5 секунды.

Управление таймингом⚓︎

Основным недостатком опроса является то, что он может быть ресурсоёмким. Если у вас тысяча посетителей на странице, использующей опрос, каждые 2,5 секунды будет срабатывать тысяча сетевых запросов.

Лучший способ сократить количество запросов в этом сценарии — просто увеличить интервал опроса.

Вы можете вручную управлять частотой опроса компонента, добавив желаемую продолжительность к wire:poll следующим образом:

<div wire:poll.15s> <!-- В секундах... -->

<div wire:poll.15000ms> <!-- В миллисекундах... -->

Фоновое ограничение⚓︎

Для дальнейшего сокращения серверных запросов Livewire автоматически ограничивает опрос, когда страница находится в фоновом режиме. Например, если пользователь оставляет страницу открытой в другой вкладке браузера, Livewire уменьшит количество запросов опроса на 95%, пока пользователь не вернётся на вкладку.

Если вы хотите отказаться от этого поведения и продолжать опрос постоянно, даже когда вкладка находится в фоновом режиме, вы можете добавить модификатор .keep-alive к wire:poll:

<div wire:poll.keep-alive>

Ограничение области видимости⚓︎

Ещё одна мера, которую вы можете предпринять для опроса только при необходимости, — это добавить модификатор .visible к wire:poll. Модификатор .visible указывает Livewire опрашивать компонент только тогда, когда он виден на странице:

<div wire:poll.visible>

Если компонент, использующий wire:visible, находится внизу длинной страницы, он не начнёт опрос, пока пользователь не прокрутит его в область видимости. Когда пользователь прокрутит страницу дальше, опрос снова прекратится.

Справочник⚓︎

wire:poll
wire:poll="действие"

Модификаторы⚓︎

Модификатор	Описание
`.[число]s`	Интервал опроса в секундах (например, `.15s`)
`.[число]ms`	Интервал опроса в миллисекундах (например, `.15000ms`)
`.keep-alive`	Продолжать опрос, даже когда вкладка находится в фоновом режиме
`.visible`	Опрашивать только тогда, когда элемент виден в области просмотра

Директива wire:poll⚓︎