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

简介: 所有这些好处意味着,你可能会想把下个应用做成单页应用。每次点击后都会重新渲染整张页面的笨拙网站,容易日益疏远富有经验的用户。精心编写的单页应用具有互动和快速响应的界面,还伴有访问网络的功能,这将帮助我们把客户留在属于他们的地方:使用我们的产品。

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

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

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

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

所有这些好处意味着,你可能会想把下个应用做成单页应用。每次点击后都会重新渲染整张页面的笨拙网站,容易日益疏远富有经验的用户。精心编写的单页应用具有互动和快速响应的界面,还伴有访问网络的功能,这将帮助我们把客户留在属于他们的地方:使用我们的产品。

相关文章
|
5月前
|
并行计算 前端开发 JavaScript
Web Worker:让前端飞起来的隐形引擎
在现代 Web 开发中,前端性能优化是一个至关重要的课题,尤其是对于计算密集型的应用,如图像处理、视频处理、大规模数据分析等任务。单线程的 JavaScript 引擎常常成为性能瓶颈,导致应用变得迟缓。Web Worker,作为一种强大的技术,使得前端能够在后台进行并行计算,从而实现高效的任务处理,不影响主线程的运行和用户的交互体验。
528 108
|
5月前
|
JavaScript 前端开发 Java
前端框架选择之争:jQuery与Vue在现代Web开发中的真实地位-优雅草卓伊凡
前端框架选择之争:jQuery与Vue在现代Web开发中的真实地位-优雅草卓伊凡
632 72
前端框架选择之争:jQuery与Vue在现代Web开发中的真实地位-优雅草卓伊凡
|
8月前
|
JavaScript 前端开发 Java
制造业ERP源码,工厂ERP管理系统,前端框架:Vue,后端框架:SpringBoot
这是一套基于SpringBoot+Vue技术栈开发的ERP企业管理系统,采用Java语言与vscode工具。系统涵盖采购/销售、出入库、生产、品质管理等功能,整合客户与供应商数据,支持在线协同和业务全流程管控。同时提供主数据管理、权限控制、工作流审批、报表自定义及打印、在线报表开发和自定义表单功能,助力企业实现高效自动化管理,并通过UniAPP实现移动端支持,满足多场景应用需求。
841 1
|
4月前
|
存储 前端开发 安全
实现“永久登录”:针对蜻蜓Q系统的用户体验优化方案(前端uni-app+后端Laravel详解)-优雅草卓伊凡
实现“永久登录”:针对蜻蜓Q系统的用户体验优化方案(前端uni-app+后端Laravel详解)-优雅草卓伊凡
253 5
|
4月前
|
前端开发 JavaScript 应用服务中间件
在Docker部署的前端应用中使用动态环境变量
以上步骤展示了如何在 Docker 配置过程中处理并注入环墨遁形成可执行操作流程,并确保最终用户能够无缝地与之交互而无须关心背后复杂性。
258 13
|
10月前
|
JSON 自然语言处理 前端开发
【01】对APP进行语言包功能开发-APP自动识别地区ip后分配对应的语言功能复杂吗?-成熟app项目语言包功能定制开发-前端以uniapp-基于vue.js后端以laravel基于php为例项目实战-优雅草卓伊凡
【01】对APP进行语言包功能开发-APP自动识别地区ip后分配对应的语言功能复杂吗?-成熟app项目语言包功能定制开发-前端以uniapp-基于vue.js后端以laravel基于php为例项目实战-优雅草卓伊凡
576 72
【01】对APP进行语言包功能开发-APP自动识别地区ip后分配对应的语言功能复杂吗?-成熟app项目语言包功能定制开发-前端以uniapp-基于vue.js后端以laravel基于php为例项目实战-优雅草卓伊凡
|
9月前
|
前端开发 Java 物联网
智慧班牌源码,采用Java + Spring Boot后端框架,搭配Vue2前端技术,支持SaaS云部署
智慧班牌系统是一款基于信息化与物联网技术的校园管理工具,集成电子屏显示、人脸识别及数据交互功能,实现班级信息展示、智能考勤与家校互通。系统采用Java + Spring Boot后端框架,搭配Vue2前端技术,支持SaaS云部署与私有化定制。核心功能涵盖信息发布、考勤管理、教务处理及数据分析,助力校园文化建设与教学优化。其综合性和可扩展性有效打破数据孤岛,提升交互体验并降低管理成本,适用于日常教学、考试管理和应急场景,为智慧校园建设提供全面解决方案。
582 70
|
9月前
|
JavaScript 前端开发 API
|
8月前
|
存储 消息中间件 前端开发
PHP后端与uni-app前端协同的校园圈子系统:校园社交场景的跨端开发实践
校园圈子系统校园论坛小程序采用uni-app前端框架,支持多端运行,结合PHP后端(如ThinkPHP/Laravel),实现用户认证、社交关系管理、动态发布与实时聊天功能。前端通过组件化开发和uni.request与后端交互,后端提供RESTful API处理业务逻辑并存储数据于MySQL。同时引入Redis缓存热点数据,RabbitMQ处理异步任务,优化系统性能。核心功能包括JWT身份验证、好友系统、WebSocket实时聊天及活动管理,确保高效稳定的用户体验。
512 4
PHP后端与uni-app前端协同的校园圈子系统:校园社交场景的跨端开发实践
|
7月前
|
移动开发 前端开发 JavaScript
前端web创建命令
本项目使用 Vite 搭建 Vue + TypeScript 开发环境,并基于 HTML5 Boilerplate 提供基础模板,快速启动现代前端开发。
105 2