Livewire v3 Performance: Computed & Dehydration Tips | Mohamed Said [ ![Mohamed Said](https://cdn.msaied.com/01KT78WE565VEMM3PSNQAAB0MH.png) Mohamed Said Laravel Backend Engineer ](https://msaied.com) [ Home ](https://msaied.com) [ Projects ](https://msaied.com/projects) [ Articles ](https://msaied.com/articles) [ Certificates ](https://msaied.com/certificates) [ Contact ](https://msaied.com#contact-section) [ ](https://github.com/EG-Mohamed) [ Home ](https://msaied.com) [ Projects ](https://msaied.com/projects) [ Articles ](https://msaied.com/articles) [ Certificates ](https://msaied.com/certificates) [ Contact ](https://msaied.com#contact-section) [ home ](https://msaied.com) [ articles ](https://msaied.com/articles) Livewire v3 Performance: Computed Properties, Dehydration Budgets, and Wire:model Lazy On this page 1. [ The Hidden Cost of a Livewire Round-Trip ](#the-hidden-cost-of-a-livewire-round-trip) 2. [ Computed Properties and the #\[Computed\] Attribute ](#computed-properties-and-the-codecomputedcode-attribute) 3. [ Persisting Computed Results Across Requests ](#persisting-computed-results-across-requests) 4. [ Dehydration Payload Hygiene ](#dehydration-payload-hygiene) 5. [ Cutting Round-Trips with wire:model.lazy and wire:model.blur ](#cutting-round-trips-with-codewiremodellazycode-and-codewiremodelblurcode) 6. [ Practical Takeaways ](#practical-takeaways) ![Livewire v3 Performance: Computed Properties, Dehydration Budgets, and Wire:model Lazy](https://cdn.msaied.com/620/e4d958595b3e6a6b47c586df3f972938.png) #livewire #laravel #performance #frontend Livewire v3 Performance: Computed Properties, Dehydration Budgets, and Wire:model Lazy ======================================================================================== 2 Sep 2026 3 min read ![Mohamed Said](https://cdn.msaied.com/01KT78WE565VEMM3PSNQAAB0MJ.jpg) Mohamed Said Table of contents 1. [ 01 The Hidden Cost of a Livewire Round-Trip ](#the-hidden-cost-of-a-livewire-round-trip) 2. [ 02 Computed Properties and the #\[Computed\] Attribute ](#computed-properties-and-the-codecomputedcode-attribute) 3. [ 03 Persisting Computed Results Across Requests ](#persisting-computed-results-across-requests) 4. [ 04 Dehydration Payload Hygiene ](#dehydration-payload-hygiene) 5. [ 05 Cutting Round-Trips with wire:model.lazy and wire:model.blur ](#cutting-round-trips-with-codewiremodellazycode-and-codewiremodelblurcode) 6. [ 06 Practical Takeaways ](#practical-takeaways) The Hidden Cost of a Livewire Round-Trip ---------------------------------------- Every network request Livewire makes carries a JSON payload in both directions: the *hydration* snapshot coming in and the *dehydration* snapshot going out. On a small component this is negligible. On a component that holds a paginated Eloquent collection, a dozen reactive properties, and a nested form, the payload can balloon past 50 KB per keystroke — and that is before you count the PHP execution time to re-render the Blade template. Three levers give you the most leverage with the least refactoring: 1. **Computed properties with memoisation** — avoid re-querying the database on every render. 2. **Dehydration payload hygiene** — keep the snapshot small by not storing what you can recompute. 3. **`wire:model.lazy` and `wire:model.blur`** — defer the round-trip until the user actually finishes typing. --- Computed Properties and the `#[Computed]` Attribute --------------------------------------------------- In Livewire v3, any public method decorated with `#[Computed]` is memoised for the lifetime of a single render cycle. Call it ten times in your Blade template; the underlying code runs once. ```php use Livewire\Attributes\Computed; use Livewire\Component; class OrderDashboard extends Component { public int $statusFilter = 1; #[Computed] public function orders() { return Order::where('status', $this->statusFilter) ->with('customer') ->latest() ->paginate(25); } public function render() { return view('livewire.order-dashboard'); } } ``` In the Blade template you access it as `$this->orders` — no parentheses. Livewire calls the method once, caches the result in memory, and discards it after the response is sent. The result is **never serialised into the dehydration snapshot**, which is the key performance win. ### Persisting Computed Results Across Requests If the query is expensive and the underlying data changes infrequently, add a cache TTL: ```php #[Computed(cache: true, seconds: 60)] public function productCategories() { return Category::orderBy('name')->get(); } ``` Livewire stores the result in the Laravel cache keyed by component ID. Invalidate it explicitly when needed: ```php unset($this->productCategories); // clears the memoised + cached value ``` --- Dehydration Payload Hygiene --------------------------- Livewire serialises every **public property** into the snapshot. Storing an Eloquent collection as a public property is the fastest way to inflate your payload. ```php // ❌ Serialises the entire collection into the snapshot JSON public Collection $orders; // ✅ Recomputed from a cheap scalar on every hydration public int $statusFilter = 1; #[Computed] public function orders() { /* query here */ } ``` For properties you genuinely need to persist, prefer primitive scalars or small arrays. If you must persist an Eloquent model, use `#[Modelable]` or store only the primary key and re-fetch via a computed property. --- Cutting Round-Trips with `wire:model.lazy` and `wire:model.blur` ---------------------------------------------------------------- By default `wire:model` fires a network request on every `input` event — every keystroke. For a search field that triggers a database query this is expensive. ```xml ``` For real-time search where you want debouncing without a full round-trip on every character, combine `wire:model.live.debounce.400ms`: ```xml ``` This waits 400 ms after the user stops typing before sending the request — a significant reduction in server load on busy components. --- Practical Takeaways ------------------- - Use `#[Computed]` for any property derived from a database query; it is never serialised into the snapshot. - Add `cache: true` to computed properties backed by slow or rarely-changing queries. - Store only primitive scalars in public properties; reconstruct complex objects via computed methods. - Replace `wire:model` with `wire:model.blur` or `wire:model.live.debounce.Xms` on search and filter inputs. - Profile your component payload size in browser DevTools (Network tab, `livewire/update` requests) before and after — the difference is immediately visible. Found this useful? [ ](https://twitter.com/intent/tweet?url=https%3A%2F%2Fmsaied.com%2Farticles%2Flivewire-v3-performance-computed-properties-dehydration-budgets-and-wiremodel-lazy&text=Livewire+v3+Performance%3A+Computed+Properties%2C+Dehydration+Budgets%2C+and+Wire%3Amodel+Lazy) [ ](https://www.linkedin.com/sharing/share-offsite/?url=https%3A%2F%2Fmsaied.com%2Farticles%2Flivewire-v3-performance-computed-properties-dehydration-budgets-and-wiremodel-lazy) Frequently Asked Questions ---------------------------- 3 questions Q01 Does a `#\[Computed\]` property get included in the Livewire snapshot sent to the browser? No. Computed properties are evaluated during the render cycle and discarded afterwards. They are never serialised into the dehydration snapshot, which is why they are the preferred way to expose Eloquent query results to your Blade templates. Q02 When should I use `wire:model.blur` versus `wire:model.live.debounce`? `wire:model.blur` fires exactly once when the field loses focus — ideal for form fields where immediate feedback is not required. `wire:model.live.debounce.Xms` fires after the user pauses typing, making it better for live search where you want near-real-time results without hammering the server on every keystroke. Q03 Can I manually invalidate a cached computed property? Yes. Use `unset($this->propertyName)` inside any Livewire action. This clears both the in-memory memoised value and, if `cache: true` was set, the Laravel cache entry for that component instance. Continue reading More Articles --------------- [ View all ](https://msaied.com/articles) [ ![Filament v3 Table Tricks: Deferred Loading, Live Search, and Custom Filter Forms](https://cdn.msaied.com/617/2c4c33f76e69e2d61f0b6cf2918a8ad2.png) filament laravel livewire ### Filament v3 Table Tricks: Deferred Loading, Live Search, and Custom Filter Forms Go beyond the defaults with Filament v3 tables: wire up deferred loading for heavy datasets, build live search... ![Mohamed Said](https://cdn.msaied.com/01KT78WE565VEMM3PSNQAAB0MJ.jpg) Mohamed Said 1 Sep 2026 4 min read Read ](https://msaied.com/articles/filament-v3-table-tricks-deferred-loading-live-search-and-custom-filter-forms) [ ![MKSine: A Filament CMS with Plugins, Themes, and Blocks for Laravel](https://cdn.msaied.com/619/a6bec1a59695b3d3ffb212492862d25b.png) Laravel Filament CMS ### MKSine: A Filament CMS with Plugins, Themes, and Blocks for Laravel MKSine is a community-built Filament CMS that adds pages, posts, a block-based page builder, themes, menus, a... ![Mohamed Said](https://cdn.msaied.com/01KT78WE565VEMM3PSNQAAB0MJ.jpg) Mohamed Said 1 Sep 2026 4 min read Read ](https://msaied.com/articles/mksine-a-filament-cms-with-plugins-themes-and-blocks-for-laravel) [ ![Compoships: Eloquent Relationships on Multiple Columns in Laravel](https://cdn.msaied.com/618/d246f1cbcb9f9cd71afa1415b2329b51.png) eloquent laravel composer-package ### Compoships: Eloquent Relationships on Multiple Columns in Laravel Compoships lets you define Eloquent relationships, composite primary keys, and queue-safe collections across m... ![Mohamed Said](https://cdn.msaied.com/01KT78WE565VEMM3PSNQAAB0MJ.jpg) Mohamed Said 1 Sep 2026 3 min read Read ](https://msaied.com/articles/compoships-eloquent-relationships-on-multiple-columns-in-laravel) [ ![Mohamed Said](https://cdn.msaied.com/01KT78WE565VEMM3PSNQAAB0MH.png) Mohamed Said Laravel Backend Engineer ](https://msaied.com)Senior Backend Engineer specializing in Laravel, scalable SaaS platforms, APIs, and cloud infrastructure. I build secure, high-performance web applications that help businesses grow. Explore - [Home](https://msaied.com) - [Projects](https://msaied.com/projects) - [Articles](https://msaied.com/articles) - [Certificates](https://msaied.com/certificates) - [Contact](https://msaied.com#contact-section) Connect - [ hello@msaied.com ](mailto:hello@msaied.com) - [ +20 109 461 9204 ](tel:+201094619204) © 2026 Mohamed Said. All rights reserved. [ ](https://github.com/EG-Mohamed) [ ](https://www.linkedin.com/in/msaiedm/) [ ](https://wa.me/201094619204) [ ](mailto:hello@msaied.com) [ ](https://drive.google.com/file/u/0/d/1MF20IPRJyzfy32mhEutjL5EpSls0w2Q8/view)