最近1年多，前后端同構慢慢變成一個流行詞，也許很多人還停留在前后端分離的最佳實踐道路上，但實際上又有一批人已經(jīng)從簡單的服務端渲染走向探索最佳前后端同構方案的路上了。不過，我只是膜拜后者的過客。
雖然大家可以去網(wǎng)絡搜索一下相關的概念解釋，但這里我還是簡單列舉一下，我理解的術語。
1、前端渲染：瀏覽器一側使用js，借助模版或vue、react、angular等框架做的DOM結構生成。
2、后端渲染：服務器一側，使用php、nodejs等技術實現(xiàn)DOM結構生成，并在HTTP請求中返回給瀏覽器。
3、同構：瀏覽器一側的JS、HTML和服務器一側使用的JS、HTML使用同樣的開發(fā)結構，同樣的開發(fā)思路，同樣的開發(fā)模式，盡可能實現(xiàn)代碼復用。
明確一點，作為有追求的前端開發(fā)，我們不應該盲目跟風，一切需要從實際出發(fā)。
那么，首先，我們需要了解為什么會有同構這個概念出現(xiàn)。
Web開發(fā)的歷程是很有趣的，最初php、asp的年代，一切內容都是服務器渲染的；
再后來為了節(jié)省服務器資源，也更大限度利用客戶端緩存，又出現(xiàn)了前后端分離的模式，從而有了專業(yè)的前端開發(fā)和后臺開發(fā)。此時Web的特點是，js和html放到靜態(tài)目錄，也可以CDN擴散，并以ajax方式獲取后臺的數(shù)據(jù)，在前端進行DOM組裝。這種開發(fā)方式沿用至今，這是一個好的工作模式，專業(yè)的人做專業(yè)的事，確實有利于工作效率提高。
再而，隨著nodejs的流行，前端jser們又開始蠢蠢欲動，嘗試吞并web接入這個后臺的前沿地盤，把后臺推到更后。大概2014年后，又出現(xiàn)了很多nodejs直出的方案，把頁面數(shù)據(jù)都一次在HTML的請求中返回，無需瀏覽器端再發(fā)起ajax獲取數(shù)據(jù)，而且服務器端把DOM結構都渲染好，瀏覽器按trunk直接做圖形渲染即可。不得不說，這個方案帶來了很多好處：首屏速度更快，瀏覽器更省電。當然，隨之而來的，就是更復雜的工作模式，jser需要做服務器端的邏輯，甚至一些代碼需要同時用在瀏覽器和nodejs上。
針對前邊的問題，同構的探討就開始了。。。
百度搜一下前后端同構，清一色的vue、react。這些確實是同構，但我認為范圍太窄，同構不是框架帶來的問題，而是因為前后端獨立渲染這種架構層面帶來的問題。
當然，那些同構探討也是非常有價值的，但不在本文的討論范圍內，在這里我更想表達一下，如何從實際項目需求的角度來看，找出自己所需的同構之道。
畢竟，要知道，同構不是為了跟風?？幔膊皇菫榱颂勖嬖嚨臅r候博點好感。同構，是為了提高用戶體驗的同時，提高團隊的工作效率。
接下來，我想根據(jù)項目的類型，說說自己的看法。
第一種，單頁面應用。
這個網(wǎng)站很類似一個APP，確實很有必要做成單頁應用，有助于提高用戶體驗。
如果第一步選擇了單頁面應用，這里就衍生了另外的問題——SEO。而react等框架做了服務器渲染，最大目的其實也是解決SEO。
既然瀏覽器端選擇了某個框架，例如React，而同時又考慮nodejs直出提高首屏的速度，那么就沒有討價還價的余地了，當然上react全家桶，前后端都用react。
延伸閱讀
- ssh框架 2016-09-30
- 阿里移動安全 [無線安全]玩轉無線電——不安全的藍牙鎖 2017-07-26
- 消息隊列NetMQ 原理分析4-Socket、Session、Option和Pipe 2024-03-26
- Selective Search for Object Recognition 論文筆記【圖片目標分割】 2017-07-26
- 詞向量-LRWE模型-更好地識別反義詞同義詞 2017-07-26
- 從棧不平衡問題 理解 calling convention 2017-07-26
- php imagemagick 處理 圖片剪切、壓縮、合并、插入文本、背景色透明 2017-07-26
- Swift實現(xiàn)JSON轉Model - HandyJSON使用講解 2017-07-26
- 阿里移動安全 Android端惡意鎖屏勒索應用分析 2017-07-26
- 集合結合數(shù)據(jù)結構來看看(二) 2017-07-26
學習是年輕人改變自己的最好方式