隨著各大前端框架的誕生和演變，SPA開始流行，單頁(yè)面應(yīng)用的優(yōu)勢(shì)在于可以不重新加載整個(gè)頁(yè)面的情況下，通過ajax和服務(wù)器通信，實(shí)現(xiàn)整個(gè)Web應(yīng)用拒不更新，帶來了極致的用戶體驗(yàn)。然而，對(duì)于需要SEO、追求極致的首屏性能的應(yīng)用，前端渲染的SPA是糟糕的。好在Vue 2.0后是支持服務(wù)端渲染的，零零散散花費(fèi)了兩三周事件，通過改造現(xiàn)有項(xiàng)目，基本完成了在現(xiàn)有項(xiàng)目中實(shí)踐了Vue服務(wù)端渲染。

關(guān)于Vue服務(wù)端渲染的原理、搭建，官方文檔已經(jīng)講的比較詳細(xì)了，因此，本文不是抄襲文檔，而是文檔的補(bǔ)充。特別是對(duì)于如何與現(xiàn)有項(xiàng)目進(jìn)行很好的結(jié)合，還是需要費(fèi)很大功夫的。本文主要對(duì)我所在的項(xiàng)目中進(jìn)行Vue服務(wù)端渲染的改造過程進(jìn)行闡述，加上一些個(gè)人的理解，作為分享與學(xué)習(xí)。

概述

本文主要分以下幾個(gè)方面：

什么是服務(wù)端渲染？服務(wù)端渲染的原理是什么？

Vue.js是構(gòu)建客戶端應(yīng)用程序的框架。默認(rèn)情況下，可以在瀏覽器中輸出Vue組件，進(jìn)行生成DOM和操作DOM。然而，也可以將同一個(gè)組件渲染為服務(wù)器端的HTML字符串，將它們直接發(fā)送到瀏覽器，最后將這些靜態(tài)標(biāo)記"激活"為客戶端上完全可交互的應(yīng)用程序。

上面這段話是源自Vue服務(wù)端渲染文檔的解釋，用通俗的話來說，大概可以這么理解：