So, after we have tried to create the same page with three different tools, which one is a winner?
I will judge based on two criteria:
Judging from the amount of code I had to write/explain for this specific small project, a clear winner is Livewire.
npm run ...
steps to compile#[Url]
that solve some common issuesIn other words, Livewire "feels like home" for back-end Laravel developers.
With Vue/React, there's a learning curve of JavaScript and one of those frameworks on top.
Also, you need to know how to set up Vue/React in a Laravel project. Luckily, Laravel Breeze and Inertia helped us with this quite a lot, lowering the amount of code we needed to write manually. Otherwise, the Developer Experience difference from Livewire would be even bigger.
That said, your opinion may be different if you already come from a Vue/React background and have a lot of experience with it. Then, that JS world may feel more "like home" to you. In that case, you only need to adapt to how Inertia works to glue Laravel and JS together as a SPA.
Now, this is where it gets more tricky. For this simple project, Livewire is an excellent tool for starting off. But let's look at it from a broader perspective.
Projects start small, but they often later grow into more complex pages with more dynamic elements that need to be customized, and JavaScript offers more browser-native features.
Also, Livewire works by sending data to the server each time you need to reload something dynamically. It may become a performance issue with many dynamic elements and users browsing simultaneously. That could be another reason to choose JS, as it all then happens directly in the browser, on the client-side. Livewire also has a solution to this - offloading some functionality to Alpine.js, but it's not that popular worldwide, so it is harder to find help or the exact solutions on forums or elsewhere.
Next, what if the project needs a mobile app in the future? Livewire doesn't have any of that. But, for example, with React, you could transform the code to React Native and change Inertia to Laravel API, relatively quickly.
Finally, Livewire as a technology works only within the Laravel ecosystem. Vue/React knowledge can be ported elsewhere to other projects. So, learning JS frameworks may be more beneficial from a future career perspective.
If you don't want to choose Livewire and consider one of the JS frameworks, it's mostly a personal preference. Both are good.
Vue is a bit easier to start with in Laravel projects since much work has been done over the years to make them work seamlessly together.
Historically, Vue became popular partially because of its involvement in the Laravel ecosystem, with the creator Evan You even speaking at Laracon. However, according to the State of Laravel results, Vue has been in a slow decline in terms of market share in recent years.
React creators don't participate much in the Laravel community or integration tools, but generally, React is more widely adopted as a technology outside of the Laravel world, which may lead to more career opportunities.
At the time of writing, the latest official Laravel tools like Laravel Cloud and Nightwatch are built with the RILT stack: React + Inertia. Here's Taylor's comment about the reason for that choice.
That said, historically, the Laravel team has released the tools with other stacks:
So, at the end of the day, it's still mostly a personal choice or your team's choice within your plans for the future.
In short:
What do you think? Would you make the same conclusions? Let me know in the comments.
You can find the code in our repository. Just switch branches for different systems:
main
- Our base application without any UI on it.livewire
- Livewire Demovue
- Vue.js (Inertia) Demoreact
- React (Inertia) DemoWe recommend you play around with the code and see which is best for you.