《開源框架那些事兒21》:巧借力與借巧力

weixin_34391854發表於2017-04-23

相同做前端UI,為什麼有人花了一點力氣。就能夠做好?而有的人費盡全力。仍然錯誤百出?我們能夠先看看幾個故事。

故事1:巧借力,烏鴉也能夠吃核桃

有一個盛產核桃的村子。每年秋末冬初,成群的烏鴉總會來到這裡,到果園裡撿拾那些被果農們遺落的核桃。

核桃仁儘管美味,可是外殼那麼堅硬,烏鴉怎麼才幹吃到呢?原來烏鴉先把核桃叼起,然後飛到高高的樹枝上,再將核桃摔下去,核桃落到堅硬的地面上。被撞破了,於是。烏鴉就得到了那美味的核桃仁。

可是。讓核桃從高空墜落,核桃殼破裂的概率非常低。非常多時候,烏鴉都是望而興嘆。

然而,失敗並未難倒烏鴉,不久後。它們又發明了一種更有效的方法:我們村子附近有一條環山公路。過往的車子非常多。烏鴉把核桃摔在公路上。車輪非常輕鬆地就軋碎了核桃。於是,烏鴉等車子過去後,就迅速落地。品嚐美食。

順天應人。懂得發現自身所處環境的特點,同一時候整合旁邊的優質資源。就能使自己事半功倍。烏鴉僅僅是把核桃帶到公路上而已,就能輕鬆享用核桃。借力,不僅僅僅僅侷限於人與人之間,也能夠向環境“借”力。

故事二:借巧力,四兩撥千斤

英國大英圖書館,是世界上著名的圖書館。裡面的藏書非常豐富。有一次。圖書館要搬家,也就是說從舊館要搬到新館去。結果一算,搬運費要幾百萬,根本就沒有這麼多錢。

怎麼辦?有人給館長出了個注意。

圖書館在報上登了一個廣告:從即日開始,每一個市民能夠免費從大英圖書館借10本書。結果。很多市民蜂擁而至。沒幾天。就把圖書館的書借光了。

書借出去了,怎麼還呢?大家給我還到新館來。就這樣,圖書館借用大家的力量搬了一次家。

你肯定也想像大英圖書館那樣“四兩撥千斤”。假設你能發現自己的“四兩之力”(圖書),而且敢於把“四兩之力”用出去(免費借閱),一切就都不是問題。給予。有時也是一種借力。

時代發展到今天,要想成功。最高速的辦法就是尋求成功者的幫助,並與對方齊心合力共同完畢。

完美的互援與合作永遠不能被忽視。

成功。不在於你能做多少事,而在於你能借多少人的力去做多少事!

很多做前端的朋友往往在這方面有諸多疑慮。在選擇框架時,也會提出很多想法,比方:元件豐富些,自己不加入也足夠用。2.相容性好一點,最好IE8以上都能相容;擴充套件方便點。想新增就能新增;效能能好點。介面好看點,支援更換皮膚。支援窗體小元件。。支援流式佈局……

事實上。這些都不是問題。也不須要你一個一個去研究透。僅僅是,在選擇適合自己的框架時,須要認真考慮一些因素:

其一,巧借力。比方。框架是否足夠受歡迎、持續發展,有豐富的文件?越是受歡迎,說明使用的人越多,各種資源也就越多。能夠交流的方式也就越多。

被拋棄的機率越小。你能夠更加安心使用該框架。

好的框架須要不斷更新改善,適應當前的各種技術,尤其是移動端。假設。一個框架沒有在實際專案中實踐,你能夠隨便拿來練手,可是,假設要用到專門的專案中,還是找比較成熟的框架靠譜。眼下。Tiny前端框架,已經有龐大的粉絲群體。越來越受到使用者的歡迎。

在學習階段,一份完好的文件能夠幫助我們事半功倍。

其二。借巧力。相比一個特殊的框架,一個通用的框架能夠讓開發更加簡單。

尤其是。個性化程度怎樣?大多數情況下,選擇最小的樣式能夠讓定製更簡便。加入新CSS比覆蓋原有樣式更加簡單易操作且更有效率。

當然。假設你還是不太確定這框架是否適合自己,你能夠從不同專案中找出一兩個元件放入自己的專案中。比方,TinyUI框架能夠提供完整的主頁面框架;提供整頁切換和Ajax區域性重新整理的支援;提供豐富的選單插入點;提供了多種皮膚;提供豐富的介面元素自己定義;提供UI元件包的封裝。提供巨集封裝,使用時不必關心詳細實現;提供流式佈局。在手機端也有良好的展現。能夠解決UI元件包之間的依賴關係。能夠解決CSS合併和JS合併及其壓縮方面的問題……如此合成,應該也是有幫助的。

以TinyUI為例,經過多個版本號的開發,眼下已經基本完好。成熟的技術,活躍的團隊,實際上就是在幫你巧借力、借巧力,分析一下演示地址:http://www.tinygroup.org/tinyuiweb/。能夠非常快找到適合自己的前端元素。

假設須要進一步瞭解原理,還能夠通過原始碼倉庫,高速獲取相關程式碼:http://git.oschina.net/tinyframework/TinyUiEnterprise

還是那句話,巧借力、借巧力!

參與。何嘗不是一種進步?

 


 歡迎訪問開源技術社群:http://bbs.tinygroup.org。本例涉及的程式碼和框架資料。將會在社群分享。

《自己動手寫框架》成員QQ群:228977971。一起動手,瞭解開源框架的奧祕!

或點選加入QQ群:http://jq.qq.com/?_wv=1027&k=d0myfX

相關文章