Ad

Passing Whole Parameter To Vue Component From Blade Is Resulting In 30 Additional Database Queries

I have a Vue component that I'm passing some data to from my blade file as below:

<my-widget :data-aircraft="{{ $aircraft }}"></my-widget>

When I pass the entire $aircraft object to the Vue component, my application is making an additional 30 database queries. If I pass $aircraft->id, those extra 30 queries disappear. The vue component is empty in this case to aid debugging.

Am I missing something that Laravel/Vue is doing in the background when I try to send the whole $aircraft object as a prop? Is it somehow only then lazy-loading my appends attributes on my Aircraft model?

Ad

Answer

You're "echoing" the object, which means Laravel will load all the model properties and relations. If you were using the variable in blade, relationships will be loaded only when requested.

Ad
source: stackoverflow.com
Ad