Optimizing the frontend of the website

When you look at the performance of a website, there are many points that you can optimize. Between the start of a request and the rendered page in the browser, a lot of operations are carried out.

In this recipe, you will learn how to spot bottlenecks and optimize some things that increase the performance.

Getting ready

For this recipe, we will use two browser plugins where we can measure some metrics:

• app.telemetry: With this simple browser plugin, we can monitor the load time of each page. We can download the plugin from the following website:

  http://www.apptelemetry.com/en/page-speed-monitor.html

  This will add an icon in the browser bar where we can read the response time.

• YSlow: With this browser plugin, can we generate a report of things that we can optimize in the website. You can install the YSlow plugin to Chrome or Firefox from the following URL:

  http://yslow.org/

How it works...

The following steps describe how we can find pitfalls in the frontend...