《什麼是伺服器端渲染》，
《**服務端渲染(ssr)》，
《面向母嬰電商平台的前端設計與效能研究》，楊玉雪，浙江理工大學（非公開網路資源）
《關於首屏優化》，
一、概念
服務端渲染（ssr：server side render）：將元件或頁面通過伺服器生成html字串，再傳送到瀏覽器，最後將靜態標記"混合"為客戶端上完全互動的應用程式。
seo（search engine optimization）：搜尋引擎優化（搜尋優化）。
首屏時間：瀏覽器顯示第一屏頁面所消耗的時間。2秒以內是比較優秀的，5秒以內使用者可以接受，10秒以上就不可容忍了。
cdn（content delivery network）：內容分發網路。不同地理位置的使用者在傳送請求後會先訪問cdn節點。如果之前該路徑快取已存在，那麼就直接進行網路**，如果cdn節點的快取不存在或者已失效，它會根據服務配置查詢對應的內容伺服器獲取所需的資源返回給使用者，並將內容快取下來以便後續使用者訪問。因此，乙個地區內只要有乙個使用者先載入了cdn路徑資源，就會在cdn中建立快取，該地區的其他使用者訪問時可以直接進行內容**，不需要從配置中查詢。因此cdn技術在一定程度上解決網路擁塞情況，提高使用者的響應速度。
骨架屏：在頁面內容未載入完成的時候，先使用一些圖形進行佔位，待內容載入完成之後再把它替換掉。
二、前後端分離
當前的web應用開發模式是前後端分離：後端專注於資料介面服務，前端專注介面呼叫，頁面渲染。分工明確。
而在前後端分離之前，都是服務端渲染的方式。後端先呼叫資料庫，獲得資料之後，將資料和頁面元素進行拼裝，組合成完整的 html 頁面，再直接返回給瀏覽器。
三、服務端渲染優劣勢
優勢：首屏載入快、seo 優化。
劣勢：線上排錯不方便、職責混雜、服務端壓力較大。
四、首屏優化方法
首屏-瀏覽器進入第一頁：
可以將專案進行拆分，首屏專案使用服務端渲染，後續專案仍保持前後端分離。
首屏-移動端的每一頁，上下滾動的情況，出現在頁面首部的部分：
通過語法樹生成器將**轉成json格式的資料，在webpack配置entry時寫好首屏和次屏的入口檔案路徑。
通過webpack**分割工具，實現分段打包。
五、常見效能優化方法
減少http請求
懶載入使用cdn（內容分發網路）
骨架屏對於不頻繁修改的資料做瀏覽器快取
伺服器端渲染和客戶端渲染
網際網路早期，使用者使用瀏覽器瀏覽的都是一些沒有複雜邏輯的 簡單的頁面，這些頁面都是在後端將html拼接好的然後將之返回給前端完整的html檔案，瀏覽器拿到這個html檔案之後就可以直接解析展示了，而這也就是所謂的伺服器端渲染了。而隨著前端頁面的複雜性提高，前端就不僅僅是普通的頁面展示了，而可能新增...
伺服器端渲染和客戶端渲染
不知什麼時候腦海裡突然冒出個問題，當輸入乙個 時，展現在我們眼前的資料從何而來？然後想呀想，查呀查,隨之引入了第乙個概念就是伺服器端渲染和客戶端渲染.1.什麼是伺服器端和客戶端？伺服器端 顧名思義是提供服務的，接收客戶端發出的請求，然後於response作為回應。客戶端 同理，客戶 是發請求的那一方...
伺服器端渲染基礎
客戶端渲染 現代化的服務端渲染 優點 1.1 使用者體驗好 1.2 開發效率高 1.3渲染效能好 1.4可維護性好 缺點2.1 首屏渲染時間長 與傳統伺服器端渲染直接獲取服務端直接渲染好的html不同,單頁面應用使用js在客戶端生成html來呈現網頁內容,使用者需要等待客戶端js解析執行完才能看到頁...