單頁應(yīng)用程序(SPA)是一種網(wǎng)站設(shè)計方法,其中每個新頁面的內(nèi)容不是通過加載新的HTML頁面來提供的,而是通過Javascript操作現(xiàn)有頁面上的DOM元素來動態(tài)生成的。想學(xué)習(xí)單頁應(yīng)用程序的更多技能,建議參加Web前端培訓(xùn),你可以得到更加全面系統(tǒng)的學(xué)習(xí),快速提升自己。
在更傳統(tǒng)的web頁面體系結(jié)構(gòu)中,index.html頁面可能鏈接到服務(wù)器上的其他html頁面,瀏覽器將從頭開始下載和顯示這些頁面。
SPA方法允許用戶在更新或獲取新元素時繼續(xù)使用頁面并與之交互,并且可以導(dǎo)致更快的交互和內(nèi)容重新加載。此外,HTML5歷史API允許我們在不重新加載頁面的情況下更改頁面的URL,從而允許我們?yōu)椴煌囊晥D創(chuàng)建單獨的URL。
一旦進(jìn)入SPA,應(yīng)用程序就能夠通過AJAX請求或WebSocket從服務(wù)器動態(tài)獲取內(nèi)容。這允許瀏覽器在后臺向服務(wù)器請求獲取附加內(nèi)容或新“頁面”時保持當(dāng)前頁面的打開狀態(tài)。
如果您曾經(jīng)開始過搜索查詢,并且在鍵入時在輸入表單下方顯示了中間結(jié)果,那么您已經(jīng)看到了在更新這些DOM元素的背景中發(fā)生的動態(tài)查詢。事實上,服務(wù)器查詢可以獲取任何類型的數(shù)據(jù),通常采用JSON有效負(fù)載、字符串甚至已經(jīng)準(zhǔn)備好呈現(xiàn)的HTML元素的形式。在Web前端培訓(xùn)中,有很多關(guān)于單頁應(yīng)用程序(SPA)的課程,通過專業(yè)老師的指導(dǎo)教學(xué),可以很快掌握SPA的開發(fā)技能。
何時使用單頁應(yīng)用程序,何時不使用?
什么時候應(yīng)該考慮使用單頁應(yīng)用程序?
首先,如果您希望在用戶和應(yīng)用程序之間進(jìn)行豐富的交互,那么SPA幾乎是必不可少的。第二,如果你想在頁面上提供實時更新,你肯定需要使用這種方法;通知、數(shù)據(jù)流和實時圖表都需要使用這種方法。
你應(yīng)該避免使用SPA嗎?
如果您的內(nèi)容是純靜態(tài)的,那么引入SPA會縮短用戶的加載時間,要求用戶在能夠查看任何內(nèi)容之前下載并執(zhí)行Javascript負(fù)載。然后,可以通過簡單地根據(jù)請求顯示靜態(tài)HTML內(nèi)容來提高瀏覽器年齡較大或互聯(lián)網(wǎng)連接較慢的用戶的可訪問性。最后,如果機(jī)器人程序無法查看任何標(biāo)題或內(nèi)容,無法顯示任何HTML內(nèi)容可能會損害SEO排名。
上面討論的服務(wù)器端呈現(xiàn)方法可以改善加載時間的情況,并為未啟用Javascript的用戶提供一些基本的可讀性。建議至少為未啟用Javascript的用戶提供內(nèi)容的基本功能,以便他們有機(jī)會根據(jù)從初始頁面加載中看到的內(nèi)容來決定啟用Javascript。參加Web前端培訓(xùn),有明確清晰的學(xué)習(xí)路線,有系統(tǒng)規(guī)范的實時熱門課程,可以在短時間內(nèi)盡快掌握SPA的相關(guān)知識,有助于你更好地進(jìn)行開發(fā)工作。