Defer loading table

[mattusik]

Can you please advise me how to achieve defer loading for table component?

[lrljoe]

In what way are you looking to defer loading?

Is there an event you're waiting for?

Is the Table a child component of another Livewire component?

[mattusik]

I would like to render filter and empty table (kind of skeleton) on page load and trigger data loading right after page load.

With this approach the UI will be much more responsive. Currently, waiting couple seconds to render table on initial page load is not good.

[lrljoe]

Can you post the final query that you're using? It certainly shouldn't be taking seconds to render the table.

Which filters are you using?

[John-C2]

I have a similar need, we render a few tables on the page at once with decently large data sets and waiting for all of the tables to fully load adds 3-4 seconds to the overall page load. Would prefer to have the page load first and then the tables like with wire:init.

[lrljoe]

You could do this by wrapping the components in your blade, and using the Livewire deferred loading to set it to true.

[John-C2]

I did wrap them inside their own deferred components which does work well and sped up page load a lot. Adding a simple defer property that can be set vs having an empty wrapper component for every table would be awesome if it fits into the roadmap somewhere but wrapping does solve my more immediate issue I was looking at. Thanks!

[lrljoe]

I'll log the feature request, and I'm hoping that once v3 is out, we can publish a roadmap showing what is in the pipeline.

[lrljoe]

Worth noting that with Livewire v3 (and thus v3 of this package), deferring child components is slightly smoother.

I'm definitely looking at options as a whole though, even if not for an initial v3 release

[kimcee]

Would lazy loading help with this? https://livewire.laravel.com/docs/lazy

[booni3]

Yep

#[Lazy]
class Table extends DataTableComponent
...