JavaScript 的預加載是提高頁面展示速度的重要手段之一。隨著網頁越來越豐富，頁面中嵌入的 JS 腳本、CSS 樣式表、圖片等資源的數量也越來越多，頁面加載速度也會相應變慢。而預加載則可以讓這些資源在頁面渲染前就提前加載，從而縮短用戶等待時間，提高用戶體驗。
預加載的方式也多種多樣。其中最簡單的一種方式是將 JS 腳本或 CSS 樣式表放在網頁的頭部區域。因為瀏覽器在渲染頁面時會按順序解釋 HTML 文檔，頭部區域的代碼自然會優先被加載，從而縮短了用戶等待時間。例如：
<html> <head> <link rel="stylesheet" href="style.css"> <script src="script.js"></script> </head> <body> <!-- 頁面正文 --> </body> </html>
另一種預加載方式是通過 JavaScript 實現。以下是一段常見的預加載圖片的代碼：
function preloadImage(url) {
var img = new Image();
img.src = url;
}在上面的代碼中，我們創建了一個新的 Image 對象，然后將要預加載的圖片的 URL 賦值給它的 src 屬性。這樣一來，瀏覽器在加載頁面時就會自動預下載這個圖片，從而縮短了用戶等待的時間。當然，如果有多個圖片需要預加載，我們可以將它們放在一個數組中，然后一一調用 preloadImage() 函數就可以了。例如：
var images = [
'image1.jpg',
'image2.png',
'image3.gif'
];
for (var i = 0; i < images.length; i++) {
preloadImage(images[i]);
}需要注意的是，預加載過多的資源可能會導致頁面加載速度變慢。因此，我們需要根據實際情況來判斷哪些資源需要預加載，哪些可以延遲加載，以達到最優的用戶體驗。
除了前面提到的兩種預加載方式，還有一種更為高級的方式——異步預加載。異步預加載是在頁面渲染過程中并行加載資源，從而進一步提高頁面展示速度。異步預加載可以通過以下代碼實現：
var script = document.createElement('script');
script.src = 'script.js';
document.body.appendChild(script);在上面的代碼中，我們首先創建了一個新的 script 元素，然后將要異步加載的腳本的 URL 賦值給它的 src 屬性。接著，我們將這個 script 元素添加到 body 元素中，這樣就可以在頁面渲染過程中異步下載腳本文件。當然，這也只是異步預加載的基本實現方式，比起其他一些高級的實現方式，它可能并不是最高效、最穩定的。
總之，JavaScript 的預加載是優化頁面性能的重要手段之一。通過合理地預加載 JS 腳本、CSS 樣式表和圖片等資源，我們可以縮短用戶等待的時間，提高用戶體驗，從而讓我們的網頁更加美觀、流暢。