如果 Ignite UI for jQuery 的 JS 檔案需要很長時間載入且效能很慢…
使用 Ignite UI for jQuery 的功能
- infragistics.core.js 410KB // 基本邏輯與資料來源元件
- infragistics.dv.js 3.28 MB // 圖表和地圖控件
- infragistics.lob.js 2.77 MB // 其他控件，如網格、OLAP、業務控件
需要 JS 檔案（以及 CSS 檔案），
| 使用所有功能 | 使用圖表系統 | 使用網格等 | |
| 所需的 JS 文件 | infragistics.core.js infragistics.dv.js infragistics.lob.js |
infragistics.core.js infragistics.dv.js |
infragistics.core.js infragistics.lob.js |
| 總尺寸 | 6.46MB | 3.69MB | 3.18MB |
檔案體積較大，根據網路情況，載入可能需要一些時間，這可能成為螢幕顯示速度的瓶頸。
在這種情況下，您可以使用自訂建置來提高效能。
*還有一種方法可以減少初始載入時間，即使用igLoader動態載入必要控制項的JS檔。
建立自訂構建
自訂建置是僅打包您需要的控制項的建置檔案。
未使用的控制項不包含在檔案中，從而減小了檔案大小。
結果是更快的載入時間和更高的效能。
現在讓我們建立一個自訂建置。
只需登入 IgniteUI 下載頁面並選擇您想要的控制項即可。
1）登入
請透過「下載產品版本：登入」造訪該頁面並登入。
*此處，無需登入即可繼續使用試用版。
2）版本選擇
登入後，您將能夠從版本選擇畫面中選擇產品版本，因此
請選擇您正在使用的版本。
*此處選擇「2016.1 試用版」。
3）元件選擇
然後選擇您的控制項及其功能。
其他依賴的控制項也會自動選中，所以要小心不要誤取消選中它們。
做出選擇後，按一下螢幕底部的「下載自訂版本」按鈕進行下載。
※這裡，
網格控制項
GridShared *這是網格共用功能，所以需要勾選此項目。RowSelectors
選擇
更新
選擇。
這樣就完成了自訂建置的創建。
使用自訂構建
當您解壓縮下載的 zip 檔案時，
基礎設施.js
該 JS 檔案已包含在內，因此您可以使用它來代替 core、lob 和 dv。
CSS檔案也包含在解壓縮後的資料夾中，但CSS檔案中只打包了必要的控制項。
順便說一句，讓我們檢查一下我們這次創建的自訂建置能夠減少多少。
| 網格其他 | 僅自訂建置igGird 更新/選擇功能 |
|
| 所需的 JS 文件 | infragistics.core.js infragistics.lob.js |
基礎設施.js |
| 總尺寸 | 3.18MB | 1.04MB |
與簡單讀取 core + lob 相比，我們能夠將檔案大小減少 2MB 以上。
這也將減少大約 1/3 的載入時間。
在網路速度較慢的環境中，這種差異尤其明顯。
概括
提高效能是一個簡單的術語，但解決方案會根據原因而有所不同，但如果原因是 JS 檔案載入時間，就像本例一樣，減少檔案大小是一個有效的方法。
我們向您展示如何透過使用自訂建置來減小檔案大小、加快載入時間並提高效能。