javascript - node.js服務端渲染解疑
問題描述
關于服務端渲染我也看過一些相應的文章,貌似就是將一些框架在node端執行初始化。但是我在想,一般前端框架肯定是要涉及dom的,但是服務端肯定是沒dom操作的。我想問的是那:1.所謂的服務端渲染是解決了什么問題?2.seo的問題是如何被解決了?3.spa應用的首屏性能低目前有一些什么解決策略?
問題解答
回答1:對于 react 的服務端渲染,簡單說說我的理解:
最大的應該是解決 seo 的問題,其次在于加快 client 渲染的速度。
server-side-rendering(SSR) 簡單來說就是調用了 ReactDOM.renderToString 這個方法,在服務器端的一個 js 上下文對組件進行渲染,然后返回 html 的標簽,這樣,當 client 端 react 跑的時候,通過 react 的虛擬 dom 通過對比 react-id 進行增量更新,也就是如果某個 dom 上面 client 沒有啥更新的話,就直接拿 server 的結果,所以說在一定程度上加速了 client 的渲染速度。
其次就是 seo 因為 server 直接返回了 html 的標簽,所以即使是爬蟲,也會返回真正的有 seo 的標簽。這對一些門戶網站非常有用。這樣搜索引擎的爬蟲就能爬到網站的關鍵信息,對網站排名有所幫助。
SSR 性能的話,一般的解決方法貌似都是通過 cache,github 上面有一些項目,例如electrode-react-ssr-cachingreact-ssr-optimization 這些項目都是通過 cache 對 SSR 進行優化,本質上都是通過對比 props,進行 cache 加快下一次渲染。
相關文章:
1. javascript - 我是做web前端的,公司最近有一個項目關于數據統計的!2. html5和Flash對抗是什么情況?3. MySQL主鍵沖突時的更新操作和替換操作在功能上有什么差別(如圖)4. 數據庫 - Mysql的存儲過程真的是個坑!求助下面的存儲過程哪里錯啦,實在是找不到哪里的問題了。5. javascript - 在ie下為什么會出現這種情況呢 《 無法獲取未定義或 null 引用的屬性“length”》 ?請大神指教。6. css右浮動字的順序顛倒了7. ios - 類似微博首頁,一張圖的時候是如何確定圖大小的?8. javascript - vuejs+elementui 購物車價格計算,點擊加減號修改數量總價都不會改變,但是計算執行了9. javascript - vue過渡效果 css過渡 類名的先后順序10. javascript - 如何使用loadash對[object,object,object]形式的數組進行比較
