單頁面與多頁面的優缺點
單頁面應用(SPA),通俗一點說就是指只有一個主頁面的應用,瀏覽器一開始要加載所有必須的 html, js, css。所有的頁面內容都包含在這個所謂的主頁面中。但在寫的時候,還是會分開寫(頁面片段),然後在交互的時候由路由程序動態載入,單頁面的頁面跳轉,僅刷新局部資源。多應用於pc端。
多頁面(MPA),就是指一個應用中有多個頁面,頁面跳轉時是整頁刷新
單頁面的優點:
1,用戶體驗好,快,內容的改變不需要重新加載整個頁面,基於這一點spa對服務器壓力較小
2,前後端分離
3,頁面效果會比較炫酷(比如切換頁面內容時的專場動畫)
單頁面缺點:
1,不利於seo
2,導航不可用,如果一定要導航需要自行實現前進、後退。(由於是單頁面不能用瀏覽器的前進後退功能,所以需要自己建立堆棧管理)
3,初次加載時耗時多
4,頁面復雜度提高很多
下圖是別人家博主的總結的一張圖,感覺很實用:
感覺總結的還是太淺顯,和網上大部分的總結並沒有什麽區別,還是理解的不夠深入,歡迎各路大神點撥
單頁面與多頁面的優缺點
相關推薦
單頁面與多頁面的優缺點
png 比較 image 內容 html 程序 各路 有一個 部分 單頁面應用(SPA),通俗一點說就是指只有一個主頁面的應用,瀏覽器一開始要加載所有必須的 html, js, css。所有的頁面內容都包含在這個所謂的主頁面中。但在寫的時候,還是會分開寫(頁面片段),然後在
單頁面開發與多頁面開發
代碼 效果 服務器 ima 代碼重復 管理 .com 後臺 復用 單頁面開發與多頁面開發的優缺點。 根據用戶需求的不同,我們往往在開發網站的時候選擇合適的方案,在這裏說一說我的單頁面開發和多頁面開發的理解。 單頁面開發: 單頁面開發常用於webapp開
單頁面和多頁面開發優缺點
使用 缺點 頁面開發 堆棧 前後端分離 分離 實現 需要 建立 單頁面開發 優點:a.用戶體驗好,快,內容的改變不需要重新加載整個頁面,基於這一點spa對服務器壓力小 b.前後端分離 c.頁面效果會比較炫酷(比如切換頁面時的專場動畫) 缺
Vue-cli創建項目從單頁面到多頁面4 - 本地開發服務器設置代理
根目錄 control .com 目錄 pre 使用 exp class ble 前後端分離開發時,有時候會遇到跨域的情況:只在開發的時候存在跨域,項目上線後,由於配置的域名相同,跨域就會不存在。 這個時候,有兩種方案可以比較快的解決: 1、利用h5的特性,使用cors,在
iframe子頁面與父頁面元素的訪問以及js變量的訪問
++ src 行修改 動態 class ria 方法 修改 左右 1、子頁面訪問父頁面元素 parent.document.getElementById(‘id‘)和document相關的方法都可以這樣用 2、父頁面訪問子頁面元素 document.
34.條件變量與多線程(單播與多播)
[] 指針 編號 對象 創建 ++ notify join get 1 #define _CRT_SECURE_NO_WARNINGS 2 #include <iostream> 3 #include <thread> 4 #includ
js之iframe子頁面與父頁面通信
瀏覽器 cti data pos href 事件 java win 兩種方法 iframe子頁面與父頁面通信根據iframe中src屬性是同域鏈接還是跨域鏈接,通信方式也不同。 一、同域下父子頁面的通信 父頁面parent.html <html> <h
selenium多表單操作與多窗口,以及警告框處理
itl 很快 hand phone from close 註冊頁面 需要 http 知識是需要經常溫習的,不然是很容易遺忘的。 以前自己操作IFRAME,多窗口的時候,覺得很簡單。半年沒有操作自動化了,知識又還了回去。 寫博客有一個好處,可以把自己記住的知識點記錄下來,這樣
Spring MVC - MultipartFile實現檔案上傳(單檔案與多檔案上傳)
前提:引入jar包。 <dependency>
iframe父頁面與子頁面的互動
<iframe id="child" name="child" src="child.html"></iframe> 1.父頁面獲取子頁面的window物件 var childiframeWin = document.getElementById("child")
STM32 ADC單通道與多通道_DMA學習筆記
#include "stm32f10x.h"//這個標頭檔案包括STM32F10x所有外圍暫存器、位、記憶體映 射的定義#include "eval.h" //標頭檔案(包括串列埠、按鍵、LED的函式宣告)#include "SysTickDelay.h" #include "UART_INTERFACE.h
前端探祕-靜態頁面與動態頁面(靜態網站與動態網站)
靜態頁面 網頁程式碼都在頁面中,不用執行asp , php , jsp , .net等程式生成客戶端程式碼不能自主管理髮布更新的頁面,如想更新內容,要通過FTP軟體把檔案DOWN下來用網頁製作軟體修
c++單繼承與多繼承(包含虛擬函式與虛繼承的對比)
先來個概念分析題: class Person { public: void Show() { cout<<"Person::"<<_name&l
C#中型別後中單問號與多問號含義
在C#中有時會碰到變數型別後面個單問號或雙問號,如下int? id = null; private string GetData( ) { //邏輯處理; return data ?? "OK"; } 1、單問號:表示用於給變數賦初值,給變數(int型別)賦值
建立一個簡單spring例項,spring單例與多例,初始化與銷燬
(1)在配置完spring提示框架後(上一遍文章有介紹),首先建立一個專案,匯入sprig所需的jar包然後書寫主配置檔案applicationContext.<?xml version="1.0" encoding="UTF-8"?> <beans xml
單例與多例的差別
簡單理解單例多例,比如: 你用杯子喝可樂,喝完了不刷,繼續去倒果汁喝,就是單例。 你用杯子喝可樂,直接扔了杯子,換個杯子去倒果汁喝,就是多例。 單例多例需要搞明白兩個問題: 1. 什麼是單例多例;2. 如何產生單例多例;3. 為什麼要用單例多例4. 什麼時候用單例,什麼
執行緒安全(單例與多例)
又週五了,時間過得好快,住在集體宿舍,幾個宅男共處一室好是無聊,習慣性來到CSDN。今天一個應屆生同事突然問我為什麼老大要求我們不要在Service裡寫成員變數,說不安全,說為什麼不安全讓他自己去了解,看上去他沒有找到頭緒很是痛苦,想想當初這個問題也困擾過自己,向
iframe 父頁面與子頁面互相呼叫方法
HTML: <iframe src="" name="childframe" id="childframe" style="width:100%;min-height:400px;border:solid 1px #0062d5;" frameborder="0"&g
單繼承與多繼承中的虛擬函式表和虛擬函式指標
首先,我們瞭解一下何為單繼承,何為多繼承??單繼承:一個子類只有一個直接父類。多繼承:一個子類有兩個或多個直接父類。單繼承中的虛擬函式表分析:示例程式:#include <iostream> using namespace std; typedef void(*
面向物件:理解 Python 類的單繼承與多繼承
每種動物都有各自的特性,比如 老鼠會打洞 貓會爬樹 鯊魚會游泳 不同種類有不同的天性。而在程式設計師的思維中, 動物是物件, 天性是這個類方法或者屬性。 再延伸一下,比如Python是面向物件程式語言。有List、Str、Dict、Tuple等資料型別,這些