Tối ưu hóa file CSS cho PageSpeed Insights trên cross domain

Khi ta kiểm tra PageSpeed Insights thì thấy có 1 số file css nằm trên cross domain (nghĩa là file css này không nằm cùng domain của website - xem hình vẽ bên dưới). Vì vậy dẫn đến điểm trên PageSpeed Insights sẽ bị hạn chế. Mình sẽ hướng dẫn các bạn fix lỗi này.

Cách làm như sau : (rất đơn giản)
Bạn chỉ cần cho link file css cần nhúng vào thẻ <noscript> với id='[ten-id]'. Sau đó dùng javascript để load file css này là được.

<noscript><link href='//maxcdn.bootstrapcdn.com/font-awesome/4.6.2/css/font-awesome.min.css' rel='stylesheet'/></noscript>

var loadDeferredStyles = function () {
  var addStylesNode = document.getElementById("deferred - styles");
  var replacement = document.createElement("div");
  replacement.innerHTML = addStylesNode.textContent;
  document.body.appendChild(replacement);
  addStylesNode.parentElement.removeChild(addStylesNode);
};
var raf =
  requestAnimationFrame ||
  mozRequestAnimationFrame ||
  webkitRequestAnimationFrame ||
  msRequestAnimationFrame;
if (raf)
  raf(function () {
    window.setTimeout(loadDeferredStyles, 0);
  });
else window.addEventListener("load", loadDeferredStyles);