細(xì)節(jié)影響成敗——一次前端調(diào)試引發(fā)的思考
題記——當(dāng)產(chǎn)品完成了99%時(shí),最不應(yīng)該忽視的是剩下的1%,最后的成敗可能就取決于這1%。也有人說,勝利就在最后5分鐘。
無論是長跑也好,創(chuàng)業(yè)也好,做產(chǎn)品也好,總有中途,總有沖刺,總有高峰和低谷。在每個(gè)階段應(yīng)該做現(xiàn)階段該做的事情,該沖刺和追求完美的時(shí)候,需要我們拿出勇氣和毅力來完成這些工作。如果我們做對了,那么我們做的事成功的幾率就會大大增加。
最近幫助開發(fā)人員完成了一次前臺框架的使用優(yōu)化,有了更深的感觸。近期我們研發(fā)的一款產(chǎn)品即將發(fā)布,產(chǎn)品的主體框架采用了一套基于jQuery技術(shù)的插件實(shí)現(xiàn)的tab標(biāo)簽。具體的功能就是從左側(cè)的導(dǎo)航欄打開一個(gè)功能頁時(shí),可以用標(biāo)簽的形式展示。類似瀏覽器提供的標(biāo)簽頁的模式,具體如下:

采用這種方式可以支持用戶的多任務(wù)處理,和瀏覽器的多頁簽是一個(gè)道理。
但是之前的框架存在一個(gè)明顯的問題,那就是當(dāng)左側(cè)的導(dǎo)航欄隱藏起來時(shí),標(biāo)簽頁中的div沒有自動計(jì)算寬度,導(dǎo)致的問題是,導(dǎo)航欄隱藏時(shí),整個(gè)界面框架左側(cè)出現(xiàn)一條空白。這個(gè)問題我與相關(guān)的開發(fā)人員說過幾次,他的回答都是,這是因?yàn)槭褂昧说谌讲寮恢涝趺葱薷模赡軟]法修改吧。我感覺他骨子里認(rèn)為,這樣已經(jīng)可以了。導(dǎo)航欄遲早會顯示的,顯示時(shí)問題不就消失了嗎?
作為一個(gè)用過多種語言寫過N年程序的老程序猿,我想不用再去講道理了,雖然有日子沒碰前端程序,改這樣一個(gè)問題應(yīng)該不是問題。
很快,我發(fā)現(xiàn)這個(gè)插件寫的還是很不錯(cuò)的。標(biāo)簽的容器(div)被封裝為對象,只要在導(dǎo)航欄顯示/隱藏的onClick事件中找到主體框架的容器對象,然后對其進(jìn)行resize即可,于是我在onClick事件中增加了如下代碼:
var bodyFrame = jQuery( window.parent.document ).find( "#contentFrame" ).attr("contentWindow");
jQuery( bodyFrame.document.getElementById("tabPanel") ).tabs('resize');
測試了一下,問題果然解決了。不過很快就發(fā)現(xiàn)IE又出問題了,對,沒錯(cuò)就是IE,前端程序員的噩夢。雖然這個(gè)界面在Chrome、Firefox、Safari下全部正常,但是在IE下發(fā)現(xiàn),當(dāng)導(dǎo)航欄隱藏時(shí),主框架可以正常擴(kuò)展,導(dǎo)航欄顯示時(shí),主框架寬度會保持不變并延展到屏幕之外,形成很想滾動條,而不是預(yù)期的重新計(jì)算大小。
又經(jīng)過一番調(diào)整,很快發(fā)現(xiàn)一個(gè)bug。插件在IE下使用了jQuery( "#divid" ).width(),無法取到div動態(tài)變化的值,于是修改為取其容器的offsetWidth,可以取得真實(shí)度度。代碼如下:
jQuery( "#divid" ).parent().attr( "offsetWidth" );
至此問題全部解決。這是個(gè)不起眼的功能,也沒什么技術(shù)上的難度,修改的內(nèi)容也很少,但是這是必須要解決的問題。僅此而已。
在未作修改之前,這個(gè)功能的主體框架應(yīng)該是可用的:多頁簽,可切換,能關(guān)能刷,但這僅僅是在開發(fā)人員眼中。作為軟件開發(fā)人員,至少要做到讓你的用戶能用、可用。而你的用戶又包含很多角色,例如其他開發(fā)人員、測試、產(chǎn)品經(jīng)理、最終用戶等等。他們在使用你提供的框架、API、Plugin、產(chǎn)品UI和功能時(shí),提出的每個(gè)修改意見都是非常有價(jià)值的。我們需要去做精心的分析和判斷并改進(jìn)我們的產(chǎn)品,這是一個(gè)長期的過程,也是開發(fā)人員需要修煉的地方。我見過無數(shù)程序員,當(dāng)別人提出改進(jìn)意見時(shí),不加任何考慮的情況下,他們的回復(fù)是,我覺得這樣也可以!
沒有人喜歡別人說自己做的東西不好,每個(gè)人都希望得到贊美,但是,有時(shí)候我們必須面對現(xiàn)實(shí),承認(rèn)別人的建議是合理的。這需要修煉!
在人的整個(gè)生涯中,雖然說運(yùn)氣占據(jù)了一定的成分,但總體來說,還是性格決定命運(yùn)。回頭去看看自己走過的路,再看看他人的生活軌跡,會發(fā)現(xiàn)每每在重大時(shí)刻,總是性格在左右你的選擇和決定。所以,修煉性格和提升心智的力量,是人生最重要的事。無論你是程序員,還是其他從業(yè)人員。
現(xiàn)在這個(gè)紛繁復(fù)雜的世界,成敗的因素很多,天時(shí)地利人和,有時(shí)你還需要一點(diǎn)運(yùn)氣,細(xì)節(jié)還能決定成敗嗎?至少,我們要說,細(xì)節(jié)影響成敗!
身邊越來越多的人開始使用Mac,經(jīng)常被問道Mac的使用問題和技術(shù)問題。遂決定,每天發(fā)布一則#Mac技巧#。同時(shí)發(fā)布于微博和微信公眾賬號“Mac技巧”,微信號sagacity-mac,有微信賬號的童鞋掃描下圖片或搜索微信號即可

浙公網(wǎng)安備 33010602011771號