Dagger Components: Потужна альтернатива компонентам Blade у Laravel

Компоненти Laravel Blade вже давно є стандартним рішенням для повторно використовуваних UI-елементів. Проте стандартна система компонентів іноді може здаватися обмеженою, особливо при роботі зі складними вкладеними структурами або великими обсягами рендерингу. Тут на допомогу приходять Dagger Components.

Dagger — це пакет для Laravel, розроблений Джоном Костером, який пропонує альтернативу Blade-компонентам. Джон створив цей пакет, щоб оптимізувати продуктивність у проектах з безліччю компонентів та зменшити накладні витрати. Окрім цього, він прагнув дослідити складні техніки компіляції, щоб впровадити такі функції, як передавання атрибутів, передавання слотів та кешування атрибутів.

Компілятор Dagger обробляє шаблони компонентів перед виконанням, інтегруючи їх безпосередньо у фінальний вихідний вигляд для кращої продуктивності. Внаслідок цього стандартні події перегляду Laravel не спрацьовують, коли рендеряться компоненти Dagger.

Щоб встановити Dagger, скористайтеся командою composer:

composer require stillat/dagger

Потім запустіть команду Artisan для створення необхідних шляхів:

php artisan dagger:install

Це створить нові директорії у каталозі ресурсів вашого застосунку:

resources/
  dagger/
    views/

Dagger дозволяє створювати компоненти так само, як ви робите це зі стандартними Laravel-компонентами, але вводить новий функціональний підхід до їх визначення. У цьому новому підході першим елементом у вашому визначенні компонента повинен бути PHP-блок, де ви визначаєте компонент.

Припустимо, ми створимо простий badge компонент.

@php
use function Stillat\Dagger\component;
 
component()->props([
    'type' => 'info',
    'message'
])->validateProps([
    'type' => 'required',
    'message' => 'required',
]);
@endphp
 
<span class="badge badge-{{ $type }}">{{ $message }}</span>

Як ви бачите, ми все ще можемо визначати властивості та застосовувати правила валідації.

Згодом ми можемо використовувати цей компонент в іншому шаблоні Blade, використовуючи префікс <c-* замість стандартного <x-* префікса в Laravel. Це допомагає відрізнити їх від стандартних Blade-компонентів.

<c-badge type="success" message="New" />

Префікс можна настроїти, якщо ви хочете використовувати інший.

# Ключові особливості

Основні можливості Dagger включають:

• Доступ до даних батьків: Можливість отримувати дані батьківського компонента за допомогою директиви Blade @aware.
• Валідація властивостей: Використання вбудованих правил валідації Laravel для перевірки властивостей компонентів.
• Атрибути компілятора: Наприклад, атрибут #id для іменування вкладених компонентів.
• Кешування компонентів: Використання функції кешування Laravel для кешування ваших компонентів за допомогою атрибута компілятора #cache.
• Передавання атрибутів та властивостей: Потужна функція, що дозволяє встановлювати та перевизначати властивості та атрибути на вкладених компонентах.
• Передавання слотів: Можливість встановлювати вміст глибоко вкладених компонентів.
• Обрізка виходу: Виконання обрізки виходу компонента перед його рендерингом на клієнті.
• Шаблони: Дозволяють споживачам компонентів перевизначати іменовані секції компонента, подібно до слотів, але на етапі компіляції, а не під час виконання.
• Міксини: Дозволяють вставляти дані та загальні елементи поведінки в компоненти.

Дізнайтеся більше про цей пакет, включаючи приклади просунутого використання, в офіційному репозиторії Dagger на GitHub.