Google PageSpeed Insights 是很多人會拿來當成指標的判斷
但是以我目前粗略的研究，她並非網站載入速度快慢的絕對標準，而是對網頁的三大結構 HTML、CSS、JavaScript 評分

分數怎麼評斷出來的，其實非常非常複雜，不過大略可以找出幾個大方向
而且 Google 也有針對 WordPress 架構的網站給予相對應的改善建議

1. 圖片載入盡量改用 WebP 等其他新格式
2. 善用 Lazy load 外掛，隱藏不是一開始就顯示的圖片，加快載入速度
3. 延遲 render-blocking 資源，或將資源包覆到原始的 HTML 中
4. 清除用不到的 CSS 資源
5. Text compresstion，也就是將 JS、CSS 等外部資源作 GZIP 壓縮

因為瀏覽器會等到 HTML 中「所有的」CSS 都載入了，才會開始處理畫面，也就是執行 FCP ( First contentful paint )，所以在 CSS 沒載入完成前畫面是全空白的
根據統計的數據，這樣會造成 user bounce ( 也就是懶得等直接離開網頁，尤其是行動裝置用戶 ) 的比例高達 53%

因此，分離出必要的 ( critical ) 與非必要的 ( non-critical ) 的 CSS style 後讓兩種 CSS 在不同的點載入 ( 先載入 critical，將 non-crital 往後擺 ) 就變成拉高分數的要件

其實現在的網頁越寫越複雜，對 WordPress 用戶來說，手動整理 CSS 是一件繁瑣到幾乎不可能的工作
因為隨便一個主題列出來的 CSS 可能都高達好幾百 KB，甚至還是 minify 過的，讓手動整理變得更不可能
即使有 Google Chrome 的 Coverage 協助分離，也依然耗時又花精神

關於 JavaScript 的部分，比起 CSS 則稍微沒那麼繁瑣，善用 defer 將非必要的 JavaScript 延後載入
因為 JavaScript 不像 CSS 對於 FCP 來說占了很大的影響比例，所以可以用一些手動的方式做處理

// WordPress defer JavaScript
add_filter('script_loader_tag', 'wp_defer_scripts', 10, 3);

function wp_defer_scripts($strTag, $arrHandle, $strSrc){
	$arrDeferScripts=array( 
		'admin-bar', 
		'comment-reply');

	if(in_array($arrHandle, $arrDeferScripts)){
		return '<script src="'.$strSrc.'" defer="defer" type="text/javascript"></script>';
	}

	return $strTag;
}