許多CDNjs VS一個精縮當地JS

Question

<script src="//cdnjs.cloudflare.com/ajax/libs/jquery.inputmask/3.3.1/jquery.inputmask.bundle.min.js"></script> 
<script src="//cdnjs.cloudflare.com/ajax/libs/numeral.js/1.5.3/numeral.min.js"></script> 
<script src="//cdnjs.cloudflare.com/ajax/libs/Ladda/1.0.0/spin.min.js"></script> 
<script src="//cdnjs.cloudflare.com/ajax/libs/Ladda/1.0.0/ladda.min.js"></script> 
<script src="//cdnjs.cloudflare.com/ajax/libs/underscore.js/1.8.3/underscore-min.js"></script> 
<script src="//cdnjs.cloudflare.com/ajax/libs/bootstrap-modal/2.2.6/js/bootstrap-modalmanager.min.js"></script> 
<script src="//cdnjs.cloudflare.com/ajax/libs/bootstrap-modal/2.2.6/js/bootstrap-modal.min.js"></script> 

VS

<script src="/myMin.js"> 

（myMin.js將包含所有的JS文件連接到一起，並精縮） 什麼是最好的性能？我正在使用cdnjs，因爲它解決了其他地區的人員直接從我的服務器下載js文件的問題。例如，亞洲的人不必從美國服務器下載我的js文件，這是一個巨大的性能問題。 cdnjs幫助我散佈js文件遍佈全球。由於cdnjs是異步下載的，因此myMin.js何時會被優先使用？

Answer 1

我會說，使用大量的CDN參考是更可取的，因爲HTTP/2的簡單原因。

Cloudflare支持HTTP/2，我相信，所以你最好擁有多個單一目的的腳本，而不是一個組合的腳本。

從有權"HTTP/2 for Web Developers"自己的博客文章，稱"Stop Concatenating Files"節特別有意義：

然而，串聯文件不再是HTTP/2的最佳做法。雖然級聯仍然可以提高壓縮比，但它會強制使用高速緩存失效。即使只有一行CSS被更改，瀏覽器也會被迫重新載入所有的CSS聲明。

此外，並非您的網站中的每個頁面都使用連接的CSS或JavaScript文件中的所有聲明或函數。緩存後，這不是什麼大問題，但這意味着不必要的字節正在傳輸，處理和執行，以便呈現用戶訪問的第一頁。雖然HTTP/1.1中的請求開銷使得這是一個有價值的折衷，但實際上它可以減慢HTTP/2中的第一次繪製時間。

Web開發人員應該更多地關注優化緩存策略，而不是連接文件。通過隔離頻繁更改的文件和很少更改的文件，可以從CDN或用戶的瀏覽器緩存中儘可能多地提供內容。

我們都需要開始質疑這些標準技巧，以改善HTTP/2爲pretty widely supported的性能。

Answer 2

有幾件事情需要考慮做出決定。其中幾個：

性能： 建議使用CDN，因爲這些.js文件在世界各地被嚴重高速緩存。這對遠離您的原始服務器位置的用戶最有幫助。這也將幫助您節省您的原始帶寬使用，與CPU和其他資源一樣。

框架兼容性： 使用CDN文件的缺點是，如果公共圖書館有一個版本更新的任何變化，您的應用程序可能會停止一些方法或功能等方面可以從版本更改爲版本。如果您使用本地文件，則無論在公共庫上進行任何版本更新，都確信您的應用程序可以正常工作。總而言之，如果您沒有很多應用程序來支持其中一個庫中某個方法的更改會花費您很多更改操作的地方，請使用CDN版本的庫，因爲它們最終會保存你的資源;讓它成爲金錢或服務器資源。