I want to build a combobox using Livewire but can't seem to wrap my head around it. The idea behind it is that I have around 6K records and would want to load them entirely in this combobox. The size of the request (just the key value pairs) is around 200KB which is fine for starters.
When I add that request in Livewire, with styling and all it turns to around 3MB in size. That's way too much.
I tried to reduce the size of the request by doing things async. I'm querying for the values using a search API.
The size has reduced to around 600KB.
But, triggering a click on one of the items in order to select the item fires a reload and another 600KB fetched from the server. That's pretty much on every iteration.
What are my options here? How would you go implementing this having internet speed constraints?
I've tried to come up with a Livewire solution to the implementation, but using Livewire to build the component didn't make sense in the end. All the backend calls made the component incredibly slow and unusable.
Still, Livewire is an amazing tool for building highly interactive front-ends without leaving the comfort of the backend.
In the end, I ended up going in the same direction the Wire UI project went and built all my inputs (when needed) with AlpineJS. Alpine plays nicely with Livewire, both being built by Caleb Porzio.