Hello everyone, I've been working on a Web Radio project for a couple of months, using Laravel and Livewire. I mainly use Livewire to avoid unnecessary page refreshes, which can disturb the user experience, such as posting a comment or updating a value in the user profile (change of name, activating/disabling unwanted sections of the page, filtering of users via search etc.)
I have various Livewire components and to give you an example I'll mention a few:
"user-profile, search-user, NavBar, Follow Button (to follow a user), Header section, Meteo Card, News Card..).
The problem is that the more I use Livewire, the more it seems that my project becomes unstable and creates bugs, sometimes even just visual, that make no sense and bug my views / controllers / vanilla JavaScript.
Example:
In the Search-User, I simply have an input and a div where, in the div the searched users are shown. At the final load of the page, to the div that displays the users, a display none is added (by I don't know what, because I've never worked on that div via JS and nothing else). I solved the problem by specifying display:flex!important; in the css but, I'm curious to know why and what causes the addition of this css style. Furthermore, Header, the Livewire component mentioned above, is the main component (persistent on every page:
@persist
<livewire:header />
@endpersist
), which deals precisely with fetching songs and making them "play" since we remember that this is a Web Radio. I added some Lazy loading to this component and, when I am in the "Search-user" section, but I scroll the page until the header is not visible, the Search User component works normally, without adding that
display:none
while when I also load the Header until the end of its Lazy Loading, its behavior changes and does what it shouldn't do. So my question is, is Livewire not optimized? If so, how should I resolve this? I have many Livewire components, and I'm starting to think that I should look at my "workbench" for a moment and, if necessary (my Ace Card), redo the components but not in Livewire, directly in Laravel, bearing the page refreshes . Does anyone have any advice for me? A thousand thanks!