前后端分離是否會(huì)影響首屏加載時(shí)間？

謝邀，根據(jù)我在BAT的開(kāi)發(fā)經(jīng)驗(yàn)來(lái)說(shuō)，如果使用了前后端分離，首屏加載時(shí)間是會(huì)受到一定影響，但是與前后端分離帶來(lái)的好處比起來(lái)，這個(gè)缺點(diǎn)是可以通過(guò)其他方式來(lái)彌補(bǔ)的。

首先由于前端要與后端通信才能獲取數(shù)據(jù)，再渲染到頁(yè)面上，這個(gè)等待時(shí)間在沒(méi)有緩存的情況下，一定會(huì)使首屏加載時(shí)間變慢。

我提供以下4個(gè)思路給大家分享：

1 在前后端分離的中間層使用node或者php。中間層可以做很多事情，比如路由控制，接口代理，服務(wù)端渲染等等，這里不妨用php來(lái)進(jìn)行服務(wù)端渲染，從而加快數(shù)據(jù)的獲取速度。

2 做一個(gè)loading的覆蓋頁(yè)，分散用戶的注意力，從而使其忽視加載時(shí)間長(zhǎng)短。比如目前APP常見(jiàn)的開(kāi)屏廣告，很多都是在wifi模式下預(yù)下載好的，然后等你下次打開(kāi)app的時(shí)候，作為首屏展示給你，在你等待廣告過(guò)去，或者去尋找那個(gè)小小的“跳過(guò)”按鈕的時(shí)候，前后端的通信已經(jīng)完成了。對(duì)于APP來(lái)說(shuō)，即掙了廣告費(fèi)，又不會(huì)讓用戶感覺(jué)到自己加載慢，真的是一舉兩得。

3 使用第三方組件，比如react-placeholder。

4 優(yōu)化網(wǎng)絡(luò)，包括減少請(qǐng)求數(shù)（比如不要打開(kāi)首屏的時(shí)候就發(fā)送一堆請(qǐng)求給后端），減少傳輸體積（header和body中精簡(jiǎn)數(shù)據(jù)），合理安排請(qǐng)求順序（比如在頁(yè)面上方的數(shù)據(jù)調(diào)用A接口，下方的數(shù)據(jù)調(diào)用B接口，那么就要先調(diào)用A接口，再調(diào)用B接口，盡快把用戶先看到的區(qū)域數(shù)據(jù)加載好）等，通過(guò)這些方式，也能夠減少首屏的加載等待時(shí)間。

以上是我的淺見(jiàn)，歡迎各位在下方評(píng)論區(qū)給我交流點(diǎn)贊。

我是蘇蘇思量，來(lái)自BAT的Java開(kāi)發(fā)工程師，每日分享科技類見(jiàn)聞，歡迎關(guān)注我，與我共同進(jìn)步。