SPA

作者: 海之深处爱之港湾 | 来源:发表于2019-03-29 11:13 被阅读21次

    SPA

    单页Web应用(single page web application,SPA),就是只有一张Web页面的应用,是加载单个HTML 页面并在用户与应用程序交互时动态更新该页面的Web应用程序。

    SPA的特点:
    • 速度:更好的用户体验,让用户在web app感受native app的速度和流畅,
    • ·MVVM:经典MVVM开发模式,前后端各负其责。
    • ·ajax:重前端,业务逻辑全部在本地操作,数据都需要通过AJAX同步、提交。
    • ·路由:在URL中采用#号来作为当前视图的地址,改变#号后的参数,页面并不会重载
    SPA的两个缺点:
    1. 首屏渲染等待时长: 必须得加载完毕,才能渲染出首屏
    2. seo不友好:爬虫只能拿到一个div,认为页面是空的,不利于seo
    开发流程
    • 用循环的视角审视Web应用开发
    • 框定一个一致的SPA图形用户界面(GUI)和模型
    • 将SPA的原则带回服务器端
    • 聚集于对合适的应用进行早期SPA开发 [3]

    SPA的优缺点

    单页Web程序的出现是客户端发展的必然结果,但是该技术也是有些局限性,所以采用之前需要了解清楚它的优缺点。

    1、优点:

    1). 良好的交互体验
    用户不需要重新刷新页面,获取数据也是通过Ajax异步获取,页面显示流畅。
    2). 良好的前后端工作分离模式
    单页Web应用可以和RESTful规约一起使用,通过REST API提供接口数据,并使用Ajax异步获取,这样有助于分离客户端和服务器端工作。更进一步,可以在客户端也可以分解为静态页面和页面交互两个部分。
    3). 减轻服务器压力
    服务器只用出数据就可以,不用管展示逻辑和页面合成,吞吐能力会提高几倍;
    4). 共用一套后端程序代码
    不用修改后端程序代码就可以同时用于Web界面、手机、平板等多种客户端;

    2、缺点:

    1). SEO难度较高
    由于所有的内容都在一个页面中动态替换显示,所以在SEO上其有着天然的弱势,所以如果你的站点对SEO很看重,且要用单页应用,那么就做些静态页面给搜索引擎用吧。
    2). 前进、后退管理
    由于单页Web应用在一个页面中显示所有的内容,所以不能使用浏览器的前进后退功能,所有的页面切换需要自己建立堆栈管理,当然此问题也有解决方案,比如利用URI中的散列+iframe实现。
    3). 初次加载耗时多
    为实现单页Web应用功能及显示效果,需要在加载页面的时候将JavaScript、CSS统一加载,部分页面可以在需要的时候加载。所以必须对JavaScript及CSS代码进行合并压缩处理,如果使用第三方库,建议使用一些大公司的CDN,因此带宽的消耗是必然的。

    相关文章

      网友评论

        本文标题:SPA

        本文链接:https://www.haomeiwen.com/subject/anakbqtx.html