關于javascript模塊加載技術(shù)的一些思考
前不久有個網(wǎng)友問我在前端使用requireJs和seajs的問題,我當時問他你們公司以前有沒有自己編寫的javascript庫,或者javascript框架,他的回答是什么都沒有,他只是聽說像requirejs和seajs是新東西新技術(shù),很有價值所以想用它。
這位網(wǎng)友的問題引起了我對javascript模塊加載技術(shù)的思考,上篇文章我給出了自己寫的一個javascript庫的基本結(jié)構(gòu),其實寫這篇文章的一個起因就是因為我想使用requirejs或者seajs這樣的技術(shù)來重新設計我寫javascript庫的基本模型,當我深入了解這個技術(shù)后,我發(fā)現(xiàn)使用模塊加載系統(tǒng)來解決把javascript庫里通用代碼和業(yè)務代碼解耦的問題,是不正確的,模塊加載系統(tǒng)的作用范圍是解決不同javascript庫之間的依賴問題,而不是幫助你去如何開發(fā)一個javascript庫。
那么什么是javascript的模塊加載系統(tǒng)呢?
模塊系統(tǒng)主要為了解決不同javascript庫里操作對象的命名沖突問題以及不同javascript庫之間依賴的問題,模塊加載系統(tǒng)是針對大型web前端應用或者說是巨型的web前端應用。
一般巨型的web前端應用頁面里,該頁面的功能非常豐富,業(yè)務非常龐雜,而且隨著時間推移,頁面的功能經(jīng)常會發(fā)生變遷,所以導致前端開發(fā)人員經(jīng)常要開發(fā)出針對新功能的功能模塊,但是實際業(yè)務里各個功能模塊之間的功能還有可能相互滲透,相互依賴的,關系錯綜復雜,當頁面復雜后,各個前端庫之間的關系就出現(xiàn)很難管理和控制的問題,這個時候模塊加載系統(tǒng)才會派上用場。
對于大多數(shù)程序員而言,能獨立承擔這么大web前端應用的機會并不是太多,而開發(fā)中小型web前端應用的機會會多的多,例如企業(yè)級的web項目,這樣的項目使用到的javascript庫的種類很少,各個庫的依賴關系很好控制,是沒有必要引入什么模塊管理系統(tǒng)的必要,就算很多中小型互聯(lián)網(wǎng)公司的網(wǎng)頁,估計也不會比企業(yè)級web應用前端那么復雜,所以它的模塊之間或者說javascript庫之間的關系很好管理的。其實像上面這些中小應用都是針對某些或某一個具體場景進行的,因此我個人覺得面對這樣的web前端項目我們最后能自己形成一個獨立的javascript庫,這個庫的特點應該和jQuery這種類型的庫類似:一個主庫加上若干個插件庫的模式,主庫的目的是解決通用性的問題,它應該是可以進行復用和遷移的,而插件庫的目的往往和業(yè)務代碼相關的,不過為了區(qū)別主庫和插件庫的作用域問題,所以我在庫里加上了命名空間的功能。
Javascript模塊加載技術(shù)和hadoop的技術(shù)有些相同點,那就是它們都是針對超大型系統(tǒng)的技術(shù),它們只有在一定條件下才能發(fā)揮它們的作用,所以這些技術(shù)都是從大型互聯(lián)網(wǎng)公司推出出來,因為大型互聯(lián)網(wǎng)公司隨著應用變大變復雜后必須要去解決的問題,當你系統(tǒng)還是處于起步階段,這些技術(shù)的運用往往要謹慎,我們應該找出最簡單最有效的方法解決我們實際問題,如果你覺得這個系統(tǒng)以后會越來越大,那么你應該保留以后使用這些技術(shù)的接口,如果使用太早了,很有可能當系統(tǒng)規(guī)模擴大后,你重構(gòu)代碼的代價會更高。
對于模塊加載系統(tǒng),它最適合的場景是解決大型web前端應用模塊之間的解耦的問題,如果我們只要新寫一個javascript文件就馬上使用模塊加載技術(shù),這個不是有點濫用技術(shù)的嫌疑了,我們運用某個技術(shù)之前不應該只是考慮它怎么用,如何用,應該還要想想使用它有沒有價值的問題。
最后我想說的是,我覺得中小型web前端應用到了生產(chǎn)部署,因為javascript并非最復雜,所以所有外部javascript文件都打包成一個javascript外部文件最好,這樣的好處就是減少了http請求個數(shù),使用模塊加載技術(shù)會讓你打包文件操作很麻煩,甚至無法做到(像requirejs和seajs的模塊都是以文件為單位的,每個模塊就是一個獨立文件),這和解決減少http目的是相悖的。
相關文章
JavaScript 函數(shù)惰性載入的實現(xiàn)及其優(yōu)點介紹
惰性載入表示函數(shù)執(zhí)行的分支只會在函數(shù)第一次掉用的時候執(zhí)行,在第一次調(diào)用過程中,該函數(shù)會被覆蓋為另一個按照合適方式執(zhí)行的函數(shù),這樣任何對原函數(shù)的調(diào)用就不用再經(jīng)過執(zhí)行的分支了2013-08-08
JS+CSS實現(xiàn)模仿瀏覽器網(wǎng)頁字符查找功能的方法
這篇文章主要介紹了JS+CSS實現(xiàn)模仿瀏覽器網(wǎng)頁字符查找功能的方法,實例分析了javascript實現(xiàn)查找功能的樣式及相關技巧,具有一定參考借鑒價值,需要的朋友可以參考下2015-02-02
元素的內(nèi)聯(lián)事件處理函數(shù)的特殊作用域在各瀏覽器中存在差異
在一個元素的屬性中綁定事件,實際上就創(chuàng)建了一個內(nèi)聯(lián)事件處理函數(shù)(如<h1 onclick="alert(this);"...>...</h1>),內(nèi)聯(lián)事件處理函數(shù)有其特殊的作用域鏈,并且各瀏覽器的實現(xiàn)細節(jié)也有差異。2011-01-01
asp.net下利用js實現(xiàn)返回上一頁的實現(xiàn)方法小集
其實要實現(xiàn)這個功能主要還是要用到javascript2009-11-11

