目前web產(chǎn)品交互越來越復(fù)雜狞悲,用戶使用體驗和網(wǎng)站前端性能優(yōu)化這些都得靠web前端工程師去做web前端工程師是設(shè)計加開發(fā)的綜合體弛槐,web前端工程師是在開發(fā)人員中最直接面向產(chǎn)品员凝,面向用戶的設(shè)計人員橙困,一個開發(fā)團(tuán)隊的成果是要靠web前端工程師去展現(xiàn)瞧掺,因為用戶不會去關(guān)心后臺的處理有多么強(qiáng)大 ;在設(shè)計人員中web前端工程師是直接面向開發(fā)人員的設(shè)計人員凡傅,向開發(fā)人員以一種計算機(jī)語言的方式傳遞其設(shè)計理念辟狈,web前端工程師在整個團(tuán)隊中是很關(guān)鍵的
在我眼中一名合格的web前端工程師必須得掌握HTML、CSS和JavaScript夏跷。只懂其中一個或兩個還不行哼转,你必須對這三門語言都很熟悉。也不是說必須對這三門語言都非常精通槽华,但你至少要能夠運(yùn)用它們完成大多數(shù)任務(wù)壹蔓,而無需地頻繁地尋求別人的幫助。
下面說下我眼中web前端工程師要掌握的基礎(chǔ)知識和技能:
1 網(wǎng)頁的基本結(jié)構(gòu)(HTML + CSS)
HTML是一種標(biāo)記語言猫态,而不是編程語言佣蓉,最基本是標(biāo)簽是<html>和<body>,CSS是用來定義如何顯示HTML元素的亲雪。對HTML+CSS很容易入門勇凭,但很多人不夠深入,舉幾個例子:<meta> 標(biāo)簽是作什么用的义辕?margin-left與left有什么區(qū)別虾标,應(yīng)該在什么情況下使用?再出個DIV+CSS布局問題:一個寬度不確定的DIV里面放三個水平對齊的DIV灌砖,左右兩個DIV寬度固定為150px璧函,中間那個DIV充滿剩余的寬度。如果這些問題你目前還不知道周崭,對那個布局問題幾分鐘內(nèi)不能解決柳譬,說明你對HTML+CSS還不夠深入。
2 瀏覽器是怎么展現(xiàn)網(wǎng)頁的
不同內(nèi)核的瀏覽器對網(wǎng)頁的渲染是不一樣的续镇,目前瀏覽器都有客戶端調(diào)試工具美澳,下圖展現(xiàn)一個google首頁在IE9下的加載細(xì)節(jié):
在做web性能優(yōu)化時,對瀏覽器渲染及細(xì)節(jié)要進(jìn)一步了解。說個比較有用的知識點(diǎn):目前瀏覽器并行加載的上限是6制跟,老版本的瀏覽器會有所不同舅桩。
3 網(wǎng)頁的生命周期
不同的web框架下,頁面的生命周期會有所不同雨膨,大體還是一樣:客戶端發(fā)送GET請求擂涛,服務(wù)器返回相應(yīng)頁面,客戶端完成操作及數(shù)據(jù)聊记,然后POST給服務(wù)器撒妈。一定要對數(shù)據(jù)的傳遞(前臺與后臺,頁面之間)的細(xì)節(jié)了然于心。
4 DHTML DOM BOM? Javascript AJAX
這是Web前端開發(fā)的重中之中排监,大多數(shù)時候我們都在和他們打交道鄙漏。說幾個注意點(diǎn):javascript是單線程編程旗吁,所謂的javascript異步編程只不過是計劃在未來的某個時間上執(zhí)行相應(yīng)事件而已庆猫;詳細(xì)了解DOM事件機(jī)制雅倒;客戶端存儲(HTML5中增加了localStorage和sessionStorage);javascript不像服務(wù)器端語言那樣嚴(yán)謹(jǐn)挨队,調(diào)試不是很方便谷暮,所以一開始要養(yǎng)成嚴(yán)謹(jǐn)?shù)膉avascript編輯習(xí)慣;javascript很強(qiáng)大很靈活盛垦,不要幻想短時間內(nèi)熟練(更別說精通)它湿弦,并寫些框架、類庫情臭,初始階段還是先用熟練已成熟的框架(比如jquery)當(dāng)入門省撑;一定要熟練使用客戶端調(diào)試工具。
5 服務(wù)器端語言開發(fā)經(jīng)驗俯在,PS切圖技術(shù)
Web前端開發(fā)介于設(shè)計與開發(fā)中間竟秫,所以兩端的東西都得懂點(diǎn)。編輯語言是相通的跷乐,之前編寫過服務(wù)器語言肥败,對學(xué)習(xí)javascript是十分有益的,從圖片轉(zhuǎn)成靜態(tài)HTML頁面愕提,少不了PS切圖技術(shù)馒稍。
6 良好的溝通能力
優(yōu)秀的前端工程師需要具備良好的溝通能力,因為你的工作與很多人的工作息息相關(guān)浅侨,比如項目經(jīng)理纽谒、設(shè)計師、最終用戶如输、開發(fā)工程師鼓黔,前端工程師位于這幾類人的交匯點(diǎn)上央勒,這些角色的要求你都得照顧好,平衡這四類人的需求澳化,拿出一個比較合適的方案崔步。由此可見溝通能力對前端工程師要求更高。