为什么我们需要单页应用程序？

Question

该单页应用(SPA)已经到了我们.它也带来了许多新的东西,比如路由,客户端页面生命周期,MVC模式,MVVM模式,MV*模式......以及一些Javascript模式也像AMD模式,Singleton,Facade一样来到我们这里,..

还开发了许多SPA框架和库.我们可以在互联网上找到它的一些.它们是AngularJs,Reactjs,BackboneJs,DurandalJs,以及许多第三方组件,使得Javascript编码更容易,如RequireJs,Amplifyjs,BreezeJs ......

但我想我们为什么需要SPA呢？因为它被视为在开发Web应用程序时引入了一些新的复杂内容.尽管有SPA,我们可以使用传统的Web应用程序,每个请求每个加载页面.我只是看到一个好处,就像我们可以很容易地在移动设备上运行它并适应新的Web应用程序开发趋势.有人可以更清楚地解释一下吗？

还有一件事,如果我们使用很多第三方组件来组成一个SPA.那么它是否为这个Web应用程序提供了一致性？我认为它应该是一个复杂的维护我们的Web应用程序内的巨大组件.你觉得怎么样？

欢迎所有建议.

Answer 1

我认为,考虑到当前用户使用的设备数量以及每种设备的能力和局限性,这是大多数网站应该采用的方向.

重要:

在阅读其余内容之前,请理解这个概念是建立在网络设计基本原则的基础之上的.为了为所有设备和情况设计单页面应用程序,它不能仅作为单页面应用程序运行.您必须构建一个基础,该基础适用于功能非常有限的最基本的浏览器,并根据其设备的功能增强用户体验.

这可能会为您带来更多的工作,但您将能够满足更大,更多样化的受众群体,这比投入专为现代桌面或手机浏览器专门构建的网络应用程序更令人印象深刻.

减少加载时间和/或重量

单页应用程序更能够减少页面的加载时间和从服务器到客户端的数据传输量.

此方法的一些影响最大的功能包括:

• 第一次加载后存储任何全局功能,
• 允许更容易的页面之间的数据传输和更复杂的用户界面
• 当您只需要特定组件时,在回发后删除加载整页的成本

过度复杂的可能性增加

该设计方法可以允许开发者中的懒惰和来自最终用户的更多干扰.作为开发人员,请确保您的UI完成它的工作(获取,显示并提交给服务器)并确保服务器完成它的工作(提供,验证并提交给数据库).大多数最终用户不会尝试使用javascript文件中的信息来破坏您的系统,但是包含有关您的数据结构的信息在我看来是在麻烦.

从强大的架构开始!

与任何网页一样,数据处理可以直接移动到服务处理程序而不是页面,这可能会导致使用以下层的体系结构:

• 数据库(数据存储)
• BL(数据处理和传输)
• 用户界面(数据显示和用户交互)

页面处理服务

在我看来,使用服务几乎是网站中有组织和调制代码的要求.向后兼容网站中使用的标准get和post方法也可以使用这些服务来命中代表业务对象而不是页面的服务.这允许您的代码在涉及相同对象的模块之间更加通用化.

对单个页面应用程序的更新变得简单,因为您可以初始化任何UI以获取get或post方法并使用AJAX方法执行它们,而不是导致事件的回发,因此是单个页面实例.

使用这些服务来处理UI事件的一个副作用是,除了生命周期事件之外,您不需要在代码隐藏文件中进行事件处理.生命周期事件对于处理和修改基于情况显示的相关数据以及修改返回的html以减轻用户设备上的负载非常有用.

延期加载!

任何复杂的网站都将提供复杂的模块和大量独特的组件.

使用单页应用程序可以获得的好处是,您可以选择将加载时间设置为ajax进程,并且无论何时您希望应用程序的任何部分(即首次尝试使用模块,初始化后的死区时间)都可以页面加载等),使初始加载更快,处理时间更受控制.

我的最佳实践列表

至于最佳实践..对于打算使用此方法的设计,可以并且应该进行相当多的优化,例如:

• 存储信息,当不再相关时删除
• 仅在需要时通过ajax加载脚本,html和js文件
• 使用在另一个页面上加载的数据,如果它可以代替为每个新"页面"重新加载
• UI的极简主义数据结构,因为它是一种显示而非处理的手段.
• 不要在UI上进行验证,因为您的服务应该已经构建,以验证提交给它的任何信息

这些优化有助于加载时间,数据处理和对象关联.显然这不是一个完整的列表,但它是构建单页应用程序的一个很好的开端.

最后,我建议研究一个网站的设计概念,以帮助建立一个坚实的基础.之后,其余的是相对简单的增强功能.(提示:其中一个增强功能是捕获导致回发的所有操作,并使用该信息来构建异步调用).

有关于此的各种信息,以及各种各样的库,但我建议尽可能使用您自己的代码来获取基本功能,并进入库代码,解决您的问题并进行一些研究,而不是尝试使用通用库代码实现复杂系统.使用他们的代码作为示例可能会导致更小的开销和更强大的代码,以满足您的特定情况.

祝好运!