我總是在思考JS的優化問題，現在大多數人通過使用Less，Sass或其他方法將所有的CSS結合到單個文件中。但來到JS我對這種方法有點猶豫，因爲有插件，框架和你自己的代碼。只是想知道是否有一個規則或最佳做法來處理。結合JS文件的最佳實踐
所以我應該把我所有的JS整合到單個JS中，包括插件，框架，庫和我自己的代碼，或者將它們模塊化。
我知道這可能取決於項目的規模，但是什麼是衡量標準，什麼時候應該將所有項目合併爲一個或模塊化。我應該遵守任何規則嗎？
任何建議表示讚賞。
結合和縮小你自己的開發JavaScript通常是一個好主意。如果請求過多（尤其是在有多個小文件的情況下），則有多個HTTP請求可能會減慢加載時間。 Google PageSpeed Insights給出了一些關於如何去做的指導here。
由於@veroxii說，大多數人最終使用「構建」，因爲縮小和手動組合一切將是一個巨大的浪費時間。對於我工作的小型網站，實際上並沒有內置縮小系統，我喜歡使用gulpjs以及gulp-uglify和gulp-concat來縮小和組合javascript資源。
組合時必須小心，因爲通常情況下，腳本將取決於其他腳本。假設你有兩個腳本你合併，scriptB依賴於scriptA。如果瀏覽器在scriptA之前加載並運行scriptB，因爲它首先出現在組合文件中，那麼就會發生不好的事情。請注意您的腳本組合或使用類似requirejs的東西。
當使用從CDN（如jQuery）加載的第三方腳本（使用它們提供的生產script.min.js資源除外）時，無法在縮小或組合方面做很多工作。您可能會下載他們的腳本並將其引入您的縮小過程，但大多數用戶更可能已經擁有由瀏覽器緩存的CDN版本。
關於JavaScript最大的問題是確保腳本的加載不會阻止頁面的渲染。大多數JavaScript沒有內容就沒用，所以爲什麼不先讓內容加載，然後加載到腳本中？用戶將首先看到內容，然後進行交互，因此按照該順序加載這些資源可能是一個好主意。 More on that here。將腳本標記放在頁面底部，使用async屬性，或使用異步JavaScript加載器，如loadJS或requirejs。
真棒答案謝謝，非常詳細的解釋。 – Bruce 2014-08-29 01:10:55
你在服務器端使用哪個框架？大多數框架都帶有已經內置或作爲插件的「資產管道」。
例如Django的有https://django-pipeline.readthedocs.org/en/latest/和Grails具有http://grails.org/plugin/asset-pipeline
這確實你問及更多的東西。我敢肯定，在服務後端使用的任何東西都有相似之處。
編輯：澄清 - 我不認爲這是人們做的手動。他們有一個工具可以在運行中或構建/部署時進行。
按照它們依賴的順序組合和縮小。框架將是最上面的文件 – 2014-08-29 00:45:53
確定您的方法是將所有內容合併爲一個，我使用Requrie.js它可以將所有內容合併爲一個。綜合規模會成爲一個問題嗎？我知道gzip可能會幫助傳輸文件。 （我的聯合（eveything）可能高達約400-500k） – Bruce 2014-08-29 00:47:43
如果你的js文件太大而無法轉移，那麼你正在做一些嚴重錯誤的事情。 – 2014-08-29 00:49:52