Laravel is a great framework based on PHP to build a web application. It gives almost everything you’ll ever need to build a web app. When it comes to backend implementation, you’ll rarely find Laravel doesn’t cover your use case.
When Laravel is great for backend development, it is not built for front end optimization in mind. The way you show the UI to your user is through enhanced traditional PHP rendering named blade, and lately, Livewire.
Rendering the web page using Livewire is a great developer experience. But let’s face it, modern web application demands more than that. A dynamic, fast, and efficient web page is now something that your user expect. Based on my experience, you can’t achieve that bleeding edge experience with Livewire.
Laravel put Vue in it’s official documentation for front end Engine. Vue is great to develop front end web application and it covers what you can’t do with Laravel alone. But application that is built with Vue is not optimized for SEO because it requires browser to dynamically render the page using Javascript code. On the other hand, all the code that you compile for the whole app will be sent to the client, eventhough user probably don’t need that. Often results in a bulky javascript code that is included even in a simple page that don’t really need it.
Next.js comes to solve that problem. It tries to gives you the capability of both world: rendering the page on your server while also gives dynamic interaction to the user. They call it: partial rendering.
With partial rendering, Next.js intelligently decide which part of the code should be sent to the client for dynamic interaction and which part of the code should stay and run on the server to generate the end results of the response (the HTML doc).
It results on significantly more performant web application because now all the needed data can be populated on the server - reducing the network roundtrip between client and server significantly. It also improves the SEO because now the crawler will immediately get the content of your page without having to run all the javascript first - bringing back the old wise server generated content.
It’s a clever solution to the current gap between server rendered content and browser dynamic reactive interaction in the web development.
Next js developer said that partial rendering is still on the experiment, but they’re confident that in the near future this should be the default way of building the web app.
Back to Laravel. To optimize the SEO score, you might want to render part of your web page on the server using blade (or Livewire), and write the other part using Vue to give dynamic experience to user. Based on my experience, you’ll end up with mixing messy incosistent structure on the code. You’ll try to maintain some route on blade and some others on Vue. Resulting in bad development experience and less maintainable project.
I love Next.js, but I also don’t want to leave the powerful feature and great experience that Laravel offers on backend development.
I’m currently still exploring how the community can utilize the greatness of both world.
Top comments (0)