Node.js 給前端帶來了什麼

月影發表於2013-10-14

  在軟體開發領域,前端工程師曾經是一個比較糾結的職業。在Web技術真正發展起來之前的相當長一段時間裡,由於技術門檻很低,前端工程師行業一直是魚龍混雜的狀態。其中很多號稱是Web開發者的人實際上並沒有什麼專業的前端技能,有些工作就是被當做簡單的力氣活由美術設計師順便做做而已。當時很多人甚至並不認為有朝一日會有這麼一群人用HTML、CSS和JavaScript這三門技術謀生——他們想,這怎麼可能呢——這些技術看起來都是如此簡單,隨隨便便混在一起用就哦了,把做這些活看成一種正兒八經的職業簡直是笑話。

  隨著技術發展,人們對前端工作的看法開始改變了,一些人從美工頁面仔真正轉變為專業的前端工程師。JavaScript,這門很多工程師曾經把它當做玩具而不屑一顧的指令碼語言悄然演變成推動網際網路發展的核心驅動力。伴隨著越來越多的瀏覽器的出現使得用HTML和CSS相容各種瀏覽器變得越來越難,於是能實現相容各種瀏覽器的頁面成為了前端工程師的金字招牌,前端職業開始變得炙手可熱。

  • 兩個獨立的UI層

  即使Ajax這種技術風靡全球之後,前端工程師的主要工作曾經也僅侷限於瀏覽器視窗之內。HTML、CSS和JavaScript是前端工程師必須要掌握的三種核心技術,前端同後端的唯一交集僅僅是前端需要確保後端的資料能夠以正確合適的格式輸出到瀏覽器上。在某種意義上來說,Web開發有兩個UI層,一個是在瀏覽器裡面我們最終看到的,另一個在server端,負責生成和拼接頁面。因為傳統前端基本上沒有辦法自主決定server端如何處理資料拼接生成頁面,因為資料如何組織,往往是會受到後端工程師所選擇的技術框架的影響的,而後端不理解前端的一些需求,所以他們選擇的時候也就很少會從前端方便的角度進行考慮。

  在上面這張圖的結構裡,瀏覽器裡的UI層是完全歸前端工程師管的。伺服器端的UI層則是前後端都關心的部分,剩下的部分是服務端的底層,諸如資料處理、快取、許可權控制和其他核心模組,這些是歸後端管的。我們還是回過頭來看我們所關心的server端UI層吧,這一層所做的事情通常是拼頁面模板以及處理具體的業務互動邏輯。

  所以,傳統的前後端分工是由前端負責瀏覽器,而其他瀏覽器之外的東東統統歸由後端負責。前後端的交集server的UI層也是由後端來主導的。這是目前最主流的一種前後端分工方式。

  • 讓Node.js來改變這一切

  Node.js一發布,立刻在前端工程師中引起了軒然大波,前端工程師們幾乎立刻對這一項技術表露出了相當大的熱情和期待。上一次一種技術能被整個前端界如此關注那還是在幾年之前,那時候Ajax這個概念剛剛被提出來。讓JavaScript跑在server端,這個想法簡直太棒了。這下我們不用再去學那些什麼PHP啦、Ruby啦、Java啦、Scala啦或者其他什麼對前端來說奇怪的語言,也可以輕鬆地將我們的領域擴充套件到server端,多麼美好的前景!

  我從來不是一個PHP的愛好者,但是我在Yahoo工作的時候,我不得不使用PHP。為了這份工作,我得忍受花費許多額外的時間去修復由於PHP的傻逼特性導致的坑。對於一直使用Java作為服務端語言的我來說,對PHP實在是很難適應。我相信,也一直堅持認為一種靜態型別的語言更加適合用來構建你的業務邏輯的核心部分。因此,雖然我很喜歡JavaScript,但我也不會用它來做所有的事情,比如我絕對不會只用JavaScript來實現一個完整的購物車系統。

  對於我來說,Node.js不是一個解決一切問題的銀彈,我不會用它來取代server端所有別的語言模組。事實上,Node.js可以做到其他後端語言所能做到的幾乎所有的事情,但是我不會這麼做。我所認為的比較合適的做法是用Node.js來解決server端UI層的問題,這樣我就可以將這一層從後端的其他部分剝離出來。

  現在越來越多的公司傾向於採用面向服務(service-oriented)的架構,由後端提供給前端RESTful的介面,這麼做是為了更好的做前後端的依賴分離。如果所有的關鍵業務邏輯都封裝成REST呼叫,就意味著在上層只需要考慮如何用這些REST介面構建具體的應用。那些後端程式設計師們根本不操心具體資料是如何從一個頁面傳遞到另一個頁面的,他們也不用管使用者資料更新是通過Ajax非同步獲取的還是通過重新整理頁面,當然他們更不關心的是你究竟在用jQuery還是YUI——這與他們根本毫無關係嘛。後端程式設計師真正應該關心的難道不應該是資料如何儲存、如何容錯以及如何保證安全性嗎?

  現在我們看看Node.js帶來的好處吧,當後端程式設計師提供了REST服務之後,現在我們前端程式設計師可以使用Node.js來處理server端的UI層啦,我們可以將通過REST呼叫拿到的資料隨心所欲地進行處理,不管是渲染模板還是直接提供給Ajax,現在我們僅僅用JavaScript一種語言就可以輕鬆實現這些。至於後端程式設計師,他們只需要保證資料的正確性,無論他們使用任何一種語言來封裝REST呼叫,都不會對前端造成影響,這樣前後端的職責不就被更好地劃分了嗎?這樣分工之後前端的領域就從瀏覽器小框框裡面擴充套件到了server的UI層,而這一層本來對於後端來說是一件他們做起來不輕鬆的零碎活兒。

  • 不!這太聳人聽聞了!

  前端工程師想接手server的UI層是不那麼容易被後端工程師們理解和接受的,因為這部分工作本來屬於後端工程師的職責。尤其是現在還有很多後端工程師認為JavaScript是一種極簡單的“玩具語言”,他們將會想如此重要的服務端工作怎麼能交給這群看起來不太靠譜的人用如此“不嚴肅”的語言來玩?在我的經驗裡,這種觀念上的衝突是前後端工程師們在是否引入Node.js這一問題上的最大分歧。Server端UI層是前後端的中間地帶,而之前通常後端程式設計師們對這個地帶比較有主導權,所以一旦你進入這個本來屬於後端主導的領域,爭議自然是不可避免的。

  實際上放棄傳統的角色立場,將server的UI層分給前端,在大型Web架構下是很有意義的。不這麼做的話,有時候前端想要從後端要到正確的資料,還不得不關心後端究竟是用什麼語言實現的。過去的分工中,那些原本屬於核心業務底層考慮的東西會被暴露給server的UI層,而這些問題往往會不小心影響到前端。前端本來不需要關注這些問題,因為前後端所關心的方面根本完全不一樣嘛。如果你理解單一職能、責任分離和模組化,你就會理解我所說的,甚至會覺得以前不把server的UI層分給前端實在是很笨。

  只可惜,之前Node.js這樣的東東不存在,所以當時沒有前端合適的技術讓前端工程師們自己搞定server的UI層。於是後端的同學們用PHP的人就順手把UI用PHP的模板實現了,同樣的用Java的後端同學也自然而然地用JSP搞定這個問題。這不是前端的同學不願意去做Server的UI,而是因為在之前,沒有一種我們熟悉的技術讓我們能夠搞定這些事情,但是現在不一樣了,我們有Node.js了。

  • 結論

  我很喜歡Node.js,我喜歡由這項技術給前端界帶來的更大的發展潛力。我並不認為整個後端完全用Node.js來實現會是一個很好的方案,儘管Node.js完全可以做到這一切。我認為目前Node.js最大的價值是能讓前端完全把控整個UI層,不論是瀏覽器的還是Server端的,做到這一點,我們工作的效率能得到很大的提升。我們前端更擅長於決定資料以何種方式呈現能帶給使用者更好的體驗,而後端則更加了解如何處理資料。在這種新的分工方式下,後端只需要提供合適的資料操作介面,前端自己就能構建漂亮的、有效率的、可用性高的介面,從而實現使用者所喜歡的各種互動。

  使用Node.js來搞定server的UI層也將後端工程師從他們不擅長的領域解放了出來。於是我們得到了一個Web開發的靈丹妙藥:前後端之間只需要通過資料來互動,這種模型使得兩方相互獨立,各自都能夠快速迭代開發,而只要保證資料介面不變,前後端彼此之間就不會造成任何影響。

  果斷嘗試一下吧,這個方案也許正適合你的團隊。

  英文原文: node-js-and-the-new-web-front-end

相關文章