《单页Web应用:JavaScript从前端到后端》——1.3 精心编写的单页应用的用户效益

简介:

本节书摘来自异步社区《单页Web应用:JavaScript从前端到后端》一书中的第1章,第1.3节,作者:【美】Michael S. Mikowski , Josh C. Powell 译者: 包勇明 更多章节内容可以访问云栖社区“异步社区”公众号查看。

1.3 精心编写的单页应用的用户效益

单页Web应用:JavaScript从前端到后端
现在已经构建了第一个单页应用,相对于传统网站,我们认为单页应用的主要好处是:它提供了更加吸引人的用户体验。单页应用可以做到一举两得:桌面应用的即时性以及网站的可移植性和可访问性。

单页应用可以和桌面应用一样渲染——单页应用只需重绘界面上需要变化的部分。相比之下,传统网站的许多用户操作都会重绘整张页面,结果是当浏览器从服务器获取数据的时候,页面会假死并有“闪烁”现象,然后再重绘页面上的所有东西。如果页面很大,服务器又繁忙,或者网络连接很慢,这种“闪烁”现象会持续好几秒钟甚至是更长时间,用户只得猜测页面什么时候才可以再次使用。与单页应用的快速渲染和即时反馈相比,这是一种很恐怖的体验。
单页应用可以拥有和桌面应用一样的响应速度——尽可能地把(临时的)工作数据和处理过程从服务端转移到浏览器端,单页应用由此把响应时间缩减至最小。单页应用在本地拥有大多数需要决策判断的数据和业务逻辑,因此是很快的。只有数据验证、授权和持久存储必须要放在服务端,原因我们会在第6章到第8章中进行讨论。传统网站的大多数应用逻辑在服务端,对大部分的用户输入的响应,他们必须等待一个“请求/响应/重绘”的循环周期。与接近即时响应的单页应用相比,这需要花费几秒钟的时间。
单页应用可以和桌面应用一样,把它的状态通知给用户——当单页应用确实必须等待服务器的响应时,可以动态地显示进度条或者繁忙指示器,因此用户不会因延时而困惑。相比传统的网站,用户实际上只能猜测页面何时加载完并可用。
单页应用像网络一样,几乎随处可以访问——不像大多数的桌面应用,用户可以通过任何网络连接和适当的浏览器来访问单页应用。如今,这一名单包括智能手机、平板电脑、电视、笔记本电脑和台式计算机。
单页应用可以像网站一样即时地更新和发布——用户不需要做任何事就能明白它的好处:他们只要重新加载浏览器就行了。维护软件的多个并存版本的麻烦在很大程度上消除了1。开发单页应用的作者,在一天之内就能构建和更新很多次。桌面应用经常需要下载并且安装新版本需要管理访问权限,版本之间的间隔可能是很多个月或者很多年。
单页应用和网站一样,是跨平台的——和大多数的桌面应用不一样,精心编写的单页应用可以在提供现代HTML5浏览器的任意操作系统上运行。尽管这通常被认为是对开发人员的好处,但对很多同时使用多种设备的用户来说是非常有用的,比如工作时用Windows,在家用Mac,Linux服务器,Android手机和Amazon平板电脑。
所有这些好处意味着,你可能会想把下个应用做成单页应用。每次点击后都会重新渲染整张页面的笨拙网站,容易日益疏远富有经验的用户。精心编写的单页应用具有互动和快速响应的界面,还伴有访问网络的功能,这将帮助我们把客户留在属于他们的地方:使用我们的产品。

相关文章
|
3天前
|
前端开发 JavaScript 开发者
前端开发中的异步编程:Promise 和 Async/Await 的比较与应用
在现代前端开发中,异步编程是不可或缺的技术。本文将深入探讨Promise和Async/Await这两种主流的异步编程方式,分析它们的优劣势及在实际项目中的应用场景。通过比较它们的语法、可读性和错误处理机制,帮助开发者更好地选择和理解如何在项目中高效地利用这些技术。
|
3天前
|
开发框架 前端开发 JavaScript
现代前端开发中的跨平台解决方案比较与应用
在现代软件开发中,跨平台解决方案成为了开发者们的热门话题。本文将探讨几种主流的跨平台开发框架及其特点,重点比较它们在前端开发中的应用场景和优劣势。通过对比分析,读者可以更好地理解如何选择适合自己项目需求的跨平台解决方案。
|
7天前
|
JSON 前端开发 Java
一文读Web开发 之接口后端接口、类与前端请求、拦截器编写
一文读Web开发 之接口后端接口、类与前端请求、拦截器编写
22 6
|
5天前
|
JSON JavaScript 中间件
Express.js:构建轻量级Node.js应用的基石
**Express.js 概览**:作为Node.js首选Web框架,Express以其轻量、灵活和强大的特性深受喜爱。自2009年以来,其简洁设计和丰富中间件支持引领开发者构建定制化应用。快速开始:使用`express-generator`创建项目,安装依赖,启动应用。示例展示如何添加返回JSON消息的GET路由。Express适用于RESTful API、实时应用等多种场景,社区支持广泛,助力高效开发。
8 1
|
9天前
|
缓存 前端开发 安全
探索现代Web开发中的前端架构模式
【6月更文挑战第23天】随着互联网技术的飞速发展,前端架构在Web开发中扮演着越来越重要的角色。本文将深入探讨现代Web开发中使用的几种主流前端架构模式,包括单页面应用(SPA)、微前端架构和JAMStack等,并分析它们的优势与应用场景。通过实例演示,我们将看到如何根据项目需求选择合适的前端架构,以及如何利用这些架构模式提升开发效率和应用性能。
|
1天前
|
XML 前端开发 JavaScript
前端概论 web
前端概论 web
8 0
|
2天前
|
JavaScript 前端开发 大数据
Vue.js 中的 `v-if` 和 `v-show`:理解与应用
Vue.js 中的 `v-if` 和 `v-show`:理解与应用
7 0
|
3天前
|
前端开发 JavaScript 开发者
现代前端开发中的Web组件化设计
随着Web应用程序复杂性的增加,现代前端开发越来越倾向于采用组件化设计。本文将探讨Web组件化的定义、优势以及实际应用中的最佳实践,帮助开发者更好地理解和应用这一技术。
|
5天前
|
前端开发 计算机视觉
视觉智能开放平台操作报错合集之人脸对比1:1,采用web前端直接调用,使用了base64处理图片,提示http错误码414,该如何处理
在使用视觉智能开放平台时,可能会遇到各种错误和问题。虽然具体的错误代码和消息会因平台而异,但以下是一些常见错误类型及其可能的原因和解决策略的概述,包括但不限于:1. 认证错误、2. 请求参数错误、3. 资源超限、4. 图像质量问题、5. 服务不可用、6. 模型不支持的场景、7. 网络连接问题,这有助于快速定位和解决问题。
|
6天前
|
前端开发 程序员 API
视觉智能开放平台产品使用合集之web前端拉起人脸识别该如何操作
视觉智能开放平台是指提供一系列基于视觉识别技术的API和服务的平台,这些服务通常包括图像识别、人脸识别、物体检测、文字识别、场景理解等。企业或开发者可以通过调用这些API,快速将视觉智能功能集成到自己的应用或服务中,而无需从零开始研发相关算法和技术。以下是一些常见的视觉智能开放平台产品及其应用场景的概览。