爲何每一個程序員都應該懂點前端知識？

【編者按】本文做者爲 OneAPM 工程師李哲，文章主要介紹前端知識對於編程的必要性。

這裏說的前端知識是比較通俗的前端知識，包括網頁，桌面或移動端程序的界面，命令行程序的提示等等，即和用戶進行交互的那一部分。個人工做經歷中，不少人是不在意這一部分的，更有不少人以爲這個很 low，在年初的時候，還聽到一位這樣說，「前端無非就是 Copy Paste」，在前端技術發展這麼迅猛的如今，還能說出這樣的話，可見這我的的眼界是多麼的狹小了，連衝他苦笑的時間都騰不出來。

因爲工做內容的關係，大部分狀況都是在 Linux 的虛擬終端下，也就是敲擊鍵盤輸入各類命令，等着系統的反饋。我使用過不少更好用的命令行程序的替代品，好比 top 命令的替代 htop，看看 top 和 htop 的區別吧，很明顯 htop 要更好用。

虛擬終端用了那麼多年，也沒有什麼實質上的改進，只是多了幾種 shell 的變種，好比 zsh，fish 等等。實際上有不少人在作這方面的嘗試，緣由也就是如今的虛擬終端太難用了。讓咱們看看 black-screen 是什麼樣子的。black-screen 基於 electron 開發，也就是 github atom 的底層引擎。作的還不是徹底兼容，能知足通常使用吧。

即便在虛擬終端這個領域，你們都在追求友好的界面設計，以及交互的友好。若是你認爲 black-screen 沒有什麼技術含量的話，那就大錯特錯了，一個頁面裏渲染那麼多的內容，如何提高渲染的性能，是一個很大的難題，github 對 electron 有不少的優化，都是在如何渲染字符上下的功夫，可 github 的技術實力，相比微軟仍是差了一大截，微軟的 VSCode 一樣基於 electron，可是啓動速度，運行速度都甩出 github 的 atom 幾條街。有點扯遠了，O(∩_∩)O~。

前面兩個例子可能有人沒有辦法理解，這和前端有什麼關係？從我使用這兩個工具的感受是，他們更加好用，與原來的 top 和 terminal 來對比的話，我發現他的界面漂亮，使用起來簡單，出了錯誤的時候提示比較友好，好比 black-screen 在執行了一個長時間運行未當即返回運行結果的命令時，它會顯示一個滾動的進度條，而傳統的終端就是停在那裏，也不知道它是否是已經僵死了。

如今一般意義上的前端，就是 HTML，CSS，JavaScript 了，還有無數的前端框架，對於非專職的前端工程師來講，僅僅須要懂些基本的 HTML，CSS，以及一些 CSS 框架就能夠了，好比 Twitter 的 Bootstrap，在真正的前端工程師看來，這些都是小菜一碟，而對於一個只搞後端的工程師來說，那真是全世界最難的事了，他們看不起前端，卻又作不出來。缺乏界面，你作的工具就沒有辦法用，界面難用，工具也就很難用，雖然裏面的代碼可能寫的很棒。

拿咱們用了一年的 OpenTSDB 說吧，那個界面真是讓人想死的心都有，動不動就是直接報錯，雖然是好東西，但是這臉面真是不能恭維。對比一下它和Grafana。

其實也不用作這麼好看，可是最起碼是可用的，看起來是整整齊齊的，就像命令行的幫助文檔那樣，雖然是基於字符的，可是一看就是認認真真的作出來的，像 OpenTSDB 那個明顯是出來糊弄事兒的。

這個都比 OpenTSDB 的界面好

說點歷史問題吧，最先的程序員根本不分先後端，VB，Delphi 的 C/S 時代，界面就是妥妥拽拽，寫任何程序都是要本身作界面的；後來到了 B/S 時代，作網頁的稱爲美工，終於提取出這樣一個工種，還須要懂 PS 切圖，又出來一個 Dreamweaver，也是想拖拖拽拽的解決問題。再到後來，網頁前端愈來愈複雜，像 Java 社區出的 JSF ，還有 HTML5 崛起前的那兩年，Adobe 的 Flex，AIR，不少工做流軟件就是用這兩項技術作的，以及 Java 從誕生起最雞肋功能 — JavaFX。那個時候，真正用軟件的人少，其實也是人們不會用，由於界面上也就是前端了，沒有人用的明白，太複雜。直到最近五年，到了每一個人都會用軟件的時代，技術雖然是進步了，可是讓人們，從小孩到老人都能去用這些軟件的根本緣由不只僅是技術進步，更重要的是界面的交互設計進步了，它讓每一個人都能很簡單的學會如何操做。

如今到了大數據的時代，存儲數據是一個要解決的問題，從數據中發現價值是另外一個要解決問題，而數據可視化可淺顯的歸爲前端工做，畢竟是要從數據中「看到」價值，固然，這部分工做只是懂前端知識是不夠的，因此若是大數據工程師可以懂得如何將數據可視化出來，也許更能體現他們的價值，而不只僅是把那些大數據的組件玩的倒背如流，卻不能「看到」什麼東西。

前端已然發展成爲一個和大數據同樣熱門的職業了，雖然你可能不是一個前端工程師，可是稍微學一點，不要讓時代把你給落下了。

OneAPM Browser Insight 是一個基於真實用戶的 Web 前端性能監控平臺，能幫助你們定位網站性能瓶頸，實現網站加速效果可視化；支持瀏覽器、微信、App 瀏覽 HTML 和 HTML5 頁面。想閱讀更多技術文章，請訪問 OneAPM 官方技術博客。

本文轉自 OneAPM 官方博客