摘要:總結我覺得,以后基于的全棧式開發的模式將會越來越流行,這也會引領前端步入工程化時代。歡迎繼續關注本博的更新中間層實踐一基于的全棧式開發中間層實踐二搭建項目框架中間層實踐三配置中間層實踐四模板引擎中間層實踐五中間層的邏輯處理
版權聲明:更多文章請訪問我的個人站Keyon Y,轉載請注明出處。前言
近期公司有個新項目,由于后端人手不足,我果斷的提議用node中間層的方案,得到了老大的支持,所以一次大單嘗試就來了。
Node中間層允許前端來做網站路由、頁面渲染、SEO優化,對以往從來不接觸這些內容的前端選手來說,正是鍛煉我們網站架構的好機會。
另外,這也是一次深入了解Node的好機會,準備好迎接即將到來的前端工程化時代。
在說這個話題之前,先給大家分享一篇文章(【探索】NodeJS中間層搭建),它讓我對node中間層的理解更加深刻,特別是最后的來自淘寶的PPT。
現有開發模式的適用場景玉伯提到的幾種開發模式,各有各的適用場景,沒有哪一種完全取代另外一種。
比如后端為主的MVC,做一些同步展現的業務效率很高,但是遇到同步異步結合的頁面,與后端開發溝通起來就會比較麻煩。
Ajax為主SPA型開發模式,比較適合開發APP類型的場景,但是只適合做APP,因為SEO等問題不好解決,對于很多類型的系統,這種開發方式也過重。
前后端分離從職責上劃分,node中間層實現了前后端分離:
前端:負責View和Controller層
后端:只負責Model層,業務處理/數據等
拿我們公司來說,之前的網站前臺的項目,是基于后端的MVC,在遇到同步和異步結合的頁面時候,和后端頻繁溝通,對前后端來說都是很痛苦的。
對前端來說,發揮的空間十分的有限,例如:性能優化,只在前端做是很有限的,是需要和后端配合才能實現的,比如 隨后的部分我會寫道的無刷新加載。
前端掌握了Controller,就可以做路由設計、網站目錄結構、網站前端架構。
掌握了View,就可以通過后端模板引擎(jade/pug,Ejs,swig等),邊寫邊綁數據。更別提,pug之流 還有mixin,讓我們對 html進行函數化,大大提高效率。
NodeJS讓前端無需學習一門新的語言,就能做到這些事情。
基于NodeJS“全棧”式開發下面的這張圖很簡單形象的說明了Node中間層
中間層的性能問題多加了一層通訊,肯定會有一定的性能損耗。但分層帶來的損失,一定能在其他方面的收益彌補回來,而且合理的分層能讓職責清晰、方便協作,大大提升開發效率。也可以通過優化通訊方式和協議,盡可能把損耗降到最低。
拿我公司的網站舉例:一個靜態化的詳情頁面上有很多(動態)的數據,用戶資料、評論信息、訂單等等,需要5、6個異步請求,node中間層可以代理這些請求,輕松實現Bigpipe。Node什么都能做,為什么還要JAVA/PHP?
在PC上你覺得發5,6個異步請求也沒什么,但是在無線端,在客戶手機上建立一個HTTP請求開銷很大,有了這個優化,性能一下提升好幾倍。
我們的初衷是做前后端分離,如果考慮這個問題就有點違背我們的初衷了。即使用Node替代Java/PHP,我們也沒辦法保證不出現今天遇到的種種問題,比如職責不清。我們的目的是分層開發,專業的人,專注做專業的事。基于JAVA/PHP的基礎架構已經非常強大而且穩定,而且更適合做現在架構的事情。
前端的任務更重要了常見的前后端分離的開發模式中,后端為前端提供了路由結構和頁面的數據綁定,前端只需要切頁面和少量的邏輯。
在node中間層中,前端不僅僅要切頁面和做頁面邏輯,還要做url design、頁面數據綁定、聯調與溝通,還要考慮SEO的問題,偽靜態頁面、title/keyword設置、網站地圖,甚至包括錯誤日志等等。
雖然前端的工作量增加了不少,但是基于模塊化的開發,讓總體的效率提升了。
對于后端程序員,接口整合的工作交給了前端服務器進行處理,同時和前端耦合度大大降低,工作量和工作效率都減少了。
另外,由于前后端分離,測試都可以分開來了,專門測試接口的和專門測試ui層。
總結我覺得,以后基于NodeJs的全棧式開發的模式將會越來越流行,這也會引領前端步入工程化時代。但是要把Node全棧開發變成一個穩定的、方便的開發工具,還有很多路要走。這次公司的交易平臺項目就是一個很好的實踐,接下來,請繼續關注我對這個項目的總結,希望能給各位帶來靈感。
歡迎繼續關注本博的更新
Node中間層實踐(一)——基于NodeJS的全棧式開發
Node中間層實踐(二)——搭建項目框架
Node中間層實踐(三)——webpack配置
Node中間層實踐(四)——模板引擎pug
Node中間層實踐(五)——express-中間層的邏輯處理
文章版權歸作者所有,未經允許請勿轉載,若此文章存在違規行為,您可以聯系管理員刪除。
轉載請注明本文地址:http://specialneedsforspecialkids.com/yun/92711.html
摘要:的意思是,如果碰到不能的情況,就整頁刷新首頁路由開發環境中使用了,需要將每一個的配置中寫上歡迎繼續關注本博的更新中間層實踐一基于的全棧式開發中間層實踐二搭建項目框架中間層實踐三配置中間層實踐四模板引擎中間層實踐五中間層的邏輯處理 版權聲明:更多文章請訪問我的個人站Keyon Y,轉載請注明出處。 這里沒什么可說的,webpack的配置和插件實在太多了,用的時候查文檔就行了。 項目地...
摘要:項目地址腳手架使用過,的同學都清楚,官方推薦的安裝方式是通過專用的來快速搭建一個由編譯打包的項目框架。用在層的模塊化,在中間層實現了模塊化。這樣,從中間層到前端都實現了熱加載。 版權聲明:更多文章請訪問我的個人站Keyon Y,轉載請注明出處。 項目地址:https://github.com/KeyonY/NodeMiddle 腳手架? 使用過angular2,vue2的同學都清楚,官...
Github上的腳手架實在太多,可能大多數都是只專注在前端的web開發,例如流行的React生態中的create-react-app和Vue生態中的Vue-cli, 但是可能作為像我一樣的全棧開發,一個只關注在前端開發的腳手架滿足不了所有的需求,我們可能需要開發更復雜的全棧JS的項目,所以這里介紹又一個基于NodeJS的全棧開發框架 koa-web-kit,不一定適合所有人,但至少又多了個選擇?。...
摘要:技術棧覺得好的歡迎點個。前端后端部署演示全棧式的開發多人在線聊天室項目只適配了移動端,請使用瀏覽器的手機視圖查看。之前刪除了一個文件,但是沒有刪除中的對應值。編譯時會報上面的錯誤。 技術棧 覺得好的歡迎點個star ^_^。 前端:Express & EJS & ES6 & Less & Gulp 后端:Express & SocketIO & MongoDB & REST API ...
閱讀 2669·2021-11-25 09:43
閱讀 2475·2021-09-22 15:29
閱讀 989·2021-09-22 15:17
閱讀 3631·2021-09-03 10:36
閱讀 2228·2019-08-30 13:54
閱讀 1747·2019-08-30 11:23
閱讀 1167·2019-08-29 16:58
閱讀 1294·2019-08-29 16:14