來具體聊壹聊提高前端工程師開發效率的那些方法！
（壹）切圖
切圖是壹個前端最基礎的技能，壹般我們使用photoshop或者FireWorks基本都能搞定設計師交付給我們的設計圖，但是要提高切圖效率的話就得使用壹些訣竅了，比如利用PS裏的動作來實現“壹鍵切圖”功能。
（二）編寫html/css/js
對於編寫代碼部分我們首先要找到壹款合適自己的IDE工具，建議不要使用notepad++或者dreamweaver，這些工具已經不符合前端潮流了，無法讓自己優雅地敲代碼。這裏小編主要推薦sublime text、atom或者webstrom，因為它們除了人性化的界面和支持大多數語法的高亮外，還可以安裝各種各樣的插件來拓展妳的IDE工具，下面小編主要介紹幾款sublime text提高開發效率的插件：
其中Element是用於快速編寫html的，比如輸入 ul>li 後按下tab鍵便可以生成壹個ul標簽裏面包含壹個li標簽，其官方文檔為：b用於對樣式屬性進行壹鍵排序；HTML-CSS-JS Prettify可以壹鍵規範我們的HTML/CSS/JS，甚至JSON格式；SublimeTmpl可以快速新建HTML/CSS/JS文件; ColorPicker用於調用本地調色板功能。這些工具都非常實用，壹定程度上可以提高我們的編碼效率。
（三）前端自動化
說到提高開發效率，這裏不得不提壹些前端的自動化工具，畢竟前端自動化是目前及未來的趨勢，能夠很大程度上縮減前端不必要的工作量，使我們能夠專註前端本身。
這裏我們可以使用npm來管理我們的項目包文件；利用webpack來打包壓縮我們的代碼；利用node.js來實現構建本地服務器；利用karma、jasmine來測試我們的前端代碼。
用好前端自動化工具可以幫助我們處理很多瑣碎的事情，比如壹鍵壓縮代碼、圖片，壹鍵合並JS，檢測文件更新等。
（四）前端模塊化
實現前端模塊化能夠方便我們項目代碼的維護，實現按需加載，從長遠來看對我們提高項目的開發效率是很有幫助的。
在ES6出來之前應該說前端代碼本身不具備實現模塊的功能，我們必須要使用壹些插件庫來實現，比如require.js、sea.js等。而隨著ES6的普及，目前像require.js、sea.js這樣的工具已經沒有存在的必要了。所以在基於ES6的開發環境下我建議使用ES6的模塊化功能來實現我們的前端模塊化。
（五）前端組件化
前端組件化的概念也是由來已久，我們可以通過將我們的代碼劃分成不同組件來實現公用並方便維護，同樣可以提升我們的開發效率。以下是目前流行的前端框架Vue的單文件組件的概念圖：
當然除了以上5點，對於前端來說需要提高開發效率的地方還有很多，可謂任重而道遠。希望以上幾點能夠給初識前端的同學帶來啟發並能夠親自實踐。