How to prevent hydrating public property

#1

I have a livewire component which has a public property $categories and i fetch this data within the mount method.

However, i have noticed (through laravel debugbar package) that this property gets hydrated every time a change is made to the component. This is making my component very slow. I have like 3000+ categories including subcategories. The categories do not change very frequently.

I am using livewire 2.3

// livewire component
public $categories;
public $amounts = [];

public function mount() {
    $this->categories = Category::with('subcategories')->get();
}

here is the blade code

// blade
@foreach ($categories as $category)
    {{$category->name}}
    <input type="text" wire:model="amounts.{{$loop->index}}"/>
    @foreach ($category->subcategory as $subcategory)
        {{$subcategory->name}}
        <input type="text" wire:model="amounts.{{$loop->index}}"/>
    @endforeach
@endforeach

So, each time I enter a value in one of the amounts fields, the $categories property gets hydrated and query data from db.

My question is, is there any way I can prevent this property from getting hydrated. as the categories does not change from a change in the component, I feel like it is useless to query again from db.

Thanks in advance

#2

convert the categories to an array rather than use as an eloquent collection.

It will then be passed backwards and forwards with every request.

If you don’t want this to happen, cache the data and fetch it from cache in the render method and pass to the view rather than it being a public property.

Depending on how you use these categories, you may be able to exclude them from your component or use wire:ignore so that they are not rendered on every view render.

#3

What worked for me was to fetch it in render method and convert the categories to an array. I did cache it too within the render method.

Thank you @Snapey