JavaScript defer 是一種用于優(yōu)化網(wǎng)頁加載性能的技術，它可以延遲腳本的解析和執(zhí)行，以允許頁面的其余內容更快地加載。在本文中，我們將深入探討 JavaScript defer 的本質、用法、好處以及與其它類似技術之間的比較。

那么，JavaScript defer 的用法是什么呢？它可以在 script 標簽中添加 defer 屬性來實現(xiàn)。以 Google Analytics 代碼為例：

<script defer src="https://www.google-analytics.com/analytics.js"></script>

在加載上述腳本時，網(wǎng)頁瀏覽器會異步地下載它，而不會阻塞頁面的其余內容。雖然腳本已經(jīng)下載了，但是它只有在整個文檔解析完成后才會解析和執(zhí)行。

那么，JavaScript defer 有哪些好處呢？它的主要優(yōu)點在于加速網(wǎng)頁的加載速度和縮短開發(fā)人員的迭代周期。假如你的網(wǎng)頁有一個龐大的 JavaScript 文件，而你沒有使用 defer 屬性，則瀏覽器必須先下載并解析整個JS文件，才能解析 DOM 樹和 CSS 樣式表。這個過程可能會卡住瀏覽器，并導致慢速的頁面加載。使用 defer 屬性會讓腳本異步加載，大大減少網(wǎng)頁的加載時間。

除了 JavaScript defer， 此外還有一些類似的技術比如 async 屬性、document.write，它們有何不同呢？async 屬性也是用于異步加載腳本，但是與 defer 不同，async 屬性不會保證腳本的執(zhí)行順序。與此相反，JavaScript defer 屬性能夠保證所有的腳本是按順序執(zhí)行的。

在一些不支持 defer 的舊的瀏覽器中，你還可以使用 document.write 技術。例如：

<script type="text/javascript">
document.write('<script defer src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"><\/script>');
</script>

使用 document.write 技術可以保留網(wǎng)頁的執(zhí)行順序，并且可以在瀏覽器不支持 defer 時使用。但是，它也有一些缺點，例如在線腳本引用不能保證被緩存，以及服務器通過各種方式無法從客戶端編寫的 JS 中獲取到相應數(shù)據(jù)。

在本文中，我們研究了JavaScript defer 的本質、用法、好處和其他類似技術之間的比較。在大多數(shù)情況下，JavaScript defer 技術可以有效地提高網(wǎng)頁的加載速度。如果你的網(wǎng)頁需要引用許多大型JavaScript 庫，那么使用defer 屬性可以讓網(wǎng)頁更快地加載完整個文檔，并縮短開發(fā)人員的迭代周期。