SPA单页应用的优缺点
Single Page Web Application
是一种特殊的Web
应用,其所有的活动局限于一个Web
页面中,仅在该Web
页面初始化时加载相应的HTML
、JavaScript
、CSS
文件,一旦页面加载完成,SPA
不会进行页面的重新加载或跳转,而是利用JavaScript
动态的变换HTML
,默认Hash
模式是采用锚点实现路由以及元素组件的显示与隐藏实现交互,简单来说SPA
应用只有一个页面,通常多页面应用会有多个页面不断跳转,而单页面应用始终在一个页面中,,默认Hash
模式是通过锚点实现路由以及控制组件的显示与隐藏来实现类似于页面跳转的交互。
优点
- 良好的交互体验,页面首次加载完成后内容的改变不需要重新加载整个页面,具有更快的响应速度,具有桌面应用的即时性、网站的可移植性和可访问性。
- 良好的前后端工作分离模式,单页应用可以和
RESTful
架构一起使用,通过RESTAPI
提供接口数据,有助于分离客户端和服务器端工作与API
通用化。 - 减轻服务端压力,服务端不需要处理页面模板的逻辑与拼接,除首次加载页面外只需要提供数据信息即可,把计算尽量放在客户端,单页应用能提高单位服务器的负载量。
- 可维护性高,通常采用组件化与模块化开发,代码复用程度高,相对来说可维护性高。
缺点
- 不利于
SEO
,由于是采用前端渲染的方式,搜索引擎不会去解析Js
从而只能够抓取首页未渲染的模板,如果需要单页面应用有更好的SEO
,那么通常需要使用SSR
服务端渲染,搜索引擎爬虫抓取工具可以直接查看完全渲染的页面,但是由于是服务端进行渲染,那么会对服务器造成一定压力,SSR
服务端渲染属CPU
密集型,当然如果只是需要SEO
少数几个页面,可以采用预渲染的方式。 - 首次加载速度慢,
SPA
单页应用通常首次加载页面时就会将相应的HTML
、JavaScript
、CSS
文件全部加载,通常可以通过采取缓存措施以及懒加载即按需加载组件的方式来优化。
每日一题
代码语言:javascript复制https://github.com/WindrunnerMax/EveryDay
参考
代码语言:javascript复制https://www.jianshu.com/p/9258583ef4ab
https://juejin.im/post/6844903512107663368
https://blog.csdn.net/huangpb123/article/details/86183453