Vue组件化
概念
Vue的一个核心思想就是组件化，什么是组件化？组件化就是把页面拆分成多个组件，每个组件依赖的CSS、JavaScript、模版、图片等资源放在一起开发和维护。组件是资源独立的，组件在系统内部可复用，组件和组件之间可以互相嵌套，并且会对外暴露接口方便别的组件调用。
组件可以是一个模块也可以是一个功能，比如导航、下拉菜单、时间控件等等都可以。
组件化的特性
- 高内聚性：组件功能必须是完整的，最好是单一的，一个组件只负责一个功能。
- 低耦合度：通俗来说，代码独立不会和页面中的其他代码发生冲突。如果用以前的框架去编写代码，比如一个页面只有一个html文件，所有CSS、JS、HTML代码都写在这个文件上，那么这个文件会非常大，经常上千行，很不利于开发和维护，如果去掉某个功能，牵扯的代码很多，很容易出现问题，现在一个页面分为很多个组件，组件之间互相独立，就会避免这种问题。
组件化的优点
- 方便重复使用
- 提高了开发效率
- 简化调试步骤
- 提升整个项目的可维护性
- 便于协同开发
组件化解决的问题
组件化开发是为了解决复杂业务逻辑的开发思想，解决多人多团队协作难，组件化思想可以帮助我们去尽可能做到：谁开发，谁负责；谁管理，谁维护；职责清晰，沟通简单方便。
单页面应用(SPA)
单页面应用是指只有一个浏览器页面的应用，在浏览器中运行期间不会重新加载页面，之后所有的交互操作都在一个页面上完成，这些都是通过切换vue-router匹配不同的vue组件来显示不同的页面内容。
多页面应用(MPA)：是指一个应用中有多个页面，页面跳转时是整页刷新。
单页面应用的好处
- 用户体验好，快，内容的改变不需要重新加载整个页面，基于这一点SPA对服务器压力较小。从性能和用户体验的层面来比较的话，后端路由每次访问一个新页面的时候都要向服务器发送请求，然后服务器再响应请求，这个过程肯定会有延迟。而前端路由在访问一个新页面的时候仅仅是变换了一下路径而已，没有了网络延迟，对于用户体验来说会有相当大的提升。
- 单页面应用没有页面之间的切换，就不会出现"白屏现象"，也不会出现假死并有"闪烁"现象。
- 良好的前后端分离。后端不再负责模版渲染、输出页面工作，只需要出数据就可以，后端API通用化，即同一套后端程序代码，不用修改就可以用于web界面、手机、平板等客户端。
单页面应用的缺点
- 首次加载耗时比较多：为实现单页Web应用功能及显示效果，需要在加载页面的时候将JavaScript、CSS统一加载，部分页面可以在需要的时候加载。所以必须对JavaScript及CSS代码进行合并压缩处理，如果使用第三方库，建议使用一些大公司的CDN，因此带宽的消耗是必然的。
- SEO难度较高：由于所有的内容都在一个页面中动态替换显示，所以搜索引擎只能捕获到后端返回的数据，无法捕获到整个HTML的数据。
单页应用实现原理
单页应用是指在浏览器中运行的应用，在使用期间页面不会重新加载。当点击导航时，通过哈希监听事件，如果哈希发生了变化，则改变哈希值：window.location.hash，来调用相应的js文件。
相应的js文件里面可以放相应的数据模板，当用ajax请求并返回数据时，渲染模板，生成相应的DOM结构，再插入对应的page 的div中。
基本原理:以 hash 形式（也可以使用 History API 来处理）为例，当 url 的 hash 发生改变时，触发 hashchange 注册的回调，回调中去进行不同的操作，进行不同的内容的展示。
为什么单页面应用和vue-router有关系，是因为单页面应用不会重新加载页面，只是通过改变hash来匹配显示不同的组件。所以单页面应用是基于vue-router和组件来实现的。
首先vue是单页面应用，导致了切换成其他页面不会改变url，这时候发现改变hash路由不会触发url让页面重新渲染，所以就用hash来做vue路由，这也是vue路由的由来。vue路由就是用来匹配对应的组件。