【.com速译】不知道大家有没有注意到,单页应用(Single-pageapplications,SPA)和渐进式网络应用(Progressivewebapps,PWA)正在彻底改变企业Web服务的方式交付方式。虽然这两种新技术看起来非常相似,而且人们经常互换使用,但实际上它们有着根本的不同。让我们深入了解它们的主要功能以及它们在服务交付方面的差异。什么是单页应用程序?顾名思义,SPA在单个页面内动态加载网站内容。本质上,用户与页面交互的每个内容和元素都将在同一页面上完成。这意味着您在浏览此类网站时无需加载任何单独的文档对象模型(DOM)。这种方法的主要目的是通过加载他们需要使用和查看的所有内容,使用户保持在同一页面上以获得更好的体验。由此带来的好处是SPA可以避免在服务端渲染各种页面时出现的中断问题。它在某种程度上解决了一个长期困扰Web开发社区的问题:如何为用户提供无缝的访问体验。当您在SPA上使用页面导航服务时,您可能会错误地认为您正在访问不同的DOM。相反,您正在浏览由单个DOM预加载的内容。将SPA分解为单独的内容部分通常涉及使用JavaScript视图,为每个部分提供一个URL。同时,数据链接连接器负责将各个部分链接到主DOM并允许您异步访问它们。尽管Mint和elm-spa等技术兴起,但JavaScript仍然是制作SPA最常用的编程语言。JavaScript使用async/await函数允许用户异步加载动态和静态内容,而不会阻塞对一个输入的另一个请求的输出。也就是说,SPA可以在非阻塞输入输出(I/O)系统上平稳运行。目前,ReactJS、Vue.js、AngularJS、Ember.js、Backbone.js等JavaScript框架都可以支持SPA的快速开发。为了入门方便,大家可以先从链接——https://www.makeuseof.com/vue-js-beginners-overview/了解一下Vue.js的基本概念。如今,Netflix、YouTube、PayPal、Facebook、Instagram、Twitter、Pinterest等明星公司从交付速度的角度出发,相继将网站服务转为单页应用。什么是渐进式Web应用程序?PWA由谷歌于2015年推出。其目标是通过构建以直接和增量方式与用户交互的应用程序,在网络连接不良或中断的情况下保持用户体验。作为另一种Web应用程序或软件,PWA在其功能中使用各种标准的、新兴的Web浏览器指南。不同于典型的SPA初始内容加载,PWA架构主要采用一些准则来实现可扩展性、用户适应性、超快速交付、可安装性和原生性。总的来说,用户可以流畅、持续地与应用程序交互。作为PWA的核心特性之一,可安装性确保用户无需额外安装即可通过Web浏览器即时访问服务资源。当然,与任何其他网站一样,PWA需要分配一个URL。ProgressiveWebApps的独特之处在于它们提供了即时交付内容的后台助手。相应地,您不仅可以快速可靠地获取Web应用程序页面,还可以随时交互和使用其内容和组件。目前以Spotify、Slack、Uber为首的明星公司都在使用PWA开发的应用。PWA通常有一套通用的架构规则,并包含以下属性来保证应用程序的正常运行:1.ServiceWorkerServiceWorker可以通过干预页面导航和用户请求,轻松地传递PWA中的各种内容。由于缓存API可以存储对用户离线请求的各种响应,因此即使在没有网络连接的情况下,它们也能确保应用程序可以加载相关的缓存数据。通过使用promise对象,ServiceWorker可以根据用户的最终请求(即使处于离线状态)交付下载的内容。也就是说,ServiceWorker让PWA成为非阻塞的。2.安全上下文ServiceWorker需要一个安全的连接通道(比如HTTPS)来保证传递内容的机密性。当你发送一个请求时,ServiceWorker会在PWA和浏览器之间建立一个安全的通信作为安全上下文(SecureContext)来防止PWA被中间人(MITM)攻击而导致泄漏.3.Web应用程序的清单文件作为一个JSON文件,Web清单可以通过定义PWA的基本特征来详细指定访问、发现和使用PWA内容的先决条件。该文件通常包括应用程序的名称、其URL及其组件。此外,清单文件还将包含将Web应用程序转换为可安装应用程序所需的信息。PWA和SPA有什么相似之处?PWA和SPA虽然后台逻辑不同,但还是有一些共同点的。毕竟,它们都是为了通过提供响应式界面来提高用户访问速度和网站服务的体验。就普通用户而言,他们无法从纯粹的界面和交互方式上区分这两类技术网站。两者都需要向用户提供可访问的URL。SPA和PWA的主要区别PWA和SPA在功能上的区别主要体现在以下几个方面:单页应用的主要特点它们只能通过浏览器访问。虽然不推荐,但用户仍然可以通过不安全的网络连接(例如HTTP)访问服务。原则上不需要服务支持人员。由于SPA不附带JSON清单文件,因此它们是可卸载的。顾名思义,它们仅限于单个页面。一旦网络丢失,他们将无法访问。渐进式Web应用程序的主要功能由于它们是可安装的,因此用户可以通过浏览器访问它们。所有PWA都需要ServiceWorker,并且它们必须通过安全的网络连接(例如HTTPS)传输请求。它的响应将被缓存并通过promise对象传递。即使没有互联网连接也可以访问它们。它们总体上比SPA更快。通过清单文件,它们可以下载、安装并且易于访问。PWA可能不会只有一页。如何根据交付需求选择SPA和PWA一般来说,采用PWA不仅可以提升普通用户浏览网站的体验,还可以降低企业级应用的跳转频率,从而为企业增加收益。另一方面,SPA让新媒体应用焕然一新。人们不仅可以通过网络轻松地相互交流,而且不会遇到页面加载缓慢等各种困境。因此,您和您的团队需要根据实际交付需求,为要构建的应用程序选择合适的技术。原标题:WhatAreSingle-PageApplicationsandProgressiveWebApps?,作者:IDOWUOMISOLA
