Livewire 4 is the biggest release yet—featuring single-file components, islands for isolated rendering, built-in drag and drop, optimistic UI, scoped CSS and JavaScript, and more.

Laravel News

Livewire 4 introduces single-file components with scoped CSS and JavaScript, islands for isolated rendering, built-in drag-and-drop, optimistic UI directives, and improved routing. Components can now be written in a single file with a lightning bolt emoji prefix, or organized in multi-file directories. Islands enable independent updates of component regions without re-rendering the entire component, improving performance from database queries to DOM updates. New features include native drag-and-drop sorting, smooth transitions via the View Transitions API, optimistic UI directives like wire:show and wire:text, and enhanced JavaScript interoperability with wire:ref, #[Json] methods, and interceptors. The release maintains backwards compatibility with existing class-based components.

Everything new in Livewire 4