5、顆; or http請(qǐng)求數(shù)
這的確是一對(duì)矛盾,顆粒化帶來(lái)了項(xiàng)目開發(fā)、管理、和代碼重用的高效率,卻又引入了更多的http請(qǐng)求數(shù),好在yui提供了combo,可以將所有的http請(qǐng)求合并成一個(gè)。只需在YUI引入的時(shí)候配置下combo屬性即可,高顆;恼(qǐng)求數(shù)瞬間降低一倍以上。在之前做雅虎關(guān)系的時(shí)候,在yui2和yui3pre并存的情況下,可以將請(qǐng)求降低到4個(gè),yui2和3各一個(gè)種子,各自一個(gè)combo。當(dāng)然這是在hack掉yui的loader的前提下。yui默認(rèn)不會(huì)合并非yui文件(更多細(xì)節(jié)可以閱讀基于yui的團(tuán)隊(duì)開發(fā))。即使這樣,我們?nèi)匀豢梢钥刂莆覀兊膆ttp請(qǐng)求數(shù),在不hack yui的情況下,可以解決部分性能問題。
6、懶惰加載 or 即時(shí)加載即時(shí)執(zhí)行
上文提到,邏輯依賴沙箱,沙箱依賴的js文件則是延時(shí)加載的,這樣就導(dǎo)致一個(gè)問題,當(dāng)頁(yè)面比較龐大的時(shí)候,會(huì)等待頁(yè)面js加載完畢才會(huì)渲染動(dòng)作,這樣的用戶體驗(yàn)不佳,而即時(shí)加載即使運(yùn)行則可以渲染出模塊后隨即渲染動(dòng)作,當(dāng)網(wǎng)速一定的時(shí)候,兩者看似是一對(duì)不可調(diào)和的矛盾,yui 動(dòng)態(tài)加載的機(jī)制比較折中的處理了這個(gè)問題,A邏輯需要a.js,B邏輯需要b.js,A邏輯則只會(huì)在a.js加載完成后執(zhí)行,而不管b.js是否加載完成,而當(dāng)A需要a.js和b.js的時(shí)候,A則需要等待a.js和b.js都加載完成才會(huì)執(zhí)行,B邏輯只需判斷當(dāng)前是否已經(jīng)加載b.js,如果b.js已經(jīng)在其他模塊中引入進(jìn)來(lái),B則可以立即執(zhí)行。但確定的是,所有的js的引入一定是在domReady后執(zhí)行的,也就是說,不管怎樣,動(dòng)作的渲染一定是在頁(yè)面html結(jié)構(gòu)出來(lái)后才開始執(zhí)行的,用戶體驗(yàn)上還是會(huì)有損失。
7、面向接口的設(shè)計(jì) or 面向dom的設(shè)計(jì)
我們知道jquery的插件習(xí)慣將所有的動(dòng)作都加載到一個(gè)$(‘#id’)上,使用的時(shí)候只要執(zhí)行類似$(‘#id’).init()即可。這看起來(lái)簡(jiǎn)潔明快,開發(fā)者的邏輯的思路也始終沒有離開“節(jié)點(diǎn)”,很方便理解,而對(duì)yui3 的node擴(kuò)展就不那么方便,從yui3的pre版到正式版,對(duì)node擴(kuò)展的方法在不斷的修改(更多細(xì)節(jié)看這里:擴(kuò)展yui3 node的定時(shí)器),這也可以看出yui設(shè)計(jì)者在對(duì)node擴(kuò)展性設(shè)計(jì)時(shí)的糾結(jié)和苦惱:要不要允許開發(fā)者去擴(kuò)展node節(jié)點(diǎn)呢?大概是因?yàn)樵O(shè)計(jì)者們對(duì)prototype先天的弊端心有余悸。目前看來(lái),設(shè)計(jì)者還沒有完全走出糾結(jié),盡管對(duì)node擴(kuò)展相比yui3第一個(gè)預(yù)覽版方便了很多,開發(fā)者仍然不能像寫jquery插件那樣優(yōu)雅自如的對(duì)node進(jìn)行擴(kuò)展。相反,zakas卻將更多的精力放在了widget接口的設(shè)計(jì)上,在這一點(diǎn)上,相比jquery,yui3則具有無(wú)可限量的優(yōu)越性,因?yàn)樵趛ui3中,組件不僅僅是組件,而是一個(gè)有血有肉的生命體,他可以出生,可以成長(zhǎng),可以被改造,可以死亡,組件在這些復(fù)雜的運(yùn)行時(shí)環(huán)境中自我錘煉,因此,一個(gè)復(fù)雜頁(yè)面在yui3的技術(shù)體系中,變成了一個(gè)由無(wú)數(shù)組件鏈接而成的生態(tài)系統(tǒng),這種生物鏈所帶來(lái)的設(shè)計(jì)創(chuàng)新和新視野是其他js框架無(wú)論如何也無(wú)法超越的。關(guān)于yui3的組件開發(fā)更多細(xì)節(jié)可以參照:基于yui3的組件開發(fā)1 和 克軍在D2上的分享《從yui2到y(tǒng)ui3看前端的演變》
8、苗條的身材 or 龐大的身軀
說到這里,大概會(huì)有很多人拍磚。其實(shí)jquery和yui同屬兩類不同的js框架,一個(gè)苗條纖細(xì),一個(gè)身重如山,兩者之間其實(shí)沒有什么水深火熱,只是使用范圍不同罷了,類似jquery的輕框架的使用范圍是博客級(jí)別的小網(wǎng)站,尤其適合單人開發(fā),代碼寫一次不再修改,而且很適合初學(xué)者學(xué)習(xí)使用,給初學(xué)者帶來(lái)自信。yui則使用與企業(yè)級(jí)的項(xiàng)目中的團(tuán)隊(duì)開發(fā),項(xiàng)目維護(hù)周期遠(yuǎn)遠(yuǎn)超過開發(fā)周期,因此yui性能一定比不過jquery,jquery的續(xù)航能力也一定不如yui,沒有最優(yōu)秀,只有最適合。當(dāng)然這自然也擋不住我個(gè)人對(duì)迷人的jquery的喜愛,只要我們能從各個(gè)js框架學(xué)到東西,能提高自己做前端架構(gòu)的能力,就ok。
說了這么多,其實(shí)只有一個(gè)觀點(diǎn),人無(wú)完人,框架無(wú)完框架,缺憾之處必有權(quán)衡。以上YY,歡迎拍磚!
本文鏈接:http://www.95time.cn/tech/web/2010/7334.asp
出處:Taobao.com UED Team
責(zé)任編輯:bluehearts
上一頁(yè) YUI3設(shè)計(jì)中的激進(jìn)和妥協(xié) [2] 下一頁(yè)
◎進(jìn)入論壇網(wǎng)頁(yè)制作、WEB標(biāo)準(zhǔn)化版塊參加討論,我還想發(fā)表評(píng)論。
|