Web Development Interview Handbook/

...

/

Content Optimizations

Content Optimizations

Website speed is a crucial factor in the perceived quality of a website! Let's study how to maximize website speed by optimizing our content in this lesson.

We'll cover the following...

Minifying

One way to load pages faster is to reduce the number of requests.

JavaScript, CSS, and HTML files can all be compressed and turned into one file. All unnecessary spaces, line indents, and code are removed as part of the process of minifying. This significantly reduces the size of the files to be transferred, and hence saves bandwidth and speeds up your site. This is a common pre-deployment practice.

Check out this example.

Before minifying

Press + to interact
    var order = {
      "date": "11/20/2013",
      "customerId": 116,
      "items": [
        {
          "product": "Surface 4 Pro",
          "unitprice": "799",
          "amount": 1
        },
        {
          "product": "Type Cover 4",
          "unitprice": "129",
          "amount": 1
        },
        {
          "product": "Docking station",
          "unitprice": "199",
          "amount": 1
        }
      ]
    }
    console.log("Date: " + order.date);
    for (var i = 0; i < order.items.length; i++) {
      console.log("Product: "
        + order.items[i].product);
      console.log("Unit price: "
        + order.items[i].unitprice);
      console.log("Amount: "
        + order.items[i].amount);
    }

After minifying

Press + to interact
var order={"date":"11/20/2013","customerId":116,"items":[{"product":"Surface 4 Pro","unitprice":"799","amount":1},{"product":"Type Cover 4","unitprice":"129","amount":1},{"product":"Docking station","unitprice":"199","amount":1}]}
console.log("Date: "+order.date);for(var i=0;i<order.items.length;i++){console.log("Product: "+order.items[i].product);console.log("Unit price: "+order.items[i].unitprice);console.log("Amount: "+order.items[i].amount)}

Run a compression audit

The smaller the size of your files, the fewer HTTP requests made, the ...