什么是 SAP UI5 的 Component-preload.js, 什么是Minification和Ugification
SAP UI5 基于 MVC 架構(gòu)，一個(gè)典型的 SAP UI5 工程包含了 controller，view，component和 html 這幾種不同類型的資源文件：
這種資源文件細(xì)粒度的拆分，其優(yōu)點(diǎn)是每個(gè)文件職責(zé)清晰，符合開發(fā)人員對(duì) MVC 傳統(tǒng)架構(gòu)的認(rèn)識(shí)，因而在項(xiàng)目開發(fā)過程中，有助于SAP UI5 開發(fā)人員，在正確的位置編寫正確的代碼。
然而，開發(fā)結(jié)束后，切換到生產(chǎn)模式運(yùn)行時(shí)，這種拆分方式會(huì)給SAP UI5的性能造成一些消極的影響。
每個(gè)資源文件需要一個(gè)單獨(dú)的網(wǎng)絡(luò)請(qǐng)求去加載。
以 Jerry 的一個(gè)用于SAP UI5學(xué)習(xí)的腳手架應(yīng)用，沒有任何后臺(tái)API的依賴 為例，其加載的網(wǎng)絡(luò)請(qǐng)求如下圖所示：
和很多其他的前端框架一樣，SAP UI5 也引入了 bundling 機(jī)制，將這些單獨(dú)的開發(fā)資源，打包成一個(gè)整體，文件名為 component-preload.js.
Component-preload.js絕不是簡(jiǎn)單地將SAP UI5項(xiàng)目工程里各個(gè)文件的內(nèi)容單純地拼接出來。在內(nèi)容拼接基礎(chǔ)上，還施加了Minification和Ugification的過程。
Minification：刪除代碼中的注釋和空行，空白，以減小最終生成的Component-preload.js的尺寸。
Ugification：代碼混淆，將原始代碼中的變量名轉(zhuǎn)換成單個(gè)字符，從而進(jìn)一步減少Component-preload.js的尺寸。
看一個(gè) SAP UI5 Component-preload.js的具體例子。
在SAP UI5項(xiàng)目文件里缺少Component-preload.js時(shí)，我的UI5腳手架應(yīng)用，總共發(fā)起了43個(gè)網(wǎng)絡(luò)請(qǐng)求，頁面加載時(shí)間為 11.95秒：
而通過 SAP UI5 打包工具生成Component-preload.js后，加載該應(yīng)用一共用了32個(gè)網(wǎng)絡(luò)請(qǐng)求，減少了11個(gè)請(qǐng)求，頁面加載時(shí)間減少到10秒。
最后，SAP UI5 的 Component-preload.js 文件如何生成呢？網(wǎng)絡(luò)上提供了很多工具，Jerry 這篇文章介紹了我覺得相對(duì)來說步驟比較簡(jiǎn)單的一種辦法：
一個(gè)好用的 SAP UI5 本地打包(build)工具
更多Jerry的原創(chuàng)文章，盡在：“汪子熙”:
總結(jié)
以上是生活随笔為你收集整理的什么是 SAP UI5 的 Component-preload.js, 什么是Minification和Ugification的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。
