Be part of JetBrains PHPverse 2026 on June 9 – a free online event bringing PHP devs worldwide together.

woweya's avatar
Level 1

Livewire makes my project unstable?

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!

0 likes
1 reply
Tray2's avatar

It's tricky to say what the issue can be since you don't show any code. There is always issues with any kind of web application when you replace large parts of the contents using ajax, (yes livewire uses ajax). The trick is to make it "fixed" size to prevent flicker, there are also some tricks that prevents it. However the styling is the trickiest part.

This course will show you some of them

https://laracasts.com/series/livewire-uncovered

Please or to participate in this conversation.