Serverless AMP solution on AWS

It all started when we realized our website gets outdated very fast and we are always so busy with our customers we forget about ourselves. We had to build something amazing.

In case you are not familiar with the terms serverless, AMP and AWS — click on the words and learn more.

The technical

Everybody loves fast pages and most of our visitors are on the go — that is why we selected AMP (Accelerated Mobile Pages). We also wanted to make sure our website can handle unexpected loads, requires minimum infrastructure maintenance and is very fast — so why not go with a serverless infrastructure?

The above is just the infrastructure part. The website still needs to be generated, deployed etc. For that we used what we call the generator.

It is a system built on Laravel which is a regular non-serverless site with 1 extra feature — generating the website frontend code. The generator also takes in the standard (non-AMP, non-minified) code and makes it fully AMP and minimized to the limits. In the end we have a fast lightweight site ready to be deployed.

The deployments are automated with Jenkins. From generation and file uploads to cache invalidations — all done with a single click.

The visual

Usually, AMP pages are too minimalistic and don’t look good. We stepped in to change that. Our goal was to build a lightweight AMP page that looks good and works amazingly — and we achieved that!

There were a lot of tricky parts where we understand that with javascript it would be easy but with CSS only it is tough to do. Also, there are different sizing limits (also for CSS) so we had to work hard to keep the styles size tiny. Despite all that we made all the functionality and look as per designs. There was no place where we gave up and went with a simpler solution.

The amazing

At least that is what Google PageSpeed says about us. The infrastructure is very simple, nearly bullet proof, very easy to maintain and search engines love it. Oh, and it is not just loved by some robots and computers — it is also loved by everybody here at Magebit.

It’s a pitty that AMP doesn’t allow to host AMP js file elsewhere or have proper cache headers. This is the only reason we couldn’t reach 100/100 in Google PageSpeed. Changing the AMP js host to our CDN gives 100 points but throws a console error that the AMP source is not Google’s. Sad, but we’re still happy we reached the maximum possible score with AMP.

Another amazing fact is that the engagement and visibility in Google search grew in a lightning speed after the launch of this AMP website. The average time on site for users doubled (from ~1 minute to ~2 minutes) and our tracked keyword visibility jumped from 0.5% to 8% — that’s 16x more than we had without the AMP site.

We’re ready for new challenges

Ever wanted to have an awesome website that is lightning fast, easy to maintain and performs amazingly? Great! Let’s get in touch to discuss the details. We will make that happen.

Check out the site mentioned in this post — magebit.com or just shoot us an email to info@magebit.com.