文档中心

单页模式

单页模式(Single-Page Application)即在一个HTML5移动应用中只包含一个HTML页面,而不同视图的显示实际是在一个页面中采用动态显隐实现,而其中最重要的技术的就是Ajax,不同视图的获取都是通过Ajax从本地或远程服务器中获取。

也就是说,不同的视图都是一个HTML片段,而不是完整的HTML页面。

在 SPA 模式中,主页面(完整HTML页面)是可以独立加载、更新和替换的一些可视元素的组合(HTML片段)。通过这种方式,可以不必在每次用户操作后重新加载整个页面。在任何时候,都只显示与应用程序当前阶段相关的可视元素和内容。其他所有内容均被隐藏;但只要应用程序流程中需要用到它,它就会显示出来。

优点

  1. 共用的依赖库不必重复加载,只需在主页面加载一次,其他(HTML片段)不需要,这也间接提升页面加载速度。
  2. 使用CSS3做页面之间的切换,速度比原生切换webview快很多。

缺点

  1. 因为所有的HTML最终都是加载在主页面,所以可能存在js、css命名冲突。(所以JS和CSS的命名都需要进行有效管理,这一点需要时刻注意)
  2. 单页模式会使一个界面不断加载新的元素而导致界面逻辑复杂和页面膨胀

多页模式

多页模式(Multi-page Application)是相对于单页模式而言,应用中的每一个页面都是一个独立HTML页面,而不是HTML片段。

缺点

  1. 每个页面可能都会重复加载一些数据(JS、CSS、部分HTML代码等)
  2. 页面切换速度慢

开发建议

  1. 对于BingoTouch来说,单页或多页都是支持的,取决于使用的方式
  2. 简单或页面关系密切的应用建议使用单页模式
  3. 复杂且页面之间并无多大关系的应用使用多页模式