High Performance Website Hosting with SSL and HTTP/2 Made Simple

Erik Witt
Speed Kit Blog
Published in
6 min readMar 17, 2017

--

Hosting successful websites leaves you with a lot to take care of, from SSL encryption over CDN and browser caching to autoscaling server setups. Why not have someone else take care of all the hassle? This post will walk you through the simple 3-step process for fast, secure and scalable hosting on Baqend.

Let’s start with the example of a recently announced website. In February, we got asked on Twitter to help out the #everysecondcounts project, whose website was struggeling under heavy load. The website is presenting videos from late night shows from all over the world in which the different people ironically address President Trump to convince him of their respective country being the second greatest country in the world — after the US.

The heavy traffic after the announcement in various late night shows caused the website to break down multiple times. We stepped in and hosted the site under everymillisecondcounts.eu on our platform which includes CDN backing, SSL encryption, caching and HTTP/2. This made the site much faster and resistant to the load spikes.

The Setup

To show how to host your own website, let’s take the example of #everysecondcounts and assume you want to create a website called everymillisecondcounts.eu.

0. Create an Account

If you haven’t already, create a free account to start a Baqend app. In the background, a new autoscaling server setup is started, registered at the load balancer and connected to the CDN. The server and CDN automatically use various network optimizations and always set optimized cache-control headers.

Once the app is created, you can click on it to open your dashboard.

1. File Upload

The first thing you need to do is upload all your web assets. In the example, this is one HTML, one CSS and one JS file as well as a folder of images. You can upload the files in the Files category in your dashboard. Simply drag and drop everything into the predefined www/ folder. For the entry point to work properly, make sure your main HTML file is named index.html.

Dashboard file explorer with uploaded assets.

For larger projects you may want to use the Baqend CLI, because it enables you to easily automate the deployment task with a script or deploy from the console.

After uploading all your files, you can access your website straight away under everymilisecondcounts.app.baqend.com

2. Custom Domain

The next step is to add your own domain. Let’s say you want to be found at www.everymillisecondcounts.eu. Assuming you already own the domain, you now need to make sure it points to everymilisecondcounts.app.baqend.com. To achive this, you need to define a CNAME at your domain provider that looks like this (take a look at our Guide for more details):

www.everymillisecondcounts.eu.    IN CNAME everymilisecondcounts.app.baqend.com

Now you have to tell your Baqend app about the new domain. To do that, navigate to Settings > Hosting and then add the custom domain and press save.

Custom domain setup with DNS.

After a few seconds, your website can be accessed via the custom domain www.everymillisecondcounts.com. Now your website is online and the custom domain configured. This leaves you with one last step to go.

3. SSL and HTTP/2

To enable HTTPS and HTTP/2, click on the Request SSL Certificate button beside your domain. Now click on validate domain, to make sure the CNAME is set correctly. Finish the process by clicking on Activate SSL certificates and — that’s it! In a few minutes your site will be accessible via HTTPS.

Almost done. Finish by clicking on Activate SSL certificates.

Behind the curtains, Baqend generated a new SSL certificate using Let’s Encrypt, added it to a SAN Certificate and propagated it to the CDN for fast delivery. You will never have to renew your certificates, Baqend does that automatically for you.

To ensure that every visitor automatically uses HTTPS you can click on force SSL.

Successful HTTPS setup.

Now there is nothing left to do, except checking out how fast your website actually is.

Performance Measurements & Comparison

There are many great tools that let you analyze your website performance like WebPageTest, Google PageSpeed or GTmetrix. We like to use GTmetrix because of its extensive report features and good rendering performance. Running it from Vancouver, Canada (with our backend standing in Frankfurt, Germany), we get an inital load time of 300–400 ms for our example website everymillisecondcounts.eu (see GTmetrix report). A more comprehensive overview is given by this timing table:

Timing for everymillisecondcounts.eu measured with GTmetrix from Vancouver.

For the second visit of the website, all resources except for the HTML come from the browser cache so that the page loads virtually in an instant.

To put Baqend’s hosting performance into perspective, we also tried a few other common configurations offered by other hosters:

All load times measured from Canada with GTmetrix.
  • With standard hosting on Amazon S3 in Frankfurt (Germany) the avg. load time from the US is 3,22s with HTTP.
  • Adding SSL to the S3-hosted version, the initial load time climbs to 4,03s.
  • Hosted on Baqend (also located in Frankfurt), the avg. page load time is cut down to 440 ms for HTTP.
  • With TLS encryption enabled, avg. page load time goes down even further to 350 ms because of the use of HTTP/2.

These performance improvements translate very well to more complex and even dynamic websites, because Baqend also caches dynamic data such as complex database queries — without any staleness for clients. For a live comparison with other providers, see our performance shoot-out:

The hosting setup discussed in this post optimizes network as well as backend performance. If you feel your frontend performance needs improvements, take a look at another our blogpost on the most important web-performance techniques:

Our vision at Baqend is a web without load times and we want to give you the tools to achieve that.

Go ahead and try it for free at www.baqend.com.

Don’t want to miss our next post on web performance? Get it conveniently delivered to your inbox by joining our newsletter.

--

--