• 前端单页应用与多页应用的区别


    1.传统网页应用与单页应用区别

    传统网页:

     单页应用:

     2.  具体区别

    定义:

    SPA单页面应用:指只有一个主页面的应用,一开始只需要加载一次css、js等相关资源,所有内容都包含在主页面,对每一个功能模块组件化。单页面应用跳转,就是切换相关组件,仅仅只是刷新局部资源。

    MPA多页面应用:指有多个独立页面的应用,每个页面都必须重复加载js、css等相关资源。多页面应用跳转,需要整页资源刷新。

    区别:

     1.  刷新方式

    SPA:相关组件的切换,业界局部刷新或更改。

    MPA:整页刷新

    2.路由模式

    SPA:可以使用has,也可以使用history

    MPA:整页刷新

    3.用户体验

    SPA:用户体验良好,切换页面只是局部组件刷新。因为一次性加载所有资源,所以说首次进入的时候可能会有一段时间白屏。

    MPA:页面切换加载缓慢,流畅度不够,用户体验差一点。

    4.转场动画

    SPA:容易实现转场动画,比如界面切换之类加一些骨架屏和loading之类的。

    MPA:无法实现转场动画,每次切换都是白屏。

    5.数据传递问题

    SPA:容易传递数据,方法有很多,比如Vuex

    MPA:传递数据不方便,一般用url、cookie、本地存储

    6.搜索引擎优化(SEO)

    SPA:需要单独方案,实现比较困难

    MPA:实现方法容易

    7.使用范围

    SPA:高要求的体验度,追求页面的流畅

    MPA:适用于追求高度支持搜索引擎的应用

    8.开发成本和维护成本

    SPA:开发成本高,因为要借助框架,维护成本低一些

    MPA:开发成本低,用原生的js和htm写,代码较多,维护成本高一些

  • 相关阅读:
    小程序自定义组件(3)子向父传参
    postgresql插件安装
    二进制减法的实现
    mysql锁表问题
    mysql查看修改参数
    众数问题-找出超过一半的数
    只出现一次的数
    元素最大间距离
    第一个缺失数字
    局部最小值位置
  • 原文地址:https://www.cnblogs.com/cjr001/p/16409289.html
Copyright © 2020-2023  润新知