Livewire v3 Lazy Components &amp; Deferred Loading | Mohamed Said       [Skip to content](#main)  [ ![](https://cdn.msaied.com/01KT78WE565VEMM3PSNQAAB0MH.png) Mohamed SaidLaravel Backend Engineer ](https://msaied.com) - [Home](https://msaied.com)
- [Projects](https://msaied.com/projects)
- [Articles](https://msaied.com/articles)
- [Certificates](https://msaied.com/certificates)
- [About](https://msaied.com#about)

           [  Contact](https://msaied.com#contact) Menu 

Menu
----

Close 

 - [HomeStart here](https://msaied.com)
- [ProjectsCase studies](https://msaied.com/projects)
- [ArticlesEngineering notes](https://msaied.com/articles)
- [CertificatesCredentials](https://msaied.com/certificates)
- [AboutHow I work](https://msaied.com#about)
- [ContactGet in touch](https://msaied.com#contact)

  [Start a conversation](https://msaied.com#contact) [WhatsApp](https://wa.me/201094619204) [Email](mailto:hello@msaied.com) 

 1. [Home](https://msaied.com)
2. /
3. [Articles](https://msaied.com/articles)
4. /
5. Livewire v3 Islands, Lazy Components, and Deferred Loading in Practice

 Livewire v3 Islands, Lazy Components, and Deferred Loading in Practice
=======================================================================

 Lazy components and deferred loading in Livewire v3 let you ship fast initial pages and hydrate heavy UI on demand. This guide shows the real mechanics, gotchas, and patterns senior engineers need.

 ![](https://cdn.msaied.com/01M22N44A70A5MC2S599JP0MPH.webp) [Mohamed Said](https://msaied.com#person) Published 6 Jul 2026 · Updated 6 Jul 2026 · 1 min read

ShareCopy linkCopied

 ![Livewire v3 Islands, Lazy Components, and Deferred Loading in Practice](https://cdn.msaied.com/374/3ae8879b93556b45a3ef3b19b1a7fd81.png) 

  On this page +1. [Why Islands Matter in Livewire v3](#why-islands-matter-in-livewire-v3)
2. [The lazy Attribute](#the-codelazycode-attribute)
3. [Providing a Placeholder](#providing-a-placeholder)
4. [Passing Data Into Lazy Components](#passing-data-into-lazy-components)
5. [Deferred Loading vs. Lazy Components](#deferred-loading-vs-lazy-components)
6. [Conditional Lazy Loading](#conditional-lazy-loading)
7. [Testing Lazy Components with Pest](#testing-lazy-components-with-pest)
8. [Key Takeaways](#key-takeaways)

 Why Islands Matter in Livewire v3
---------------------------------

A full-page Livewire component tree hydrates every component on every request. For dashboards with a dozen widgets, that means twelve round-trips of PHP work before the user sees anything interactive. Livewire v3 solves this with **lazy components** — components that render a placeholder on the initial page load and hydrate asynchronously over a subsequent HTTP request.

This is the "islands" mental model: static HTML is the sea, and interactive Livewire components are islands that boot independently.

---

The `lazy` Attribute
--------------------

Making a component lazy is a single attribute on the `
