Filament v4 je rychlejší, chytřejší a flexibilnější

Filament v4 je stabilní: velké výkonnostní vítězství, expresivnější uživatelské rozhraní řízené serverem, méně cest na server a bohatší sada primitivních prvků pro vývojáře (bohaté úpravy TipTap, vnořené zdroje, pomocníci JS na straně klienta a další). Tento příspěvek upozorňuje na nejzajímavější změny pro vývojáře Laravelu, kteří vytvářejí panely správce a interní nástroje pomocí Filamentu.

Stručný přehled (co jsem si vybral)

• Významné zlepšení výkonu vykreslování a interakce (částečné vykreslování, méně zobrazení Blade).
• Tailwind CSS v4 + dynamický systém barev (OKLCH) a vylepšený tematický systém.
• Vestavěné vícefaktorové ověřování (aplikace TOTP + e-mailové kódy).
• Výkonný bohatý editor založený na TipTapu: vlastní bloky, slučovací značky, ukládání HTML/JSON a rozšiřitelnost pomocí zásuvných modulů.
• Pomocníci JS na straně klienta, kteří eliminují zbytečné síťové požadavky: hiddenJs(), visibleJs(), afterStateUpdatedJs()a JsContent.
• Vnořené prostředky a lepší organizace prostředků (vyhrazené jmenné prostory, stránka schema() přizpůsobení).
• Tabulky podporované vlastními daty + ModalTableSelect a vylepšené hromadné akce (chunked processing, skupinové hlášení chyb).
• Malá, ale vývojáři oblíbená ergonomie: výčty ikon, FilamentTimezone, formáty data ISO a preserveFormDataWhenCreatingAnother().

Proč je to důležité

Společnost Filament již usnadnila vytváření vyladěných uživatelských rozhraní správce v systému Laravel; verze 4 ještě více snižuje tření. Výkon a částečné vykreslování snižují latenci u obrazovek s velkým množstvím dat. Háčky JS na straně klienta znamenají, že reaktivní chování uživatelského rozhraní může probíhat okamžitě bez zásahu do serveru. Nové bohaté funkce editoru a tabulek snižují potřebu vlastního kódu front-endu nebo integrace třetích stran. V kombinaci s těmito aktualizacemi můžete rychleji odesílat aplikace s menším počtem překvapení.

Nejdůležitější informace a příklady

Níže vybírám funkce, které bych označil za "povinné", a vysvětluji, jak je můžete použít v reálných projektech.

1. Zvýšení výkonu a částečné vykreslování

Filament v4 snižuje počet zobrazení Blade a extrahuje opakující se skupiny Tailwindu do tříd, aby se zmenšil výstup HTML. U velkých tabulek a složitých stránek byste měli zaznamenat mnohem rychlejší vykreslování na serveru.

Částečné vykreslování: namísto opětovného vykreslování formuláře musí na změny reagovat pouze jeho část.

2. Pomocníci JS na straně klienta, snížení počtu objížděk

Namísto načítání celého schématu při malých změnách uživatelského rozhraní umožňuje Filament v4 vyhodnocovat výrazy v prohlížeči.

Příklady:

Select::make('discount_type')
    ->options([
        'fixed' => 'Fixed',
        'percentage' => 'Percentage',
    ]);
 
TextInput::make('discount_value')
    ->hiddenJs('$get("discount_type") !== "percentage"');
 
TextInput::make('title')
    ->afterStateUpdatedJs('$set("slug", $state.toLowerCase().replace(/\s+/g, "-"))');

Můžete také použít JsContent vytvářet dynamické popisky nebo text pod obsahem, který se okamžitě aktualizuje podle toho, jak uživatel píše.

3. Bohatý editor založený na TipTap

Filament nahrazuje starší editor bohatým editorem s technologií TipTap, který je moderní, rozšiřitelný a bezhlavý. Praktické vítězství:

• Ukládání obsahu ve formátu HTML nebo JSON.
• Definujte vlastní bloky pro složité rozvržení obsahu.
• Přidání slučovacích značek umožňujících editorům vkládat zástupné symboly.

4. Vložené zdroje a čistší organizace

Pokud jste potřebovali celostránkové zobrazení pro vytváření a úpravy souvisejících modelů, vnořené prostředky vám tuto strukturu poskytnou hned po vybalení. Třídy prostředků jsou také ve výchozím nastavení generovány do vyhrazených jmenných prostorů, což udržuje rostoucí kódovou základnu v pořádku.

Stránky nyní vystavují content()/schema()-API, takže můžete plně ovládat rozvržení a pořadí komponent.

5. Tabulky a výběr UX

Tabulky mohou být podpořeny vlastními zdroji dat. Nové ModalTableSelect poskytuje modální okno podpořené plnou tabulkou Filament, což je ideální, pokud je při výběru vztahů nutné fulltextové vyhledávání, filtry a stránkování.

Pozornost byla věnována také hromadným akcím: autorizace na záznam v rámci hromadných akcí, zpracování po částech pro zvýšení výkonu a skupinové hlášení chyb.

6. Ověřování a zabezpečení

Filament v4 obsahuje podporu MFA se dvěma integrovanými poskytovateli:

• Aplikace TOTP
• E-mailové kódy

Můžete také zaregistrovat vlastní poskytovatele MFA.

7. Ergonomie vývojářů

Několik menších doplňků:

• Výčet Heroicon pro automatické dokončování IDE.
• FilamentTimezone::set() pro konzistentní práci s časovými pásmy.
• Formáty ISO pro data a časy.
• $shouldSplitGlobalSearchTerms umožňuje vypnout rozdělení globálního vyhledávacího výrazu na jednotlivá slova.
• preserveFormDataWhenCreatingAnother() - zachovat určité hodnoty při použití Vytvořit a vytvořit další akce.

Poznámky k migraci a aktualizaci

Sledujte průvodce upgradem těsně. Sledujte změny Tailwindu v4 a přeformulujte chování na straně klienta tak, aby používalo nové pomocníky JS.

Přečtěte si více

• https://filamentphp.com/content/leandrocfe-whats-new-in-filament-v4