My website was in need of an update. It had to be small, simple looking and fast. Follow my journey on how I made this website and what decisions I made.
For the backend I chose Laravel. It is a powerful and stable backend framework written in PHP. I have the most experience with this framework, so it was a no-brainer to choose this one.
Because I wanted to write some articles in the future I needed to have a way writing them. This is were Laravel Backpack comes in. With Laravel Backpack I can easily create admin/dashboard panels to maintain the content of the site. My goal was to at least make articles at a very basic level.
Because I am pretty experienced in Vuejs, the first frontend version was made with Vuejs. It was lightweight, fast and has great development tools. Content was passed through via an API. Which is probably still available right now.
But something just didn't feel right. Why should I use Vuejs for a simple blog/portfolio site? Although the homepage came in at a compact ~37kb(not counting images) it still felt big. There has to be a better way of serving this content.
Laravel provides a PHP templating system called Blade. At first I was disgusted by it, because I was so used to Vuejs. But a long the way I got more comfortable with it. I converted everything over from Vuejs to the Blade templating system. Luckily did not have to convert the css because I used Tailwindcss for the styling.
Unsurprisingly it came out way smaller than the first version. The homepage now comes in at a meager ~5kb(not counting images). Which is roughly 75% smaller, awesome!
Not everything has to be a single page application, for a website as small and simple as this one server side rendering is better. Think about what you are making and decide whether it is possible to go smaller.