react首屏加載優(yōu)化 前后端分離是否會影響首屏加載時間?
前后端分離是否會影響首屏加載時間?目前,為了提高開發(fā)效率,很多公司都采用了前端和后端分離的開發(fā)模式,即體系結(jié)構(gòu)的分離和解耦。前端和后端執(zhí)行各自的任務(wù),并通過restfulapi調(diào)用數(shù)據(jù)。這種方式有很多
前后端分離是否會影響首屏加載時間?
目前,為了提高開發(fā)效率,很多公司都采用了前端和后端分離的開發(fā)模式,即體系結(jié)構(gòu)的分離和解耦。前端和后端執(zhí)行各自的任務(wù),并通過restfulapi調(diào)用數(shù)據(jù)。這種方式有很多優(yōu)點,比如:前后端分離部署:降低了后端服務(wù)器的壓力,后端服務(wù)器不需要負責前端頁面的呈現(xiàn),只負責數(shù)據(jù)的處理,所以性能會得到提高;
高重用性:前后端分離本質(zhì)上也是系統(tǒng)分離,它可以實現(xiàn)同一個后端系統(tǒng)向多個前端系統(tǒng)提供數(shù)據(jù),并且具有良好的可擴展性更高;
并行開發(fā),提高效率:前端和后端并行開發(fā),提前約定好數(shù)據(jù)格式(mock),提高項目開發(fā)效率。
但是,前端和后端的分離也帶來了一些問題,例如第一次屏幕加載和渲染時間。
至于前端和后端的分離是否會影響第一次屏幕加載,我想說的是有很多,但影響的程度取決于代碼的質(zhì)量。只要優(yōu)化效果好,第一屏加載時間不會太慢。
,與大家分享:
前端和后端分開部署,CDN加速;
前端盡量少調(diào)用多個API,建議調(diào)用API網(wǎng)關(guān),實現(xiàn)多個API的請求合并;
后端API域名使用單獨的域名,禁止cookie傳輸;
一些數(shù)據(jù)本地緩存處理;
不重要的數(shù)據(jù)延遲請求加載。
??今很多公司為了提高開發(fā)效率采用前后端分離的開發(fā)模式,這是架構(gòu)上的分離解耦,前后端各司其職,通過RESTful API來調(diào)用數(shù)據(jù)。這樣做的好處也有不少,如:邏輯分離:業(yè)務(wù)邏輯放在后端,前端邏輯放在前端,這樣一來,數(shù)據(jù)及邏輯上都很清晰;
前后端分離部署:減輕了后端服務(wù)器的壓力,后端服務(wù)器不需要負責前端頁面的渲染,只負責數(shù)據(jù)處理,性能上會有所提高;
復(fù)用性較高:前后端分離本質(zhì)上也是系統(tǒng)分離,可以做到同一個后端系統(tǒng)提供數(shù)據(jù)給多個前端系統(tǒng),擴展性更高;
并行開發(fā),提高效率:前后端并行開發(fā),提前約定好數(shù)據(jù)格式即可(mock),提升了項目開發(fā)效率。
邏輯分離:業(yè)務(wù)邏輯放在后端,前端邏輯放在前端,這樣一來,數(shù)據(jù)及邏輯上都很清晰;
前后端分離部署:減輕了后端服務(wù)器的壓力,后端服務(wù)器不需要負責前端頁面的渲染,只負責數(shù)據(jù)處理,性能上會有所提高;
復(fù)用性較高:前后端分離本質(zhì)上也是系統(tǒng)分離,可以做到同一個后端系統(tǒng)提供數(shù)據(jù)給多個前端系統(tǒng),擴展性更高;
并行開發(fā),提高效率:前后端并行開發(fā),提前約定好數(shù)據(jù)格式即可(mock),提升了項目開發(fā)效率。
但是,前后端分離也帶來了一些問題,比如大家比較關(guān)注的首屏加載渲染時間的問題。
對于前后端分離會不會影響首屏加載,我想說的是,多少都是有的,但影響程度要看代碼的質(zhì)量了,只要優(yōu)化得好,首屏加載時間不會太慢。
我們在進行前后端分離時有一些技巧來縮短首屏加載時間的,分享給大家:
前端與后端分別部署,都走CDN加速;
前端盡可能少的調(diào)用多個API,建議調(diào)用一個API網(wǎng)關(guān)來實現(xiàn)多個API的請求合并;
后端API域名使用單獨域名,禁止cookies傳輸;
部分數(shù)據(jù)本地緩存處理;
不重要的數(shù)據(jù)惰性請求加載。
綜上,前后端分離在一定程度上是會影響首屏加載時間的,但是也有調(diào)優(yōu)方案,總體上時間不會相差太多。
以上回答希望對大家有所幫助,如果其它網(wǎng)友有不同見解,也歡迎在下方評論交流 ~