SPA(单页面web应用程序)
单页web应用(single page web application,SPA),就是只有一张web页面的应用,是加载单个HTML页面并在用户与应用程序交互时动态更新该页面的web应用程序。
浏览器一开始会加载必需的HTML、CSS和Javascript,所有的操作都在这张页面上完成,都有javascript来控制。因此,对单页面应用来说模块化的开发和设计显得相当重要。
一、特点:
速度:更好的用户体验,让用户在web app感受native app的速度和流畅。
MVC:经典MVC开发模式,前后端各负其责。
ajax:重前端,业务逻辑全部在本地操作,数据都需要通过AJAX同步、提交。
路由:在URL中采用#号来作为当前视图的地址,改变#号后的参数,页面并不会重载。
二、HTML容器管理
1、HTML管理原理
SPA项目的HTML结构与传统的HTML结构有非常不同的差异:
① 传统的HTML是将所有的HTML写在.html文件里。然后通过DOM方法在JS中进行操作。
② SPA项目中,为了保证每个UI模块的独立性,HTML结构被以模块的形式打碎分别放置在各个UI模块中。HTML以字符串的形式存放在子模块configMap.main_html中。当子模块接收到父模块传递过来的容器后通过$container.html(configMap.main_html);将子模块HTML结构载入到容器模块中。这样就完成了子模块HTML的加载。
参考来源:http://www.imooc.com/article/14257
http://www.searchsoa.com.cn/showcontent_81256.htm
SPA(单页面web应用程序)的更多相关文章
- ABP示例程序-使用AngularJs,ASP.NET MVC,Web API和EntityFramework创建N层的单页面Web应用
本片文章翻译自ABP在CodeProject上的一个简单示例程序,网站上的程序是用ABP之前的版本创建的,模板创建界面及工程文档有所改变,本文基于最新的模板创建.通过这个简单的示例可以对ABP有个更深 ...
- 通过Blazor使用C#开发SPA单页面应用程序(3)
今天我们来看看Blazor开发的一些基本知识. 一.Blazor组件结构 Blazor中组件的基本结构可以分为3个部分,如下所示: //Counter.razor //Directives secti ...
- Java快速开发平台强大的代码生成器,JEECG 3.7.5 VUE+ElementUI SPA单页面应用版本发布
JEECG 3.7.5 VUE+ElementUI SPA单页面应用版本发布 此版本为Vue+ElementUI SPA单页面应用版本,提供新一代风格代码生成器模板,采用Vue技术,提供两套精美模板E ...
- Javascript 与 SPA单页Web富应用
书单推荐 # <单页Web应用:JavaScript从前端到后端> http://download.csdn.net/detail/epubitbook/8720475 # <MVC ...
- 快速了解SPA单页面应用
简要 SPA单页网页应用程序这个概念并不算新,早在2003年就已经有在讨论这个概念了,不过,单页应用这个词是到了2005年才有人提出使用,SPA的概念就和它的名字一样显而易懂,就是整个网站不再像传统的 ...
- 由单页面web应用引发的企业应用问题
由于单页面web应用的流行,client与server端之间都对应的产生了一些微妙的变化,比方,client原来仅仅是用来展示页面和理清逻辑,而现在逐渐转变成了一个可以进入驱动状态的应用程序. 未来的 ...
- AngularJs(SPA)单页面SEO以及百度统计应用(上)
只有两种人最具有吸引力,一种是无所不知的人,一种是一无所知的人 问:学生问追一个女孩总是追不上怎么办?回答:女孩不是追来的,是吸引来的,你追的过程是吸引女孩的过程,如果女孩没有看上你,再追都是没有用的 ...
- 通过Blazor使用C#开发SPA单页面应用程序(1)
2019年9月23——25日 .NET Core 3.0即将在.NET Conf上发布! .NET Core的发布及成熟重燃了.net程序员的热情和希望,一些.net大咖也在积极的为推动.NET Co ...
- 通过Blazor使用C#开发SPA单页面应用程序(2)
今天我们尝试创建一个默认的Blazor应用. 1.安装 .Net Core 3.0需要Visual Studio 2019 的支持. 安装.Net Core 3.0 预览版 SDK版本,注意预览版对应 ...
随机推荐
- SSM框架关于后台返回JSON数据中显示很多不需要的字段为NULL
xml 配置 spring mvc 的 json 返回忽略 null 字段 <mvc:annotation-driven> <mvc:message-converters regis ...
- OpenGL1.0 线段
OpenGL1.0线段 DionysosLai2014-06-16 本篇作为我学习Opengl第一篇文档.希望自己能在图形学路上走得远一点,达到可以渲染游戏画质目的,现阶段是Box2 ...
- Install Haskell on Ubuntu and CentOS
For Ubuntu: Step one: Install GHC If you don't want to install curl you can skip step 1 and just dir ...
- nginx配置ThinkPHP5二级目录访问
可以通过 http://www.mracale.com/项目名/模块名/方法名 进行访问 第一步 首先,你要确保在不配置二级目录的情况下,可以通过浏览器访问到.例如:http://www.mracal ...
- 记ambari启用kerberos添加kafka组件后yarn和hive出现Failure unspecified at GSS-API level (Mechanism level: Checksum failed)--403错误
出现警告的过程是: 1.搭建ambari集群成功后,添加了hdfs和zk组件,然后启用了kerberos: 2.kerberos启用完毕后添加hbase和yarn.MapReduce.hive都没有出 ...
- su 与 su - 区别
su与su -都是用来切换用户的命令,简单说它们之间的区别就是:su -切换的干净彻底,而su 切换用户却拖泥带水. su su username,切换到指定用户,但是当前目录不会变化,环境变量还是上 ...
- 利用google api生成二维码名片
利用google api生成二维码名片 二维条码/二维码可以分为堆叠式/行排式二维条码和矩阵式二维条码.堆叠式/行排式二维条码形态上是由多行短截的一维条码堆叠而成:矩阵式二维条码以矩阵的形式组成,在矩 ...
- 新式转型操作符[条款9] --《C++必知必会》
在旧式转型(cast)下面隐藏着一些见不得人的.鬼鬼祟祟的东西.他们的语法形式使其在一段代码中通常很难引起人们的注意,但它们可能会搞一些可怕的破坏活动,就好比你冷不丁被一个恶棍猛击一拳似的.让我们阐明 ...
- Linux系统——vim编辑器
一.Linux系统中最常用的文本编辑器 vi:类Unix系统中默认的文本编辑器 vim:vi编辑器的增强版 作用:创建或修改文本文件:维护Linux系统中各种配置文件 二.三种切换模式命令模式输入模式 ...
- PKU 1655 Balancing Act(树+树的重心)
#include<cstdio> #include<cstring> #include<algorithm> #define maxn 20005 using na ...