Website History

This is the latest (third) version of the website, cool stuff here!

It seems that I like to rebuild things, but hey, this is way better! The previous versions are (yes, they are still live, see below) mainly single-page static websites with a brief overview of myself, along with some nice colorful graphic stuff. This is the shiny-brand-new version, the major overhaul ever! All has been completely rebuilt from scratch, nothing kept, with a strong focus on content and user experience, built and finely-tuned to be lighting fast.

Finally I also integrated a blog journal section, check it out!

The Back-end is built on top of a LAMP based stack using the Symfony framework and an insane caching policy powered by Redis. To achieve the best performance in delivering the website content and experience, almost everything is cached. The assets are cached by the browser and are updated using a cache-busting policy based on name-hashing (they are bundled and optimized by a nice Gulp flow).

But that's not enough, I wanted to take every single drop out of the performance juice, thus also the plain HTML is cached! Every page request to the server pass thought a Redis layer which serves directly the constructed HTML if available. Hence saving the time needed to execute database queries (Doctrine - MySQL) and call the templating system (TWIG).

What about images? They are usually one of the most heavy thing in a website! In order to address this, every single image is optimized Back-end side (LiipImagine) both in dimensions and quality to assure its downloading the fastest possible.

But let's get practical with an example: in the resume page, which counts more than 70 images (!!), I managed to reduce the page size from ~1.6MB to ~550KB, which is roughly one third, cutting more than 1MB!

The same policy has been adopted for the Front-end architecture: maximize value and performance. User experience is way more important than fancy, heavy and noisy effects (unless they have a clear purpose and are made in order to still achieve 60FPs).

Let's spend some words on accessibility as well. This website is fully responsive and adapted to pocket-sized mobile screens.

Moreover, in oder to provide the best experience to everyone, I added an emoji-layer. Why? Because not every OS supports emoji.

The problem is even bigger if you think at the new emoji released every year, and the OSs which support them display them in different ways. Hence I display custom emoji (from EmojiOne), having full control over them. You may have noticed that also Twitter and Facebook use their custom ones.

Below a list of the main technologies used for Back-end and Front-end.

• PHP
• Symfony
• Composer
• EasyAdmin bundle
• VichUploader bundle
• LiipImagine bundle
• Doctrine (DBAL + ORM)
• MySQL
• Redis
• PRedis (PHP Redis client)
• Parsedown
• Linux
• Apache
• HTACCESS
• SSL (Let's Encrypt)

• JavaScript
• jQuery
• Highlight.js
• Masonry
• CSS
• Vanilla CSS-Grid Grid Layout
• SASS
• Gulp + many related libraries (assets generation & management)
• Babel
• Yarn
• NPM

Why not use an heavy and trendy JS framework like React or Angular? The answer is actually really simple, because in this case I don't need them. Hence I prefer to keep the JavaScript stuff as lightweight as possible to improve both download time and rendering performance, thus improving user experience as well.

For the same reason I removed Bootstrap in favor of a simple, highly customizable and super-lightweight grid system based on the native CSS-Grid specifications made for the purpose (more on that).

Interested in the older versions of this website? Check out the links below, they are still live!