Ограничение частоты в Livewire

Давайте посмотрим на быстрый набор заголовка. Если на каждую букву уходит запрос, сервер захлёбывается, хотя на экране достаточно редких обновлений.

Модификатор .throttle рядом с .live задаёт минимальный интервал между отправками. Пока пауза не вышла, лишние запросы не уходят.

Давайте создадим компонент PostPace:

php artisan make:livewire PostPace --class

Давайте добавим маршрут и страницу:

<?php
	Route::get('/posts/pace', function () {
		return view('posts-pace');
	});
?>

<x-layout>
	<livewire:post-pace />
</x-layout>

Давайте заведём свойство заголовка:

<?php
	namespace App\Livewire;
	
	use Livewire\Component;
	
	class PostPace extends Component
	{
		public $title = '';
		
		public function render()
		{
			return view('livewire.post-pace');
		}
	}
?>

Давайте свяжем поле с live и throttle, выведем свойство:

<div>
	<input
		type="text"
		wire:model.live.throttle.500ms="title"
	>
	<div>{{ $title }}</div>
</div>

Создайте компонент EmployeePace. Имя работника обновляется во время ввода, но не чаще чем раз в полсекунды.