(轉)大公司或專業團隊目前流行的前端工具有什麼?

發表於2019-05-11
在知乎看到一個回答,轉來大家都看看,跟自己的情況對比一下,查漏補缺,共同進步吧
作者:yy shi
連結:http://www.zhihu.com/question/28638304/answer/42281114
來源:知乎
著作權歸作者所有,轉載請聯絡作者獲得授權。

看大家各抒己見,我也從前端開發的各個環節講講了解的一些東西吧:
1. 【除錯伺服器】首先如果你是一個準備做WEB開發實踐的,不管前端、後臺,首先需要了解一兩種伺服器apache,tomcat,nginx啥的,至少能夠配置一個基本的本地服務和修改索引路徑,前端頁面使用http/https協議訪問,而不是本地檔案協議。
2. 【除錯自動更新】伺服器搭建好了,那麼現在開始除錯網頁,然後你修改一點程式碼,去瀏覽器裡面F5重新整理頁面看看效果,再修改一點程式碼,再去瀏覽器裡面F5重新整理頁面看看效果...如此迴圈往復, maybe讓工具幫助你檢測本地檔案修改然後實時重新整理網頁更靠譜。
3. 【換種方式寫程式碼】然後就是寫程式碼了,less/sass是不錯的css組織工具,coffee也能讓你的javascript程式碼顯得更嚴謹和邏輯清晰,要是能夠在訪問頁面的時候實時獲取css/coffee編譯結果神馬的應該顯得很cool。
4. 【模組化】當然在完成邏輯相對複雜的互動功能時候,可能需要你組織非常複雜的程式碼功能,這個時候瞭解一下模組化的開發思想顯得很有必要require.js事實上更早,也更廣泛一點,sea.js在國內也不錯。
5. 【模板引擎】然後就是對於js生成HTML(或者其他什麼的)的一種包裝方式, 即:js模板引擎(handlebars,jade), 你可以嘗試在開發時候使用這樣的模板工具生成自己想要的HTML文件什麼的,也是一種不錯的體驗,這個就像你用less寫css程式碼一樣,或者說用php,jsp這樣的服務端語言工具生成實時HTML頁面。
6. 【代理除錯】有的時候你開發的東西並不只是前端程式碼,牽扯到跟服務端應用之間的資料互動,難免需要使用ajax,ajax這貨基於安全考慮是不允許跨域的,因此可能需要通過代理的方式實現資料除錯這樣的工具也有不少,nginx伺服器是其中的佼佼者。
7. 【資源合併優化】OK, 如果到完成開發階段,你需要提交自己開發的程式碼到線上伺服器了,在提交之前,你需要考慮將開發的資源進行最優化(合併,壓縮神馬的), js方面有uglify,css有cssmin神馬的,圖片壓縮還可能根據不同的型別進行不同程度和配置的壓縮,這些事情交給別個工具處理顯得很有必要,要是能夠一鍵處理那簡直了, 百度的fis,業內最流行的grunt.js、gulp.js神馬的,事實上它們在配置化編譯LESS/Coffee這類工作在自己的流程中也很在行。
8. 【Combo】使用非同步模組化開發帶來的弊端就是對於大量零碎依賴檔案需要分別開闢多個http連結去獲取,這可不是一個好現象,要知道單個瀏覽器單域名併發獲取資源的數量是很有限的, 因此例如KISSY就支援了簡單配置一個combo引數來組織一個獲取nginx的 http-concat格式資源的路徑,當然這樣的動態合併模式也適用於普通的資源請求合併。
9.【資源快取和更新】 CDN 能夠確保你已經發布到伺服器上的資源以最快的響應時間到達瀏覽器,但是帶來的問題是,你的程式碼更新,CDN則傻乎乎的不理你,除非你在使用的地方告訴它需要更新了( 時間戳、MD5檔名啥的 )。

事實上,我覺著凡是重複進行的工作總有可以程式和程式碼可以替你完成的部分,前端開發中這種事情尤其多,工具啥樣的自己去定義才最合適自己,而nodejs的出現使得前端自己可以方便的開發這類東西(上面的less、coffee、uglify、gruntjs、fis、gulp這些個單詞可以說:都依賴nodejs)。

原文地址:http://www.zhihu.com/question/28638304?sort=created
回覆

相關文章