資訊專欄INFORMATION COLUMN
摘要：以上級別的框架，屬于前端的重度封裝，通過框架暴露的接口進行開發(fā)，開發(fā)人員甚至不需要太多前端知識，只需要詳細查看框架的開發(fā)文檔即可?，F(xiàn)在回過頭來看系列框架，它們其實并不是給后臺程序員準備的框架。
各大前端框架可以按照“封裝度”的標準來區(qū)分。
設計剛出的一套網(wǎng)頁皮膚，封裝度為0。層層封裝到可以直接用后臺語言寫頁面，封裝度為10。那么我是這樣來區(qū)分前端框架的。
1級——純html+css
放5年前，基本就是用Dreamweaver剛排出來的頁面或者網(wǎng)頁查看源代碼扒下來的皮膚。不涉及到js，就是純頁面皮膚。
2級—— bootstrap系列
bootstrap的出現(xiàn)是一個里程碑事件。引入了不少html5/css3的特性。由于它對響應式的支持以及良好的體驗，給人一種耳目一新的感覺。其源碼，不管是css還是js都值得學習一下，看后經(jīng)常會有“原來還可以這樣做”這種恍然大悟的感覺。不過歸根結(jié)底是一套ui皮膚+少量js組成的框架，屬于封裝度偏低的框架。經(jīng)典頁面大概是這樣：
3~4級—— metronic/adminLTE系列
基于bootstrap或者其他1級框架，然后集成了各種jQuery插件、富文本編輯器等js庫，組成的一個大雜燴工具包和案例庫。皮膚基本是基于bootstrap自定義的一套主題。案例比較詳盡，開發(fā)的時候找到需要的組件把前端代碼復制粘貼，再稍微調(diào)試一下就能達到良好的視覺效果。根據(jù)集成的第三方庫的多少，基本可以劃分到3~4級封裝度這樣的范圍。這個級別的框架的代碼更多的是屬于粘合劑，將各種不同的第三方庫的前端代碼粘合起來。經(jīng)典頁面大概是這樣：
5級—— jQuery-ui
這里要多帶帶把jQuery-ui拿出來講，并不是因為它的封裝度有多高，而是我認為它是一個分界點。jQuery以下級別的框架，代碼以css為主，自身的js代碼少，框架量級更輕，更靈活，更適合互聯(lián)網(wǎng)web產(chǎn)品。jQuery以上級別的框架，屬于前端的重度封裝，通過框架暴露的接口進行開發(fā)，開發(fā)人員甚至不需要太多前端知識，只需要詳細查看框架的開發(fā)文檔即可。jQuery以上級別的框架更適合傳統(tǒng)管理軟件的開發(fā)。
6~7級—— easy-ui/DWZ
easy-ui基于jQuery-ui，不過具有更豐富的組件庫。貌似商業(yè)版收費很高。聽說某大型國企花了大價錢購買下來使用。DWZ是國產(chǎn)框架中我認為綜合表現(xiàn)還不錯的，完全免費，有問題可以在他們的QQ群里提。其余的之前還用過金蝶的operamasks-ui，不過現(xiàn)在好像已經(jīng)不更新了。這一類級別的框架還有一個另外的稱呼——“富客戶端框架”，意思就是重度js框架。使用起來開發(fā)效率很高，當年也是一度百花齊放，框架輩出。經(jīng)典頁面大概是這樣：
8級—— extjs系列
extjs屬于前端框架領(lǐng)域中的龐然大物，封裝程度很高，具有自成體系的元素選擇引擎和瀏覽器兼容方案，js寫法上也有自己的方式。組件很多很全。只看extjs的官方文檔和示例幾乎不必學習任何其他的前端知識就可以做出“很漂亮”的前端頁面。當然頁面很容易“撞衫”。使用時間長了，會對其產(chǎn)生嚴重依賴，離開extjs，幾乎不會寫前端頁面了。經(jīng)典頁面大概是這樣：
9級——vaadin/GWT
最后一級，也是封裝度最高的一級，也就是所謂的使用后臺語言寫前端。如果說之前的八級至少前端和后端還是相對分離的，后臺程序在java中寫，前臺程序在html或者js中寫；那么這一級別的框架簡直會顛覆你的認知！只需在后臺使用java寫好了類和對象，并設置好相關(guān)的屬性，網(wǎng)頁的元素是自動通過后臺對象生成的。這當然有好處，媽媽再也不用擔心我不會寫js和css了。然而就學一下html/css/js真的那么難嗎？個人認為，盡管GWT有g(shù)oogle的這么強悍的背書，但是這種9級封裝的本質(zhì)上把前后臺耦合得更緊密。一個人做一個項目還可以考慮，但是一個團隊前后臺分離、模塊化開發(fā)的時候，使用這種框架是一種災難！所以我是極度不建議使用9級封裝框架的。
綜上，針對不同的編程方式，給出以下參考：
1 DOP（Deadline Oriented Program，面向截止日期編程）的程序猿們有兩種選擇：a、努力學習html/css/js，使用2~3級框架；b、看不上前端代碼的，6~8級是不錯的選擇。對于業(yè)務優(yōu)先、老板整天嚷嚷時間有多緊、客戶有多急切的項目，你可以直接選b了，我覺得老板是不會給你時間學習html/css/js的。
2 EOP（Experience Oriented Program，面向用戶體驗編程）的程序猿們，大多數(shù)做的是追求極致用戶體驗的互聯(lián)網(wǎng)產(chǎn)品吧。那果斷選1級封裝度的框架，可適當借鑒2~4級的框架。
3 MOP（Money Oriented Program，面向人民幣編程）對于一直做后臺，趁過年放假想賺個外快的程序猿們，我知道你們也不想在前端領(lǐng)域有多大發(fā)展，搞好后臺就足夠一輩子衣食無憂了，所以還是選擇6~8級吧。
此外，需要考慮搜索引擎優(yōu)化的項目，慎用富客戶端或者重ajax應用。
最后告訴大家，這些都是幾年前我為了治療自己的選擇恐懼癥而進行的一些分析。
現(xiàn)在，答主我已經(jīng)不再糾結(jié)各種前端框架了。
有朋友提到backbonejs/angularjs/reactjs/vuejs這些新興框架，感覺很有必要補充完善一下這個答案。
前端崗位正是在網(wǎng)頁前端復雜性逐漸增加的推動下產(chǎn)生的。說實話，很多老程序員以前是看不上前端行業(yè)的，認為無非是一些奇巧淫技而已。而現(xiàn)在，以javascript為基礎(chǔ)的前端技術(shù)已經(jīng)成功逆襲，nodejs的發(fā)展更是讓js有了揚眉吐氣的一天。
現(xiàn)在回過頭來看backbonejs/angularjs/reactjs/vuejs系列框架，它們其實并不是給后臺程序員準備的框架。不要輕信它們官網(wǎng)上的提到的“簡單易用快速上手”之類的宣傳語，那不是跟后臺程序員和js初學者說的。如果你對js原型鏈、作用域、異步回調(diào)的概念還很模糊，用了這些框架只會讓自己陷入泥潭難以自拔！
雖然你也可以將這些框架簡單粗暴得劃分到7級封裝度左右，但是我并不認為這些“深度前端”框架適合后臺開發(fā)者。
當然啦，事無絕對，如果你像我一樣興趣廣泛，喜歡折騰，前后端雙修，那你自然清楚該選什么前端框架，也就不會到知乎上來問這個問題了。
這就是現(xiàn)在的我，有了一定的前端功力，開源社區(qū)的森林里那么多豐富的資源，枝葉、落花都是利刃，也無需在框架上糾結(jié)了。
Materialize前端只需要簡單的設計就搞定。后端寫起來得心應手，真是方便。
Admin LTE：基于Bootstrap的一套后臺系統(tǒng)
https://www.zhihu.com/questio...
文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請注明本文地址：http://m.hztianpu.com/yun/113817.html
摘要：以上級別的框架，屬于前端的重度封裝，通過框架暴露的接口進行開發(fā)，開發(fā)人員甚至不需要太多前端知識，只需要詳細查看框架的開發(fā)文檔即可。現(xiàn)在回過頭來看系列框架，它們其實并不是給后臺程序員準備的框架。 各大前端框架可以按照封裝度的標準來區(qū)分。 設計剛出的一套網(wǎng)頁皮膚，封裝度為0。層層封裝到可以直接用后臺語言寫頁面，封裝度為10。那么我是這樣來區(qū)分前端框架的。 1級——純html+css 放5年...
摘要：轉(zhuǎn)行前端有哪些疑慮在人生的抉擇處，尋求一些別人的經(jīng)驗和總結(jié)，無可厚非，但是決定了就一定要堅定的走下去，謹慎是為了更好的堅持，而不是放棄的理由。寫在前面這里前后端指的是開發(fā)的前后端。 轉(zhuǎn)行前端有哪些疑慮？ 在人生的抉擇處，尋求一些別人的經(jīng)驗和總結(jié)，無可厚非，但是決定了就一定要堅定的走下去，謹慎是為了更好的堅持，而不是放棄的理由。寫在前面：這里前后端指的是web開發(fā)的前后端。1、前端崗位需...
摘要：轉(zhuǎn)行前端有哪些疑慮在人生的抉擇處，尋求一些別人的經(jīng)驗和總結(jié)，無可厚非，但是決定了就一定要堅定的走下去，謹慎是為了更好的堅持，而不是放棄的理由。寫在前面這里前后端指的是開發(fā)的前后端。 轉(zhuǎn)行前端有哪些疑慮？ 在人生的抉擇處，尋求一些別人的經(jīng)驗和總結(jié)，無可厚非，但是決定了就一定要堅定的走下去，謹慎是為了更好的堅持，而不是放棄的理由。寫在前面：這里前后端指的是web開發(fā)的前后端。1、前端崗位需...
摘要：轉(zhuǎn)行前端有哪些疑慮在人生的抉擇處，尋求一些別人的經(jīng)驗和總結(jié)，無可厚非，但是決定了就一定要堅定的走下去，謹慎是為了更好的堅持，而不是放棄的理由。寫在前面這里前后端指的是開發(fā)的前后端。 轉(zhuǎn)行前端有哪些疑慮？ 在人生的抉擇處，尋求一些別人的經(jīng)驗和總結(jié)，無可厚非，但是決定了就一定要堅定的走下去，謹慎是為了更好的堅持，而不是放棄的理由。寫在前面：這里前后端指的是web開發(fā)的前后端。1、前端崗位需...
摘要：后端開發(fā)的疑惑后端開發(fā)最常面對的一個問題性能高并發(fā)等等。而到了時代，在方面有了前后端分離概念移動后端更是無力渲染天然前后端分離。 先來上一張前端頁面的效果圖（Vue + Vux + Vuex + Vue-Router）。showImg(https://segmentfault.com/img/remote/1460000010207850); 第一次做gif 沒什么經(jīng)驗，太大了。加載...
閱讀 2681·2021-11-24 09:39
閱讀 3513·2021-11-15 11:37
閱讀 2470·2021-10-08 10:04
閱讀 4090·2021-09-09 11:54
閱讀 1951·2021-08-18 10:24
閱讀 1181·2019-08-30 11:02
閱讀 1866·2019-08-29 18:45
閱讀 1770·2019-08-29 16:33
