路由是什么?
路由(Router)是一种负责寻径的网络设备，它在互连网络中从多条路径中寻找通讯量最少的一条网络路径提供给用户通信。路由用于连接多个逻辑上分开的网络。对用户提供最佳的通信路径。
React路由是一个用于React web应用的声明式路由库。它可以让你通过配置路由、加载和修改数据、处理导航等功能，来创建动态和交互式的用户界面简单来说，前端路由是一套映射规则，在React中，是URL路径与组件的对应关系
React Router提供了一些高级功能，例如代码拆分，动画过渡，滚动恢复，递归路径和服务器端渲染。
代码拆分是指将大型捆绑的JavaScript文件分成更小的块，并仅在需要时使用。这样，您可以向用户发送较小的应用程序包，并仅在他们转到SPA的特定“页面”时下载其他JS代码。在React应用程序中，可以使用import()语法和webpack实现代码拆分。更好的方法是使用react-loadable，它是一个用于使用动态导入加载组件的高阶组件。React Loadable是一个小型库，它使组件中心化的代码拆分在React中变得非常容易。
React Router可以支持在路由之间进行动画过渡。这可以通过使用React Transition Group库中的 CSSTransition和TransitionGroup组件来实现。CSSTransition组件允许您在组件进入或退出DOM时应用动画，而TransitionGroup组件允许您对列表中的项进行动画处理。
使用React Transition Group库，可以实现各种动画效果。例如，可以创建淡入淡出，滑动，缩放，旋转等过渡效果。这些效果可以通过编写CSS动画并将其应用于CSSTransition组件来实现。
此外，您还可以使用第三方动画库，例如Framer Motion或Animate.css，来创建更复杂的过渡效果。
路由项目
- 打开任意页面，白屏时间超长
- 一个旁支页面的变更升级，导致主页直接崩溃
- 页面加载后，数据内容空白时间超长
- js bundle资源超大，静态资源超多
- 一个SPA应用承载200+页面，巨石应用,变更升级风险极大
- 海量数据接口请求
收获：
通过本次课程的学习，了解了路由扮演的角色，以及演变的必要性。同时学习了React-router这个常用的类库的源码，分析下路由如何驱动我们的视图变化。以及结合路由，在大型复杂应用里，我们可以做什么样的优化，提升我们的开发体验和用户体验。
