赞
踩
传统的MPA
首先,说一个比较古老的东西,叫做 MPA。
MPA 的全称是 Multi-page Application,意思是整个应用(站点)由多个完整的 html 构成。用户在页面 1 点击跳转,需要向服务端请求页面 2,请求成功后渲染。而用户返回时,相当于是点击了浏览器的返回,页面退回到之前的历史记录,并重新加载出来。
在这样的模式下,页面间切换慢、不流畅的问题比较突出,尤其是在移动端。
同时,它还产生了几个小问题:
跳转动画:页面间的跳转无法实现转场动画效果。
如果前一个页比较长,用户滑动到页面比较靠下方的位置后点击,返回时,页面无法默认停留在原位置。
iOS 右滑返回产生问题,从页面 1 跳转到页面 2,再从页面 2 跳转到页面 3,右滑返回,会直接回到页面 1 前的页。
SPA
随着对移动端体验需求的提高以及技术的进步,另一种模式 SPA(Single-page Application)逐渐成为主流。
SPA 简单来说,就是原来在 MPA 中的多个 html,现在被放在了一个 html 中,并被分成若干个片段。跳转、返回的本质变成了分段的「隐藏」与「显示」。跳转不需要反复对服务端进行请求,从而使得页面与页面之间切换更加快速流畅。
在这样的机制下,跳转与返回完全由代码控制,所以可以通过代码定义页面转场的效果、返回。
在设计转场动画时,我们需要留意的是导航栏是 Native 的还是 HTML5 的。如果导航栏是 N
Copyright © 2003-2013 www.wpsshop.cn 版权所有,并保留所有权利。