SPA
SPA
单页 Web 应用(single page web application, SPA),就是只有一张 Web 页面页面的应用,是加载单个 HTML 页面并在用户与应用程序交互时动态更新改页面的 Web 应用程序。
特点:
MVVM:经典 MVVM 开发模式,前后端各负其责。
AJAX:重前端,业务逻辑全部在本地操作,数据都需要通过AJAX同步、提交。
路由:在URL中采用 # 号来作为当前视图地址,改变 # 号后的参数,页面不会重载。
良好的交互体验:用户不需要重新刷新页面,获取数据也是通过Ajax异步获取,页面显示流畅,让用户在 web app 感受 native app 的速度和流畅。
良好的前后端工作分离模式:单页 Web 应用可以和 RESTful 规约一起使用,通过 REST API 提供接口数据,并使用 Ajax 异步获取,这样有助于分离客户端和服务端工作。更进一步,客户端可以分解为静态页面和页面交互两个部分。
减轻服务器压力:服务器只用出数据就可以,不用管展示逻辑和页面合成,吞吐能力会提高几倍。
共用一套后端程序代码:不用修改后端程序代码可以同时用于 Web 界面、手机、平板等多种客户端。
缺点:
SEO 难度较高:爬虫只能拿到一个 div,认为页面是空的,不利于SEO。由于所有内容都在一个页面中动态替换显示,所以 SEO 上其有着天然弱势,所以如果站点对SEO很重要,且要用单页应用,那么就做些静态页面给搜索引擎用吧。
前进、后退管理:由于单页 Web 应用在一个页面中显示所有的内容,所以不能使用浏览器的前进后退功能,所有页面切换需要自己建立堆栈管理,当然此问题也有解决方案,比如利用 URI 中散列 + iframe 实现。
初次加载耗时多:首屏渲染等待时长,必须得加载完毕,才能渲染出首屏。为实现单页 Web 应用功能及显示效果,需要在加载页面的时候将 JavaScript、CSS 统一加载,部分页面可以在需要的时候加载。所以必须对 JavaScript 、CSS 代码进行合并压缩处理,如果使用第三方库,建议使用一些大公司的CDN,因此宽带消耗是必须的。
开发流程:
用循环视角审视 Web 应用开发。
框定一个一致的 SPA 图形用户界面(GUI)和模型。
将 SPA 原则带回服务器端。
聚集于对合适应用进行早期 SPA 开发。
内容记录来自:https://www.jianshu.com/p/dcea4d914b65(感谢)