前端图片懒加载和路由懒加载

前端图片懒加载（Image Lazy Loading）和路由懒加载（Route Lazy Loading）是两种不同的优化技术，用于提高用户体验和网站性能。

1. **图片懒加载**：
- 图片懒加载是一种延迟加载策略，当用户滚动到图片所在位置时才加载图片，而不是在页面加载初期就全部加载。这有助于减少初始页面加载时间，尤其是在内容较多或图片数量较大的情况下。
- 常见实现方式包括使用Intersection Observer API（Intersection Observer API是一个浏览器原生API，用于检测元素是否进入视口），或者利用HTML的`<img>`标签的`srcset`和`loading`属性，如`loading="lazy"`。
- 相关问题：
1. 如何使用Intersection Observer API实现懒加载？
2. `srcset`和`loading="lazy"`如何协同工作？
3. 图片懒加载对SEO有影响吗？

2. **路由懒加载**：
- 路由懒加载是针对单页应用（SPA）的一种优化，只在用户导航到特定路由时才加载该路由对应的组件或模块，而不是一开始就下载所有可能的页面内容。
- 这通常在服务器端渲染（SSR）、动态导入（Dynamic Import）或路由预加载（Preloading）时使用，比如React的`import()`函数或Vue的`require()`。
- 相关问题：
1. 如何在Vue中实现路由懒加载？
2. SSR和路由懒加载有什么区别？
3. 使用动态导入时如何处理异步依赖？

两者都是前端性能优化的重要手段，可以帮助提高网页的加载速度和用户交互体验。