⑴ 前端工程師怎樣提高開發效率
前端工程師其實是一個工作很雜的職位,除了要負責切圖、寫html/css/js外,還要處理一系列的瀏覽器兼容性問題、優化網頁性能等,所以提高前端工程師的開發效率是勢在必行的,也是前端共工程化的體現。那麼如何提高便可以按照前端工程師涉及的工作點來進行劃分。下面我就介紹下平時我在工作中使用的一些提高開發效率的方法。
當然除了以上5點,對於前端來說需要提高開發效率的地方還有很多,可謂任重而道遠。希望以上幾點能夠給初識前端的同學帶來啟發並能夠親自實踐。
⑵ web前端工程師的優點和缺點
優點:HTML5APP可以在PC和移動、iOS和Android上運行。
缺點:在對性能要求較高的情況下,或選擇使用本機開發知識。
實現此目的的最佳方法是混合方法,大型框架使用本機、基本功能等,一些模塊使用HTML。Web前端工程師:使用(X)HTML/CSS/JavaScript/Flash等各種Web技術開發的客戶端產品。
Web前端工程師:完成客戶端程序(即瀏覽器端)的開發,開發JavaScript和Flash模塊,結合後台開發技術模擬整體效果,富InternetWeb開發,致力於通過技術提升用戶體驗。
Web前端工程師:對Web2.0、HTML+CSS和瀏覽器兼容性有深刻的理解。了解其他IT編程語言,如PHP、Java、.net和vue。
(2)前端工程師效率擴展閱讀:
掌握以下技術:
1.掌握基本的web前端開發技術:HTML、CSS、JavaScript、DOM、BOM、AJAX等,了解其與不同瀏覽器的兼容性、渲染原理及bug
2.必須具備網站性能優化、SEO和伺服器端開發的基本知識
3.必須學會使用各種web前端開發和測試工具來輔助開發嗎
4.除了技術知識之外,還需要理論知識,包括代碼的可維護性、組件的易用性、分層語義模板和瀏覽器分層支持
5.未來的web前端開發工程師還將學習HTML5、web視覺設計、網站色彩搭配、網站交互設計模式等相關技術
網路--web前端工程師
⑶ web前端工程師如何提升技術水平
一名優秀的前端開發工程師,不單單需要掌握前端必須的各種技術,同時還要掌握其它技術,需要掌握一點後台的知識,同時也要對網站構架有一定的了解,同時還要掌握一定的SEO網站優化技術,這樣才可以稱之為一個「優秀的web前端開發工程師」。除了技術以外,還需要一定的時間來沉澱自己。一名資深的優秀web前端開發工程師,是每個大型企業都渴望的人才。業內人士表示,寧可高薪招人,險企也不願自己培養相關的技術人才。
Web前端開發工程師如何才能做得更好呢?千鋒武漢為你詳細分析一下。
第一,必須掌握基本的Web前端開發技術,其中包括:CSS、HTML、SEO、DOM、BOM、Ajax、Java等,在掌握這些技術的同時,還要清楚地了解它們在不同瀏覽器上的兼容情況、渲染原理和存在的Bug。
第二,在一名合格的前端工程師的知識結構中,網站性能優化、SEO和伺服器端的基礎知識也是必須掌握的。
第三,必須學會運用各種工具進行輔助開發。
第四,除了要掌握技術層面的知識,還要掌握理論層面的知識,包括代碼的可維護性、組件的易用性、分層語義模板和瀏覽器分級支持,等等。
可見,看似簡單的網頁製作,如果要做得更好、更專業,真的是不簡單。這就是前端開發的特點,也是讓很多人困惑的原因。如此繁雜的知識體系讓新手學習起來無從下手,對於老手來說,也時常不知道下一步該學什麼。
代碼質量是前端開發中應該重點考慮的問題之一。例如,實現一個網站界面可能會有無數種方案,但有些方案的維護成本會比較高,有些方案會存在性能問題,而有些方案則更易於維護,而且性能也比較好。這里的關鍵影響因素就是代碼質量。CSS、HTML、Java這三種前端開發語言的特點是不同的,對代碼質量的要求也不同,但它們之間又有著千絲萬縷的聯系。
⑷ 如何提高前端工程師的開發效率
你好,開發效率不是一朝一夕能提高的,常年的積累,將單獨的功能模塊化,用時直接調用模塊,既簡單又方便,開發效率還高
⑸ 前端工程師如何提升能力提高效率有哪些方法
1、使用正確的工具。正所謂「工欲善其事必先利其器」,如果你是一個網頁設計師,你可能需要Photoshop和Illustrator。如果你是一名開發人員,你需要一些優秀的Web開發應用程序。擁有一些優秀的、你知道如何更有效地使用的工具和裝備可以幫助你盡可能的高效完成工作。
2、善用Web開發框架。一個良好的Web開發框架,可以幫助你解決常見的Web開發問題,可以測試Web開發的bug、安全和性能,使代碼重用更容易等,藉助框架會節省你的時間以及提高項目的質量。
3、建立一個代碼片段庫。回收你的代碼,創建一個你最喜歡和經常使用的代碼片段集,並確保代碼組織良好,可以被輕易搜索到。你可以在硬碟中建立源代碼目錄,也可以使用允許保存代碼片段的源代碼編輯器或IDE,或者使用專門的片段工具,如Snippet或Snipplr。
4、沖刺式工作。不要連續工作幾個小時,這樣你的效率可能會下降,隨著時間的推移,你的工作品質也會下降。每次連續工作10-20分鍾,可以保持你大腦活躍,可以更好地產生新的想法。
5、不斷學習。通過在自我提高上投入時間,你可以在工作的其他方面節省時間,可以增加你的勞動成果並提高工作質量。要保持你的時間表靈活變化,超過規劃的工作,可能會一拖再拖。
6、做好工作規劃。當你開始一個項目的工作,確保知道你對這個項目的期望。做網頁設計項目時,需要了解客戶期望做的、首頁內容、顏色設置等工作。了解有關項目的某些內容,可能會使你工作在正確的方向,而不至於在黑暗中摸索。
掌握以上方法,可以大大簡化你的Web開發流程,使開發的每一個環節快速、流暢。
⑹ 如何正確衡量前端開發工程師的工作效率
1、一般的公司前後端完全分工明確,前端只需修改js、css、html,在本地靜態頁面上調試,然後提交代碼即可。
2、在前後端分工不明確的情況下,前端雖然仍然只需關注css、js、html的修改,但是卻必須在項目可運行的伺服器環境中調試,相對麻煩且效率低下,特別是一些需要部署編譯執行的項目,如不在項目中開發,則會出現兩份甚至多份代碼的問題,會導致多份代碼同步難的問題產生。
⑺ 怎樣提高前端工程師開發效率,都在這里
前端工程師其實是一個工作很雜的職位,除了要負責切圖、寫html/css/js外,還要解決一系列的瀏覽器兼容性、網頁性能優化等問題,所以提高前端工程師的開發效率是勢在必行的,也是前端工程化的體現。
對於開發效率,我個人理解是
開發效率 = 新增代碼的效率 + 修改代碼的效率 + 維護代碼的效率
那麼如何提高前端開發效率便可以按照前端工程化的理念來進行劃分。下面我就介紹下7個提高前端開發效率的方法。
1.切圖
切圖是一個前端最基礎的技能,一般我們使用Photoshop或者FireWorks基本都能搞定設計師交付給我們的設計圖,但是要提高切圖效率的話就得使用一些訣竅了,比如利用PS里的動作來實現「一鍵切圖」功能,這里除了切圖外還介紹了其他的實用方法和工具。
2.編碼
對於編寫代碼部分我們首先要找到一款合適自己的IDE工具,建議不要使用Notepad++或者Dreamweaver,這些工具已經不符合前端潮流了,無法讓自己優雅地敲代碼。這里我主要推薦Sublime Text、Atom或者Webstrom,因為它們除了人性化的界面和支持大多數語法的高亮外,還可以安裝各種各樣的插件來拓展你的IDE工具,下面我主要介紹幾款Sublime Text提高開發效率的插件:
其中Element是用於快速編寫html/CSS的,比如輸入 ul>li 後按下tab鍵便可以生成一個ul標簽裡麵包含一個li標簽
JSFormat用於格式化JS;CSScomb用於對樣式屬性進行一鍵排序;HTML-CSS-JS Prettify可以一鍵規范我們的HTML/CSS/JS,甚至JSON格式;SublimeTmpl可以快速新建HTML/CSS/JS文件; ColorPicker用於調用本地調色板功能。這些工具都非常實用,一定程度上可以提高我們的編碼效率。
3.自動化
說到提高開發效率,這里不得不提一些前端的自動化工具,畢竟前端自動化是目前及未來的趨勢,能夠很大程度上縮減前端不必要的工作量,使我們能夠專注前端本身。
這里我們可以使用NPM來管理我們的項目包文件;利用webpack來打包壓縮我們的代碼;利用Node.js來實現構建本地伺服器;利用Karma、Jasmine來測試我們的前端代碼。
用好前端自動化工具可以幫助我們處理很多瑣碎的事情,比如一鍵壓縮代碼、圖片,一鍵合並JS,檢測文件更新等。
4.模塊化
隨著web2.0時代的到來,Ajax技術得到廣泛應用,前端代碼日益膨脹,而前端模塊化能夠方便我們對項目代碼的維護,進行按需載入,從長遠角度來看對我們提高項目的開發效率同樣大有益處。
在ES6出來之前應該說前端代碼本身不具備實現模塊的功能,我們必須要使用一些模塊化載入器來實現,比如RequireJS、SeaJs等。而隨著ES6的普及,目前像RequireJS、SeaJs這樣的工具已經沒有存在的必要了。所以在基於ES6的開發環境下我建議使用ES6的模塊化功能來實現我們的前端模塊化。
5.組件化
前端組件化的概念也是由來已久,我們可以通過將我們的代碼劃分成不同組件來實現功能公用,一個同樣的功能我們可能不用再次編寫相同的代碼,同時也可以提高前端代碼的可維護性和清晰度。以下是目前流行的前端框架Vue的單文件組件的概念圖:
我們可以將公用的組件抽離,將大組件拆分成小組件的形式實現前端組件化,組件與組件之間可以存在父子關系,也可以存在兄弟關系。在Vue的單文件組件中,一個組件包含了其HTML、CSS、JS的代碼片段。
6.前後端分離
前後端分離的項目對提升前端開發效率非常有幫助,因為前端不再需要後台配置路由、搭建伺服器環境、編寫模板等,這樣一來前端的生產力就會得到很大程度的解放,但是前後端分離的項目有利也有弊,如下圖所示:
最終我們需要根據項目需求衡量利弊來決定是否使用前後端分離的模式。
7.規范與模式
團隊協作離不開編碼規范和開發模式的幫助。遵循編碼規範文檔可以幫助我們在團隊開發時提高合作開發的效率。一個團隊遵循一套編碼規范可以使每個人的代碼寫出一個人的風格,這樣團隊間相互審查、測試、完善功能時會非常高效。下方是一些開源的前端編碼規範文檔:
網頁鏈接
首頁-TGuide
網頁鏈接
網頁鏈接
除了編碼規范我們在開發時經常會沿襲了一些已經存在的模式來解決問題,比如當用JS編寫彈框時我們往往會用到單例模式,用CSS編寫動畫時直接套用動畫的常用屬性等,我們不再需要從頭開始思考某一個功能的實現,這就是模式帶來的意義。
結語
當然除了以上7點,對於前端來說需要提高開發效率的地方還有很多,可謂任重而道遠。只有將前端無序、繁雜的操作組織起來,利用工具簡化、規范前端流程,才能實現項目構建、開發、維護的一體化。希望本文能夠給初識前端的同學帶來啟發並付諸實踐。
⑻ 如果一個web前端工程師入職一天做多少個頁面才正常
摘要 如果一個web前端工程師入職一天做多少個頁面才正常?
⑼ 怎樣快速判斷一個前端工程師的能力如何
對於考察人的技術等級,學界是有認真的研究的。參見:德雷福斯模型解說。
德雷福斯模型把人的技能水平,分成 5 級:新手、高級新手、勝任者、精通者、專家。
對不同技能等級的認定是這樣的:
新手:依靠指令清單,必須按部就班。就是必須給出詳細而具體的操作規則,才能工作。比如你做一道從未做過的菜,需要看菜譜的說明,第一步做什麼,第二步做什麼等等,直到最後烹飪結束。
高級新手:有限的情景洞察力,同等對待工作的各個方面。對全局性、體系性的東西沒興趣。這是小工的水平。比如他能跟著師傅干點活,打打下手。可以靠著反復檢索搜索引擎、StackOverflow 解決具體的小問題。
勝任者:能夠獨立解決各種各樣的領域內問題。這是一般的企業招聘,比較希望招到的等級,招進來稍作適應就能幹活了,省心省力。
精通者:經驗豐富,可以自我糾正、自我改進。這類等級的人,思考可以指向內在,通過反省、反饋改善技能。這種在企業可以算上高手、大拿了,培養不易。
專家:依靠直覺工作,不需要解釋和理由。實際你讓他解釋,他可能也說不出個所以然,就是直覺給出答案,然後還是對的。專家人數稀少,需要很長時間訓練、實踐。通常的說法是 10 年出專家,10000 小時定律。
這個是理論上的研究,實踐中比較缺乏操作性,難以迅速的判定應聘者的實際情況。不信你打開收進來的大把簡歷,剛畢業的學生,每個技能名詞上面都是一堆堆的「精通」 – 你相信么?但它可以當成一個職業技能等級判定的參照標准。
於是乎,各家企業開啟了各種「筆試」、「機試」,多輪面試,並且嚴格要求學歷以及出身院校,試圖以此過濾掉不合意的應征者,留下合格的人選。它當然是可行的,但是效果一般,而且容易出錯,錯失有思想有水平的人。不然也不會催生出各類「推薦式」的招聘。
看重學歷、學校當然也有其優點:它是快速過濾的手段,畢竟能考上好學校的人智商不會太差吧。但在大數字公司的一朋友說,公司裡面還有初中畢業,一直精研安全領域的人,技術能力也是十分出色。如果嚴苛對待背景,這些人就會錯過了。因為人的生活多種多樣,有各種歷史的背景因素影響經歷。而部分人的經歷,就是跟一些人不同的,可是不妨礙他們同樣可以變得優秀。招聘,實際上是建立信任關系。如果有充足的信息證明,應聘者足夠優秀,這就夠了。條條框框只是輔助手段,並不是目的。
推薦式的招聘實際要靠譜的多,因為人很容易了解熟悉的人的水平。這是靠推薦者的信用背書。人平時溝通時說什麼話,日常看什麼書,關注哪些領域,琢磨過啥問題,哪些東西很熟,這個經常聊的熟人往往都知道。可是,這類招聘局限性也很大:面窄、靠機緣。靠推薦能招幾個好手啊?好手往往是各家爭搶的對象,窗口期有限,基本不會缺工作的。
說了一圈,還是要在技能水準判定上有更高效率的辦法,招進合適的人來。
回到開頭的德雷福斯模型,既然人的技能是分級的,那麼對待不同的職位要求,也應該側重不同的考察角度。如果千篇一律的走招聘流程,就容易出問題了。比如你明明要找的是「精通者」,可上來就讓人一堆筆試、機試,這是不合適的。對方會十分的厭煩。體現高水平技術能力的並不在默寫什麼「字元串演算法」那裡。這反倒是剛畢業的人佔便宜,因為才學過不久,印象深。不信你讓工作 10 年的人跟計算機專業應屆生比比寫排序演算法,真未必能贏。但是這並不重要 – 你幹活不看手冊不查文檔嗎?聰明人從不死記硬背。重要的地方在於對問題域的准確、深刻的理解,對各類技術優劣點、各種條件平衡的評判和把握。
對待初階新人,應著重考察的是基本功是否扎實,專業成績是否優秀。更重要的,是他對職業的熱情,學習能力和研究精神。某類人要說起技術來,滔滔不絕,兩眼放光,充滿熱情,對未知的、新生的各類概念、技術非常好奇,這種人想差都難。因為他會自我驅動,不用督促,自己就鑽研前進。反之,覺得這個職業待遇高,只是想混飯吃的人,很少走得長遠。這類初階新人以畢業生、工作年限少者為多。測試考核,可以筆試查看其對基礎概念的理解是否准確,知識領域的大致范圍。甚至,布置一個有點挑戰性的小任務,讓他嘗試解決,說明思路。
考察勝任、精通者的策略不一樣。筆試做題沒啥用,原因前面說了。這類招聘是重頭戲,企業都喜歡找這樣的,能幹活。所以考核評估的地方也較多。我覺得可以分成幾個方面去看。意識是否先進,是否會反省思考;是否善於解決問題,富有創造性;是否有比較深的積累和廣闊的知識面。
業界的開發思想也是在不斷變化,工具鏈一直在革新。聰明的人不用蠻力,而愛用工具提升效率,喜歡自動化操作解放人力。要查看人用什麼開發工具鏈,用什麼開發環境,解釋下為什麼?好的開發者會及時注意新出現的工具,挖掘它能解決什麼問題,並嘗試吸收,解決自己的需求。如果沒有這個思想意識,工作效率就會打折扣了。因為你會落後行業發展水平。人善於自我反省,則會催動自我糾正,這正是精通者的特徵。參考:優秀的開發者為什麼要學習研究新的編程語言?
解決問題的能力是重頭戲,也是企業招聘人的主因。人要善於解決實際問題,而且,要學會聰明的解決問題。解決問題要看思路,看手段,看是否有創造性,這是真正考驗人能力的地方。好的開發者,會考慮很多可能選項,預估各種優劣,給出一個較優的方案。 遇到難題,會用各種方法嘗試。經驗豐富的人,常常會使用技術的組合手段來處理難題,而不是一個語言一個工具到處用。所以,要查看下過往的項目經歷遇到的問題、困難,是如何解決的,思路如何。一些公司據說不招聘不會用谷歌的工程師。谷歌打不開?嘿嘿,這就是你要克服的困難啊。這你都解決不了,還做什麼研發。谷歌是人類最全、最新知識的總索引,充分利用事半功倍。
考察知識的深度、廣度,對重要領域的概念是否有深刻的理解和掌握,以及從各類工作經驗中得到的認知。問問他看過什麼書,研究過什麼東西。說白了,知道的東西是否多。一些公司很喜歡用 CheckList 模式來考核,列一堆領域的知識點、概念,問人懂不懂,知道就是水平好,不懂就是水平差。實際情況並非如此。人的工作過程是獨立的,一些事情如果沒有工作機會去接觸並解決,那麼一些冷僻的問題就永遠都碰不上。當然也就不知道。但你能說沒做過就一定做不好么?
另外,人的技能樹,其實也是「犬牙交錯、參差不齊」的。什麼意思?技術領域非常的廣闊,你真的沒辦法每個領域都很精通,實際上是這個做的多,懂的多,那個用的少,知道的少。這個時候,應看具體知識領域,是哪一類。它是否需要復雜的、難度較高的背景。門檻高的技術,需要的配套技能多得多,比如 AI、機器學習。而一般產品應用領域則不然,了解核心概念、設計意圖,看著手冊、最佳實踐,也就能上手了。這個暫時不會,實際無關緊要的,工作一段學的認真點就會了。但是門檻高的領域,就需要很長時間的學習了。這是本質的差別。
我曾看見某公司放出的職員技能樹,包羅萬象,幾乎一切 IT 領域的知識技能都在裡面了,還聲稱要求「全部精通」。我不知道它如何定義的「精通」,如果按德雷福斯模型的定義,能做到的那是神,不是人類。這個純屬吹牛皮,我壓根就不信。如果真有這樣的人,出來讓我膜拜下。因為每個稍大點的領域,都足夠讓你鑽研一輩子,因為它們也在迅速發展呀。業內流傳「全棧工程師」的說法,鼓吹自己是全棧的人經常是前端工程師。而研究後端工作領域的技術高手經常鄙視這類人:真以為會點 Node.js 就能解決一堆後端的事務了么?我也懂一些前端,也能號稱「全棧」,但在不同領域的專業性是什麼水準,自己明白的很。前端要解決的事情也有很多復雜性。全棧實際是反專業化的,是人力資源稀缺時候的低成本選擇。
更高一層,則是考察人本身了。人的視野夠廣闊么?其它領域的知識有了解嗎?一些問題的解答並不在問題域本身,而是在外面的領域。所謂「功夫在詩外」。公司講求團隊協作,總要面臨不同的分工合作問題。比如產品、運營的人提需求,可以換位思考嗎?合作意識強么?誰也不想招個刺頭進來吧?把團隊的氣氛和人際關系搞的一團糟,大家做事都不痛快、不順心,又如何安心做好工作?最終只能讓團隊工作效率下降,甚至瓦解。