PWA(渐进式网页应用) + SPA(但也应用)的一个简单的思考

PWA(渐进式网页应用) + SPA(但也应用)的一个简单的思考

前言

以前听到的并不是PWA(渐进式网页应用)这么专业的形容词。那个时候其实已经了解到google再做一个东西,之前市这么形容的:不需要操作系统,软件直接在硬件上跑。Surprised,一脸蒙蔽中…

现在也做前端这么久 了,后端也开始涉及的时候。其实很多东西都在一个系列里面,相互支持和依赖。某一天突然看到了PWA这东西,才发现他已经被应用了,还发现有人提供了解决方案。

什么是PWA

PWA (Progressive Web Apps) 是一种 Web App 新模型,并不是具体指某一种前沿的技术或者某一个单一的知识点,我们从英文缩写来看就能看出来,这是一个渐进式的 Web App,是通过一系列新的 Web 特性,配合优秀的 UI 交互设计,逐步的增强 Web App 的用户体验。

什么是SPA

单页 Web 应用 (single-page application 简称为 SPA) 是一种特殊的 Web 应用。它将所有的活动局限于一个Web页面中,仅在该Web页面初始化时加载相应的HTML、JavaScript 和 CSS。一旦页面加载完成了,SPA不会因为用户的操作而进行页面的重新加载或跳转。而是利用 JavaScript 动态的变换HTML的内(采用的是div切换显示和隐藏),从而实现UI与用户的交互。由于避免了页面的重新加载,SPA 可以提供较为流畅的用户体验。得益于ajax,我们可以实现无跳转刷新,又多亏了浏览器的histroy机制,我们用hash的变化从而可以实现推动界面变化。

PWA + SPA有何优势

  • https 环境部署。
  • 响应式设计,一次部署,可以在移动设备和 PC 设备上运行。
  • 在不同浏览器下可正常访问。
  • 浏览器离线和弱网环境可极速访问。
  • 可以把 App Icon 入口添加到桌面。
  • 点击 Icon 入口有类似 Native App 的动画效果。
  • 灵活的热更新

模板时代

我为什么称之为模板时代呢?是因为那个时代的的前端被称之为切图崽,后端生成html模板,返回到客户端,在渲染成html网页,啊,慢的一匹。

前后分离的造神时代

传统的MCV形式:前端写html,后端套界面,转成jsp或许像freemarker,velocity,beetl(国产值得保举)这种模板引擎。安排在一起或许动动态分离安排。 前后端分离的开辟形式:前端写html5,js,css3+前端MVC形式(backbone或许angular框架都不错)+后端restful数据接口。
前后端分离的例子便是SPA(Single-page application),一切用到的展示数据都是后端经由过程异步接口(AJAX/JSONP)的方法供给的,前端尽管展示。

总结

PWA + SPA肯定会创造一个新的web时代,我也非常的期待。他们的结合,高开发效率,低成本,降低维护难度,提高了生命周期等等优点…,估计将是新一个造神的时代来临

Lavas 他是一个解决方案,居然不是一个框架

Lavas解决方案https://lavas.baidu.com/guide/v1/foundation/lavas-start

猜你喜欢

转载自blog.csdn.net/weixin_40415614/article/details/79699358