说说你对SPA的理解,他的优缺点分别是什么?

    SPA(single-page application) 尽在Web页面初始化时加载相应的HTML,JavaScript和CSS。一旦页面加载完成,SPA不会因为用户的操作而进行页面的重新加载或者跳转;取而代之的时利用路由机制实现HTML内容的变化,UI与用户的交互,避免页面的重新加载。

    优点:

      用户体验好、快、内容的改变不需要重新加载真个页面,避免了不必要的跳转和重复渲染;甚至于上面的一点,SPA相对对服务器压力小;前后端职责分离,架构清晰,前端进行交互逻辑,后端负责数据处理;

    缺点:

      初次加载耗时多;位实现单页Web应用功能及显示效果,需要在加载页面的时候讲JavaScript、CSS统一加载,部分页面按需加载,前进后退路由管理,由于单页应用在一个页面中显示所有的内容,所以不能使用浏览器的前进后退功能,所有页面切换需要自己建立堆栈管理;SEO难度较大;由于所有的内容都在一个页面中动态替换显示,所以SEO上有着天然的弱势

    总结:

      整个应用只有一个.html文件

      S(Single)P(Page)A(applaction)

      单页应用的优点,全局只有一个html,他的刷新是局部刷新。  

      优点是:响应速度快,用户体验性好

      缺点是:不利于SEO(搜索引擎)优化,首页加载过慢

    单页应用的案例: se6官网

vue中SPA的优缺点和理解的更多相关文章

  1. vue中的钩子函数的理解

    接下来我们对几个钩子函数进行解释 beforeCreated:这个钩子函数实在vue实例创建后,触发的.这个时候还没有进行data里的数据监听和事件的初始化 其实大家很多时候都会在created钩子函 ...

  2. vue中关于computed的一点理解

    computed相当于属性的一个实时计算,如果实时计算里关联了对象,那么当对象的某个值改变的时候,同事会出发实时计算. 例子: <body id="content"> ...

  3. 理解MVVM在react、vue中的使用

    理解MVVM在react.vue中的使用 一:什么是MVC.为什么不用MVC 1:MVC的含义: M(modal):是应用程序中处理数据逻辑的部分. V (view)  :是应用程序中数据显示的部分. ...

  4. 理解vue中的scope的使用

    理解vue中的scope的使用 我们都知道vue slot插槽可以传递任何属性或html元素,但是在调用组件的页面中我们可以使用 template scope="props"来获取 ...

  5. 理解Vue中的Render渲染函数

    理解Vue中的Render渲染函数 VUE一般使用template来创建HTML,然后在有的时候,我们需要使用javascript来创建html,这时候我们需要使用render函数.比如如下我想要实现 ...

  6. 【转】简单理解Vue中的nextTick

    前言: Vue中的nextTick涉及到Vue中DOM的异步更新,感觉很有意思,特意了解了一下.其中关于nextTick的源码涉及到不少知识,很多不太理解,暂且根据自己的一些感悟介绍下nextTick ...

  7. 简单理解Vue中的nextTick

    Vue中的nextTick涉及到Vue中DOM的异步更新,感觉很有意思,特意了解了一下.其中关于nextTick的源码涉及到不少知识,很多不太理解,暂且根据自己的一些感悟介绍下nextTick. 一. ...

  8. vue中config/index.js:配置的详细理解

    当我们需要和后台分离部署的时候,必须配置config/index.js: 用vue-cli 自动构建的目录里面  (环境变量及其基本变量的配置) var path = require('path') ...

  9. 对vue中 默认的 config/index.js:配置的详细理解 -【以及webpack配置的理解】-config配置的目的都是为了服务webpack的配置,给不同的编译条件提供配置

    当我们需要和后台分离部署的时候,必须配置config/index.js: 用vue-cli 自动构建的目录里面  (环境变量及其基本变量的配置) var path = require('path') ...

随机推荐

  1. jq 导航跟随 模拟京东手机端

    想做一个导航跟随,但是代码都要下载,自己简单些了一个,css都放html里面了,所以也不用下载直接新建html,然后粘贴,点开就是导航跟随效果 效果如图 <!DOCTYPE html> & ...

  2. 动态规划-01背包-Tallest Billboard

    2020-02-07 17:46:32 问题描述: 问题求解: 解法一:BF 看问题规模看似可以直接暴力解决. 如果直接去解肯定是会超时的,因为每次将原空间划分成A区域,B区域和剩余区域的时间复杂度为 ...

  3. 机器学习算法系列:FM分解机

    在线性回归中,是假设每个特征之间独立的,也即是线性回归模型是无法捕获特征之间的关系.为了捕捉特征之间的关系,便有了FM分解机的出现了.FM分解机是在线性回归的基础上加上了交叉特征,通过学习交叉特征的权 ...

  4. 「MoreThanJava」当大学选择了计算机之后应该知道的

    「MoreThanJava」 宣扬的是 「学习,不止 CODE」,本系列 Java 基础教程是自己在结合各方面的知识之后,对 Java 基础的一个总回顾,旨在 「帮助新朋友快速高质量的学习」. 当然 ...

  5. iOS MachO

    一.前言 1.1 程序和进程 广义上的程序就是一个静态的可执行文件,是由一个已经编译好的指令和数据集合的一个文件.就像通过 Xcode 编译好的 Mach-O 文件.而进程则是一个动态的概念,是程序的 ...

  6. 【宇哥带你玩转MySQL】索引篇(一)索引揭秘,看他是如何让你的查询性能指数提升的

    场景复现,一个索引提高600倍查询速度? 首先准备一张books表 create table books( id int not null primary key auto_increment, na ...

  7. 使用Dism命令对Win7镜像进行操作

    在操作前,我们需要下载Win7部署工具AIK和Win7原版镜像 ★镜像迅雷链接 ed2k://|file|cn_windows_7_ultimate_with_sp1_x64_dvd_u_677408 ...

  8. Python数据库MySQL之数据备份、pymysql模块

    一 IDE工具介绍 生产环境还是推荐使用mysql命令行,但为了方便我们测试,可以使用IDE工具 下载链接:https://pan.baidu.com/s/1bpo5mqj 掌握: #1. 测试+链接 ...

  9. [教程]KALI LINUX 2.0 2019 更新国内源

    2019年最新版本KALI 为 KALI 2019.1 下载地址:https://www.kali.org/downloads/ 有的新入门的朋友可能会问,为什么每次都无法手动更新 例如:Update ...

  10. 邮件服务TLS/SSL,CA证书

     邮件服务TLS/SSL,CA证书 案例1:OpenSSL及证书服务 案例2:邮件TLS/SSL加密通信 1 案例1:OpenSSL及证书服务 1.1 问题 本案例要求熟悉OpenSSL工具的基本使用 ...