《单页Web应用:JavaScript从前端到后端》——1.4 小结

简介:

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

1.4 小结

单页应用已经出现了有一段时间。直到不久前,Flash和Java都是客户端平台上使用最为广泛的单页应用,因为它们的功能、速度和一致性,都超过了那些使用JavaScript和浏览器来渲染的应用。但是最近,JavaScript和浏览器渲染到达了一个引爆点,它们克服了最为麻烦的缺陷,比其他客户端平台具有显著的优势。

我们关注的是使用原生的JavaScript和浏览器渲染来创建单页应用,除非另有说明,当提及单页应用时,我们指的是原生的JavaScript单页应用。我们的单页应用所使用的工具包括jQuery、TaffyDB2、Node.js、Socket.IO和MongoDB。所有这些工具都是久经考验的流行解决方案。你可以选择采用这些技术的替代者,但是不管特定的技术决策是什么,单页应用的基本结构是不会变的。

我们开发的简单聊天滑块应用,演示了JavaScript单页应用的很多特征。对用户输入的即时响应,使用客户端存储的数据(而不是服务端的数据)进行决策判断。使用了JSLint来确保应用不包含常见的JavaScript错误。还有使用jQuery来选取DOM,为DOM添加动画效果,当用户点击滑块的时候会进行事件处理。我们研究了Chrome开发者工具来帮助我们理解应用是如何工作的。

单页应用可以做到一举两得,桌面应用的即时性,网站的可移植性和可访问性。在超过数十亿计的支持现代Web浏览器的设备上,都能见到JavaScript单页应用,并且不需要专有的插件。只要稍许多做点工作,它就可以支持运行很多种不同操作系统的台式机、平板电脑和智能手机。单页应用的更新和发布很简单,通常不需要用户进行任何操作。所有这些好处说明了为什么你可以把你的下个应用做成单页应用。

在下一章,我们将会探讨一些关键的但是经常会被忽略或者被误解的JavaScript概念,这对单页应用开发是需要的。然后在本章开发的示例基础上,改进和扩展这个单页应用。

相关文章
|
20小时前
|
缓存 监控 前端开发
探索现代Web应用的性能优化实践
【5月更文挑战第10天】随着互联网技术的飞速发展,用户对Web应用的响应速度和流畅度要求越来越高。性能优化已成为前端开发中不可或缺的一环。本文将深入探讨Web应用性能优化的关键策略,包括代码分割、资源压缩、缓存利用、服务端渲染等技术手段,以及如何通过工具进行性能监测和分析。我们将从原理出发,结合实际案例,帮助开发者构建更快速、更高效的Web应用。
|
2天前
|
开发框架 JavaScript 中间件
中间件应用Koa.js(Node.js)
我们添加了两个中间件。第一个中间件记录请求的开始时间,并在下一个中间件执行完毕后计算并打印出请求的总时间。第二个中间件与之前的示例相同,它设置响应体为 "Hello World"
17 6
|
2天前
|
JavaScript 中间件 API
中间件应用Express.js(Node.js)
我们定义了一个名为 `logger` 的中间件函数。它接受请求对象、响应对象以及下一个中间件函数作为参数。当接收到请求时,它会打印出请求的 HTTP 方法和 URL,然后调用 `next()` 函数来将控制权传递给下一个中间件或路由处理器。我们使用 `app.use()` 方法将 `logger` 中间件添加到了应用级别的中间件堆栈中,这意味着它将对所有请求生效。
10 3
|
3天前
|
JSON 前端开发 JavaScript
快照测试在前端自动化测试中的应用
在前端自动化测试中,快照测试常用于检验组件渲染与布局。
|
4天前
|
数据采集 JavaScript 数据可视化
Node.js爬虫在租房信息监测与分析中的应用
Node.js爬虫在租房信息监测与分析中的应用
|
8天前
|
JavaScript 前端开发 UED
【Web 前端】如何将一个 HTML 元素添加到 DOM 树中的?
【5月更文挑战第2天】【Web 前端】如何将一个 HTML 元素添加到 DOM 树中的?
|
8天前
|
JavaScript 前端开发 索引
【Web 前端】jQuery 里的 each() 是什么函数?你是如何使用它的?
【5月更文挑战第2天】【Web 前端】jQuery 里的 each() 是什么函数?你是如何使用它的?
|
8天前
|
存储 前端开发 JavaScript
【Web 前端】如何找到所有 HTML select 标签的选中项?
【5月更文挑战第2天】【Web 前端】如何找到所有 HTML select 标签的选中项?
|
8天前
|
JavaScript 前端开发 C++
【Web 前端】JavaScript window.onload 事件和 jQuery ready 函数有何不同?
【5月更文挑战第2天】【Web 前端】JavaScript window.onload 事件和 jQuery ready 函数有何不同?
|
8天前
|
前端开发 JavaScript
【Web 前端】$(document).ready() 是个什么函数?为什么要用它?
【5月更文挑战第2天】【Web 前端】$(document).ready() 是个什么函数?为什么要用它?