一、单页面应用

  1、单页面应用(single-page application :SPA),是指在浏览器中运行的应用,在使用期间不会重新加载页面。

  2、它所有的活动局限于一个Web页面,仅在初始化加载时对应的HTML、JavaScript和CSS。一旦加载完成,SPA不会因为用户的操作而重新加载页面或者跳转。它是通过JavaScript动态变换HTML的内容,避免页面的重新加载,提供更具流畅性的用户体验。

  3.1、优点:前后分离,可以同时前后端的开发;减轻服务器的压力;更好的用户体验。

  3.2、缺点:SEO问题,由于是只有一个页面,搜索引擎在抓取数据的话只会抓取首页,其他跳转界面不会被抓取;

         浏览历史问题,也无浏览器记录,前进后退需要程序管理;

初次加载问题。

二、Backbone 简介

  1、BackBone 是由Jerry Ashkenas 创建的轻量级MVC JavaScript库,有两个特点:

    强制依赖Underscore.js

    非强制依赖于jQuery/Zepto

2、以下是架构图:

   当用户在浏览器输入我们想要访问的地址的时候,router就会监听到URL的hash值的改变,然后会匹配到相应的View界面,这个时候View就会告诉Model或者Collection,表明自己需要数据来轩然我们的页面,然后Model和Collection就去对应的数据请求。拿到数据之后就返回给View,然后渲染页面。

  

  

三、几种框架的简单介绍

  1、MVC 框架Model - View - Controller

     · 视图(View) 用户界面:传送指令到控制器

     · 控制器(Controller)业务逻辑:控制器完成业务逻辑后,要求model改变状态

     · 模型(Model)数据保存:将新数据发送到View,用户得到反馈

      

     

  2、MVP 框架Model - View - Presenter

    · 各部分之间的通信都是双向的

    · View与Model不发生直接的联系,主要通过Presenter传递

    · View非常薄,不部署任何业务逻辑

    · Presenter非常厚,部署所有的业务逻辑

      

  3、MVVM框架:Model - View - ViewModel

    · MVVM 模式将Presenter 改名为ViewModel,基本上与MVP模式完全一致

    · 区别是,它采用的是双向绑定模式(data Binding)View 的改动会自动反映在ViewModel上,反之亦然

    · 比如说View中的数据发生改变,不需要通知ViewModel,ViewModel自己就会获取改变,同样,Model改变,ViewModel不需要通知View,View自己就会知道。

      

 

backBone.js初识的更多相关文章

  1. Backbone.js学习之初识hello-world

    说了好久好久要学习Backbone.js,现在终于下定决心开始学习了.然后呢,就根据我的学习进度在这里做个简单的记录,方便新人,也方便我自己以后回忆. 准备 用bower下载这几个库或框架也是醉了.. ...

  2. 初识backbone.js

    backbone,英文意思是:勇气, 脊骨,但是在程序里面,尤其是在backbone后面加上后缀js之后,它就变成了一个框架,一个js库. backbone.js,不知道作者是以什么样的目的来对其命名 ...

  3. MVC、MVP、MVVM、Angular.js、Knockout.js、Backbone.js、React.js、Ember.js、Avalon.js、Vue.js 概念摘录

    注:文章内容都是摘录性文字,自己阅读的一些笔记,方便日后查看. MVC MVC(Model-View-Controller),M 是指业务模型,V 是指用户界面,C 则是控制器,使用 MVC 的目的是 ...

  4. Backbone.js应用基础

    前言: Backbone.js是一款JavaScript MVC应用框架,强制依赖于一个实用型js库underscore.js,非强制依赖于jquery:其主要组件有模型,视图,集合,路由:与后台的交 ...

  5. 我对Backbone.js的一些认识

    backbone.js已经不是当前最流行的前端框架了,但是对于我而言,依然具有比较好的学习价值.虽然目前来说,react,vue等mvvm框架非常火热,但是感觉自身还不到去使用这种框架的层次.这些技术 ...

  6. Backbone.js学习之Backbone.View(视图)

    Backbone.js为复杂WEB应用程序提供模型(models).集合(collections).视图(views)的结构.其中模型用于绑定键值数据和自定义事件:集合附有可枚举函数的丰富API: 视 ...

  7. 前端mvc框架backbone.js入门[转]

    原文地址:http://www.cnblogs.com/zhjh256/p/6083618.html 关于backbone.js的优缺点,这里就不详谈了,网上关于这方面的讨论很多了,而且各种框架之所以 ...

  8. Backbone.js

    Backbone.js是一套JavaScript框架與RESTful JSON的應用程式介面.也是一套大致上符合MVC架構的編程範型.Backbone.js以輕量為特色,只需依賴一套Javascrip ...

  9. 用Backbone.js教程系列的链接

    整理了一下用Backbone.js系列教程链接. Backbone.js入门教程 用Backbone.js创建一个联系人管理系统(一) 用Backbone.js创建一个联系人管理系统(二) 用Back ...

随机推荐

  1. 深入理解Java虚拟机(一)

    一.运行时数据区域 ​ 1.程序计数器: 当前线程执行字节码的行号指示器(通过改变计数器的值来选择下条需要执行的字节码指令) 每个线程有独立的程序计数器(线程私有,为了切换线程时能恢复到挣钱的执行位置 ...

  2. linux 按照端口一句命令杀死进程,按照进程名称一句命令杀死进程

    例如杀死nginx 按照程序名称杀死进程 例如杀死nginx的进程 ps -aux|grep nginx|grep -v grep|cut -c 9-15|xargs kill -9 或者 ps -a ...

  3. joda time, jackson 与 scala 反射

    1. scala 反射,获得所有 field name 可以直接从 case class 获得 field 而不必创建实例 (get fields of a class without an inst ...

  4. ArcGIS应用

    1.ArcGIS Server发布资源报错:网络资源问题 有可能是跟网络相关的服务没有开启,开启相关服务器后有可能可以解决此问题. 还有可能通过此法解决:开始--控制面板--网络和共享中心--高级共享 ...

  5. hwi-web安装

    hwi是hive的简单简单web端 安装hwi之前需要下载apache-hive-2.1.1-src,将hwi/web的打成hive-hwi-2.1.1.war.安装配置apache-ant-1.10 ...

  6. Ansible 实战:一键安装 LNMP

    Ansible 配置文件 : [root@center /data/ansiblework]# cat ansible.cfg [defaults] remote_user = root remote ...

  7. Splash wait() 方法

    wait()方法用于控制页面的等待时间,如下,实现访问淘宝并等待2秒,随后返回淘宝页面的源代码: function main(splash) splash:go("https://www.t ...

  8. 第六篇:Eclipse上运行第一个Hadoop实例 - WordCount(单词统计程序)

    需求 计算出文件中每个单词的频数.要求输出结果按照单词的字母顺序进行排序.每个单词和其频数占一行,单词和频数之间有间隔. 比如,输入两个文件,其一内容如下: hello world hello had ...

  9. 手把手让你实现开源企业级web高并发解决方案(lvs+heartbeat+varnish+nginx+eAccelerator+memcached)

    原创作品,允许转载,转载时请务必以超链接形式标明文章 原始出处 .作者信息和本声明.否则将追究法律责任.http://freeze.blog.51cto.com/1846439/677348 此文凝聚 ...

  10. php curl那点事儿

    curl是最常用功能之一初始化句柄 $ch = curl_init(); post 传$data 1. 如果$data是字符串,则Content-Type是application/x-www-form ...