為什麼需要自己實現前端框架

2021-09-08 17:16:01 字數 2360 閱讀 6456

前端對框架(庫)的大小更敏感

便於制定載入策略

核心部分的js在發布時,可對檔案合併,數量盡可能少,單個檔案在gzip壓縮後最好不要超過20k。核心部分可以是實現「js語言擴充套件(物件導向),dom操作api,資料互動方法(ajax),導航策略,模組化底層實現,事件底層實現,模版解析」等。擴充套件部分一般是一些可非同步載入的ui元件,例如:輸入控制項、彈出窗、動畫api、檔案上傳及預覽、圖表控制項、富文字編輯器等。

上面的實現模式,在主流的js框架(庫)中,有三類選擇:一類是以extjs為代表的大而全的框架(庫),這類框架雖然功能滿足,但往往無法拆分為核心部分和擴充套件部分來載入,因此基本不予考慮;一類是相對輕量的yui3、dojo等框架(庫);一類是近來流行的前端mv*系列backbone、ember、angular,這類在充當核心部分時,還需要組合underscore、requirejs,jquery等第三方庫。

後面兩類可以滿足要求,但個人覺得不是完美的方案,因為在開發實際產品時,將這兩類作為核心部分時,往往裡面有很多是不需要的,而還有些需要自己來額外補充近來,可以是自己開發,也可以整合第三方的實現。而核心部分框架(庫)如果是自己實現,則可以保證在功能完整的情況下,不多出其它的東西,載入的js可以控制到最小,而且**風格也統一。

便於擴充套件

前端**與使用者的互動直接相關,而互動的設計變化和不確定性非常大,現成的第三方實現往往難以直接利用,需要改造。有時改造第三方的框架,先要非常熟悉框架,當這個框架比較複雜時,這樣的工作量和難度就大大加大了。而自實現的框架(庫)則可以根據需要任意擴充套件,可以根據需求制定對應的規範和api。

便於統一開發規範

不同的js框架(庫),呼叫方式往往也不同(模組化規範,dom操作api,物件導向語法糖等)。在使用第三方框架(庫),特別是組合多個第三方框架(庫)時,如果要實現產品**書寫規範的一致,需要實現自己**來包裝第三方框架(庫),達到呼叫介面的書寫風格一致。自己實現的框架(庫)則可以免去這一步驟。

減少公升級帶來的風險

有些第三方框架(庫)在版本公升級後,api、瀏覽器相容性支援度、實現理念可能會發生變化。例如:extjs3和extjs4的差別就非常大,如果產品急於extjs3開發,想公升級到4幾乎就要做產品重構了,而且extjs4不再支援低版本ie瀏覽器。當組合使用多個框架(庫)時,其中乙個公升級也可能會引起彼此之間的相容性問題。還有可能出現引用的框架(庫)在公升級前,在產品中沒有出現問題,公升級後,因為框架(庫)的理念變化,導致不再適合在當前產品中使用,否則會出現效能問題。

什麼情況適合使用第三方實現

(1) 非「核心庫、影響到產品整合與結構的部分、常用ui元件」

為了保證效能和擴充套件的方便,核心包和常用的ui元件可以選擇自實現。因為難以找到乙個第三方框架可以包含所有的核心包所需的功能,這樣核心包就會由多個第三方包組合加上部分的自行實現。在組合第三包時,往往會帶來很多不需要的**,這樣就不能保證核心包的精簡。ui元件往往因為需要依賴於一些核心庫(框架),常用的ui元件自己實現,一來是可以依賴自己的核心庫(框架),減少大小,一來是這些常用ui元件往往會在系統的中大量使用,對頁面的的視覺等待載入時間會有大的影響,或者是有深入的個性化需求,自己實現量身打造,並且方便擴充套件。

(2) 複雜的ui元件

複雜的ui元件,例如:富文字編輯器,日曆,動畫效果,圖表等。這些不會影響產品的架構,技術方向和效能,而實現又比較複雜,當產品需要時,可以選擇合適的第三方實現,通過模組化方式非同步載入。如果有個性化需求,而其又沒有擴充套件介面,則可嘗試修改其原始碼。

(3) 檔案小、依賴少、功能單一

很多人會將自己些的一些框架(庫)放到github上開源。像kissy,qwrap等大而全的框架(庫)很少會有人去將其用到自己的產品中,一般是去學習它們的實現理念。而對於seajs等只實現單一功能,並且檔案小,不依賴其它第三方庫(框架)則大受歡迎,很多公司和個人都在自己的產品中使用。

(4) jquery

jquery是個特例,雖然一般只用到了它的dom操作和ajax相關的api,這種情況下,要引入乙個gzip壓縮後30多k的檔案,不算小了。但是jquery太流行,它的寫法已經成了前端開發事實上的規範,大家都會用它,而且很多第三方ui元件/框架/庫都依賴它。

最後的總結

上面提到的問題的性質需具體情況具體分析,根據應用產品的場景和開發團隊要求,可能是大問題,也可能不是問題。如果有乙個穩定的前端團隊,並且開發的產品打算長期優化,那麼積累並完善自己的框架(庫)就非常有必要了。當團隊沒有積累,而又有產品開發的進度限制時,可以根據產品的形態和場景,先選擇成熟的第三方庫(不一定是當前非常流行的),在長期的產品的優化和完善過程中會不斷發現問題並解決問題,這個過程可以逐步來構建和完善自己的框架(庫)。

為什麼使用前端框架

剛工作那會,前端都是用html css js來寫的,現在各種前端框架層出不窮,基本都是引入前端框架來構建前端,為什麼?一 什麼是框架 框架是乙個可復用的設計構件,它規定了應用的體系結構,闡明了整個設計 協作構件之間的依賴關係 責任分配和控制流程,表現為一組抽象類以及其實例之間協作的方法,框架的關鍵還...

vue ui框架 你為什麼要使用前端框架Vue

1.前端框架的根本意義 1.1 前端框架的好處 最開始學習前端框架的時候 我第乙個框架是 react 並不理解框架能帶來什麼,只是因為大家都在用框架,最實際的乙個用途就是所有企業幾乎都在用框架,不用框架就 out 了.隨著使用的深入我逐漸理解到框架的好處 1.2 前端框架的根本意義 簡單來說,前端框...

為什麼需要PKI

為什麼需要pki 隨著電子商務的迅速發展,資訊保安已成為焦點問題之一,尤其是網上支付和網路銀行對資訊保安的要求顯得更為突出。為了能在網際網路上開展安全的電子商務活動,公開金鑰基礎設施 pki,public key infrastructure 逐步在國內外得到廣泛應用。我們是否真的需要pki,pki...