Почніть вводити, щоб шукати по статтях, вакансіях, компаніях, проєктах, ресурсах, пакетах, подіях і користувачах.
553 питання з відповідями в 14 технологіях - від Junior до Senior. Оберіть технологію чи почніть з питання дня.
Пройдіть короткий тест - покажемо теми, які варто підтягнути, і питання до них.
Після кожної дії сервер повертає новий HTML компонента. Livewire не замінює ним старий цілком, а морфить: проходить обидва дерева елемент за елементом і змінює лише те, що відрізняється. Завдяки цьому зберігаються фокус, введений текст, позиція прокрутки й обробники подій.
Де морфінг помиляється. Алгоритм порівнює елементи за позицією. Якщо між ними з'являється новий елемент, він може «зсунути» відповідність:
<div><input wire:model="title"></div>
@if ($errors->has('title'))
<div>{{ $errors->first('title') }}</div>
@endif
<div><button>Зберегти</button></div>
Коли з'являється помилка, Livewire бачить на другому місці новий div і може вирішити, що це змінений старий, - результат: зайві перерисовки, втрачений стан сторонніх елементів. Livewire додає в шаблон службові маркери навколо @if і @foreach, щоб це згладити, але найнадійніший інструмент - ключі.
wire:key - ідентичність елемента:
@foreach ($todos as $todo)
<li wire:key="todo-{{ $todo->id }}">...</li>
@endforeach
Morph зіставляє елементи за ключем, а не за позицією: видалення першого рядка не змушує «перейменовувати» всі наступні. Для дочірніх компонентів у циклі ключ обов'язковий.
wire:ignore - не чіпати вміст елемента взагалі:
<div wire:ignore>
<div x-init="new Chart($el, ...)"></div>
</div>
Для сторонніх бібліотек (редактори, графіки, карти), які самі керують своїм DOM: інакше Livewire «виправить» їхні зміни назад до HTML з сервера. wire:ignore.self - ігнорувати атрибути самого елемента, але оновлювати дітей.
wire:replace - протилежне: не морфити, а замінити вміст повністю:
<div wire:replace>
<json-viewer>@json($payload)</json-viewer>
</div>
Для веб-компонентів і елементів зі своїм внутрішнім станом, який треба скинути при кожному оновленні. wire:replace.self - замінити й сам елемент.
Типові симптоми й причини:
| Симптом | Причина |
|---|---|
| введене «переїжджає» в інше поле | немає wire:key у циклі |
| сторонній віджет зникає чи ламається після дії | немає wire:ignore |
| елемент зберігає старий стан, хоча дані змінилися | морф перевикористав елемент - wire:key зі зміною ключа чи wire:replace |
| дочірній компонент не перестворюється | той самий wire:key - змінити ключ, щоб Livewire створив новий екземпляр |
Продуктивність: морфінг великого HTML (таблиця на тисячі рядків) коштує і на сервері (рендер), і в браузері (порівняння). Острівці, ліниві компоненти й пагінація зменшують обсяг, який морфиться за одну дію.
Laravel · Продуктивність
Laravel · Архітектура
Laravel · Архітектура
Laravel · Архітектура
Laravel · Продуктивність
Підтримка та розвиток великих веб-сайтів компанії (понад 1 млн відвідувань на місяць) на Laravel та OctoberCMS, інтеграція з внутрішніми системами та платіжними шлюзами (Приват24, Portmone, EasyPay, LiqPay), оптимізація продуктивності та робота з великим legacy-кодом без ризику для продакшену. Потрібен досвід PHP від 4 років, впевнена робота з Laravel і OctoberCMS, знання HTML5, CSS3 та JavaScript, вища освіта.
Розробник створюватиме та підтримуватиме інтерфейси веб-застосунку на PHP, розширюватиме наявні модулі, писатиме модульний і масштабований код та бере участь в оцінці й пріоритизації завдань. Ключовий стек: PHP, Laravel, SQL (PostgreSQL, MySQL), NoSQL (MongoDB, Redis), Docker, CI/CD. Вимоги: понад 5 років досвіду PHP backend-розробником, написання тестів (PHPUnit), якісна документація, англійська B1.
Старший розробник PHP/Laravel для бекенду живої мобільної RPG. Розробка API на Laravel, реалізація ігрових функцій на TypeScript у Nakama, оптимізація продуктивності, тестування та код-рев'ю. Потрібен досвід 5+ років у бекенд-розробці, сильні навички в Laravel/PostgreSQL, TypeScript та асинхронному програмуванні.
Питання рівня Senior з реальних технічних співбесід - 553 питання у 143 темах, розібраних із відповідями. Нижче - теми цього рівня та сусідні рівні, якщо хочете звузити або розширити підготовку.