我們都知道，網頁上的很多內容之所以能那么豐富，是因為大量的css、js去渲染出這個頁面。那么他們是如何渲染的呢？那么就要說到我們本文的兩種渲染方式了，即客戶端渲染和服務端渲染。

正文

本文將分別講述兩種渲染方式的區別和他們各自的優缺點，以及他們在真實項目中的運用。如果不想看具體過程講解的可以直接跳到最后的總結看結論.

一、客戶端渲染

圖片講解

文字講解

看了圖后，我給大家總結一下，大致過程就是 :

用戶輸入地址，客戶端向服務器發送請求

=> 服務器傳給瀏覽器相應的網頁文件

=> 瀏覽器解析文件

=> 遇到ajax請求則向服務器再次請求一些數據

=> 服務器再次向瀏覽器發送相應的數據

=> 瀏覽器拿到ajax請求返回的數據后，將數據渲染在頁面上

真實的客戶端渲染案例

在上面我們也看到了，客戶端渲染是在請求回數據后就已經開始渲染了，只是有些數據還沒拿到，暫時沒法渲染，不過大部分的頁面內容我們都已經可以看到了，所以客戶端渲染可以完成頁面的局部刷新。例如JD的商品評論數據

大家看，我在點擊評論的下一頁時，整個頁面沒有刷新，瀏覽器上的網址也沒有變化，只有評論的內容做了一個刷新，這就是一個典型的客戶端渲染的例子，進入這個頁面時，其他的內容都被瀏覽器渲染好了，而評論信息是在我們點擊下一頁時，客戶端向服務器發送ajax請求，拿到了這一頁的評論信息，再在這個部分做一個局部的數據重新渲染。

優點可以向用戶快速展示頁面的內容，增加用戶體驗

給別人爬蟲爬取相應的內容增加一定的困難

缺點可能需要向服務器請求多次數據

不利于SEO 搜索引擎優化，即百度、搜狗等搜索引擎搜索不到客戶端渲染的數據

二、服務器渲染

圖片講解

文字講解

同樣的，看完圖我給大家總結一下，服務器渲染的步驟就是：

客戶端向服務器發送一次請求

=> 服務器接收請求，并在服務端操作網頁文件，將對應數據導入文件

=> 服務器在服務端渲染好整個網頁，發送給客戶端

=> 客戶端接收服務器發送過來的網頁文件，不需要做任何操作，直接呈現

真實的服務器渲染案例

大家看，我在電腦的分類購物列表中，點擊下一頁時，整個頁面做了一個刷新，瀏覽器上的網址也做了變化，這就是服務器渲染的一個典型案例，整個網頁做一個刷新，正應對了我們上面的圖片講解，是瀏覽器向服務器請求，服務器給瀏覽器發送一整個頁面。

優點只需要向服務器請求一次

利于SEO 搜索引擎優化，即能被搜索引擎搜索到，能向用戶展示你網頁的東西

缺點如果數據量過大，在服務器渲染的時間就會過長，造成瀏覽器暫時的空白

容易被爬蟲爬取

三、如何區分客戶端渲染和服務器渲染第一種方法

若頁面做整體的刷新，即網址發生改變，就是服務器渲染

若頁面做了局部刷新，即網址沒發生改變，就是客戶端渲染

第二種方法(有gif動圖展示)

若查看網頁源代碼時，查找不到網頁中的一些內容，那就是客戶端渲染

若查看網頁源代碼時，能找到網頁中對應的內容，那就是服務器渲染

大家看，這個商品的名稱在網頁源代碼中，能被搜索到，說明該條數據是被服務器渲染出來的。

大家看，這個商品的評論信息在網頁源代碼中，不能被搜索到，說明該條數據是被客戶端渲染出來的。

四、總結

客戶端渲染：頁面的渲染工作都是由瀏覽器來完成的，服務器只是負責提供數據。

客戶端渲染能盡早的把頁面展示給用戶，用戶體驗好

不容易被爬蟲爬取數據，同時也無法被搜索引擎搜索到

服務器渲染：頁面渲染的工作都是由服務端來完成的，數據也是由服務端提供的，瀏覽器只負責展示頁面內容

容易被爬蟲爬取數據，同時能被搜索引擎搜索到，能在搜索引擎中向用戶展示數據

那是用客戶端渲染好還是服務器渲染好呢？

其實一般的頁面中，兩種渲染是相結合著使用的，因為我們會有些數據不想過早的傳過來，想要被用到時再去拿數據，同時也不想被爬蟲那么輕易的爬取，而且也不需要被搜索引擎搜索并展示，我們就可以用客戶端渲染，例如我們本文中提到的商品評論信息。

但有時，我們想讓我們網頁的數據被搜索引擎搜索到，能讓用戶在使用搜索引擎的時候，查找到我們的數據信息，我們就可以使用服務器渲染。例如我們本文提到的電商網站的商品的基本信息，商品能被用戶在搜索引擎搜索到，才能有更大的機會賣出去嘛，哈哈哈 這個解釋應該挺貼切了吧。

結束語

好了，給大家講了那么多，也是想讓大家了解一下這兩種渲染具體是怎么做的，同時也是幫我自己鞏固一下知識點，畢竟每天學習的東西那么多，但記住的又很少。希望這篇文章對大家有所幫助~

希望這篇文章對大家能有所幫助，我是Lpyexplore，一個因python爬蟲而轉入前端的程序員，關注我，帶你爬蟲過程中學習Web。公眾號：Lpyexplore的編程小屋

總結

以上是生活随笔為你收集整理的python 服务端渲染_客户端渲染和服务器渲染的区别的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。