Bootstrap 4 – Optimizing Your Website

Loosely put, website optimization refers to the activities and processes that improve your website’s user experience and visibility while reducing the costs associated with hosting your website. In his book Website Optimization, Andrew B. King summarizes this notion succinctly with the question¬†How do we make our website better?¬†(Website Optimization, Andrew B. King, O’Reilly). As such, the topic has been the sole subject of entire books, and a single chapter barely touches the tip of the iceberg. The topic is one of many facets, ranging from server-side optimization, search engine optimization, pay-per-click optimization, and client-side optimization. In this chapter, we will only discuss the latter, that is, we will be improving the loading and rendering time of MyPhoto. Specifically, this chapter is concerned with the following:

  • Speeding up the loading time of our MyPhoto index.html
  • Automating the tasks that achieve this objective

By the end of this chapter, you will understand the essential techniques behind client-side optimization. Within the context of MyPhoto, you will, therefore, learn how to do the following:

  • Reduce the overall number of HTTP requests required to render our web page
  • Automatically remove unused CSS rules
  • Make our JavaScript and CSS files smaller (commonly referred to as minification)
  • Automate the various optimization tasks
  • Optimize CSS rules

Comments are closed.