SPA架构的优点和缺点以及一些思考
SPA是什么?
全称是单页面应用。
一个SPA就是一个WEB应用,它所需的资源(HTML CSS JS等),在一次请求中就加载完成,也就是不需刷新地动态加载。
用术语“单页”就是因为页面在初始化加载后就永远不会重新加载刷新。
优点:
减轻服务器端的压力。
因为服务器先将一份包含了静态资源、JavsScript和模板的静荷数据(payload)发送到了客户端,之后客户端只需要获取渲染页面或视图所需要的数据即可。
payload就是起关键作用的资源
提高了页面的渲染效果。
由于移动设备的流行,可以开发提供JSON格式数据的网络服务,然后可以提供不同的客户端使用。
SPA的使用,我们可以使用一个HTTP API,一个HTTP API相比在服务端渲染一个HTML页面有诸多好处,这样就可以很方便的进行单元测试等操作,还可以被其他很多客户端程序所用。
SPA最大的好处就是大量的工作都在浏览器中完成,服务端承担更少的工作,这样就可以处理更多的请求。同时SPA需要额外的请求模版开销,我们可以通过预编译模版、缓存机制和将多个模板拼接成一个大的模板来减少请求数量。
缺点:
首屏加载时间会很长。
SEO不友好。
主要是因为SPA利用了hash片段实现路由,而利用hash片段不会作为HTTP请求中的一部分发送给服务器。
而SPA使用hash片段的目的是:当片段的内容发送变化时,浏览器不会像URI发送变化时那样发起新的网络请求。这样就可以只请求页面或视图渲染所需要的数据,而不是为每一个页面获取并解析整份文档。
SPA架构的优点和缺点以及一些思考的更多相关文章
- 架构设计的UML图形思考
本篇紧接着上一篇 基本OOP知识 ,介绍高焕堂老师的第二讲. 架构设计的UML图形思考.本篇最重要的是三个词语:图形.思考.UML. 架构师的作用体现主要在项目开发前期.在整个项目还没有完毕的时 ...
- 单页面应用SPA架构
个人认为单页面应用的优势相当明显: 前后端职责分离,架构清晰:前端进行交互逻辑,后端负责数据处理. 前后端单独开发.单独测试. 良好的交互体验,前端进行的是局部渲染.避免了不必要的跳转和重复渲染. 当 ...
- 构建iOS稳定应用架构时方案选择的思考,主要涉及工程结构,数据流思想和代码规范
工程结构架构,减少耦合混乱以及防治需求大改造成结构重构,如何构建稳定可扩展可变换的工程结构的思考 我打算采用Information flow的方式自上而下,两大层分为基础层和展现层的结构.基础层分为多 ...
- 关于PHP架构师进阶的一些思考
相信大家都有感觉,就是当程序员写业务写了几年后,就会有想进阶的想法,技术方面当然就是架构师了,然后具体从哪些方面丰富自己才能个达到目的呢?大部分人可能会很迷茫,当然也包括我, 最近和很多大牛交流了一些 ...
- Serverless 架构的优点和缺点
Serverless 的优势 在我使用 Serverless Framework 开发 AWS Serverless 应用的过程中,最方便的莫过于,第一次部署和第二次.第三次部署没有什么区别.只需要执 ...
- 关于三层架构和MVC模式的思考
MVC模式 核心: 1.解耦Model和View,即使得Model可以被不同的展示,比如一批统计数据可以分别用柱状图.饼图表示 2.Controller用来保证Model和View的同步 Model ...
- SPA架构
databus ajax处理得到得数据 service 对databus做缓存,以及业务(如评论列表,评论详情) component 组件 html+css+js组成 evenbus 组件之间通讯,数 ...
- ASP.NET三层架构的优点和缺点
原文发布时间为:2009-10-24 -- 来源于本人的百度文章 [由搬家工具导入] 小项目,以后变动不大的不用三层架构。 ASP.NET三层结构说明 完善的三层结构的要求是:修改表现层而不用修改逻辑 ...
- 《SPA设计与架构》之认识SPA
原文 简书原文:https://www.jianshu.com/p/84323f530223 大纲 前言 1.什么是单页面应用程序(SPA) 2.SPA与传统Web应用的区别 3.关于SPA的使用 4 ...
随机推荐
- new delate he typedef的含义
new: new 类型[初值] 如: new int ; //开辟一个存放整数的存储空间,返回一个指向该存储空间的 ...
- SpringBoot对注册用户密码进行Bcrypt密码加密
一.注册用户时,用户的密码一般都是加密存储在数据库中.今天我要用到的加密方式是Bcrypt加密. 1.首先在SpringBoot项目的pom文件中,引入SpringSecurity相关依赖,目的是为了 ...
- 2018上IEC计算机高级语言(C)作业 第3次作业_说明
一.博客作业内容 2018上IEC计算机高级语言(C)作业 第3次作业 二.评分规则说明 1.程序调试题,要描述出调试所遇到问题及修改内容,并表述清楚程序功能.流程图不规范的会减1-2分: 2.知识点 ...
- js电子表
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...
- day33 锁和队列
队列 #put 和 get #__author : 'liuyang' #date : 2019/4/16 0016 上午 11:32 # 多进程之间的数据是隔离的 # 进程之间的数据交互 # 是可 ...
- tensorflow学习之(七)使用tensorboard 展示神经网络的graph/histogram/scalar
# 创建神经网络, 使用tensorboard 展示graph/histogram/scalar import tensorflow as tf import numpy as np import m ...
- XMLHttpRequest状态码及相关事件
1.创建一个XMLHttpRequest对象 2.对XMLHttpRequest对象进行事件的监听(定义监听事件的位置不影响 3.对XMLHttpRequest对象的状态码 状态 名称 描述 0 ...
- C语言字符串和十六进制的相互转换方式
C语言的字符串操作并不像java,Csharp那样提供直接的方法,简单粗暴.所以,在转换的时候往往费力费时,近日做项目正好用到和java程序通讯,java发送过来的数据是十六进制数字组成的字符串,解析 ...
- 2019.03.28 bzoj3597: [Scoi2014]方伯伯运椰子(01分数规划)
传送门 题意咕咕咕有点麻烦不想写 思路: 考虑加了多少一定要压缩多少,这样可以改造边. 于是可以通过分数规划+spfaspfaspfa解决. 代码: #include<bits/stdc++.h ...
- Day04 (黑客成长日记) 集合记录
集合 集合:是可变的数据类型 ,它里面的数据类型必须是不可变的数据类型,无序,不重复,不同于字典,他有元素,没有键值对(编码不常用) li = set([1,2,3]) li = {'alex','w ...