在 React 项目中，有哪些常见的方式可以加载和显示图片？请比较这些方式的优缺点，并说明在什么场景下选择哪种方式更合适。

回答思路

1. 【回答框架 1】常见的引入图片方式主要有三种：使用import语句将图片作为模块导入，将图片放在public目录下通过绝对路径引用，以及通过CSS或内联样式中的url()引用。import方式会经过webpack处理，生成带hash的文件名，适合需要打包优化的资源。
2. 【回答框架 2】import方式推荐用于组件内部使用的图片，它能利用webpack的依赖管理和代码分割，图片会被压缩并缓存。public目录方式适合放在index.html中的favicon或需要动态拼接路径的图片，但不会经过构建优化，路径需以%PUBLIC_URL%开头。
3. 【回答框架 3】CSS中url()引用图片同样会被webpack处理，适合背景图等样式资源。比较而言，import方式更灵活，能享受构建优化；public方式适合静态资源；CSS方式适合样式相关图片。选择依据是资源是否与组件逻辑相关及是否需要优化。
4. 【回答框架 4】对于大量图片，可考虑使用CDN或图片懒加载。最佳实践是结合项目构建配置，例如通过url-loader或file-loader配置小图转base64，大图走CDN。
5. 【关键点 1】import方式适合组件内图片，享受webpack优化。
6. 【关键点 2】public目录适合静态资源，如favicon，但不经构建处理。
7. 【关键点 3】CSS url()引用适合背景图，同样被构建处理。
8. 【关键点 4】选择取决于资源用途及是否需要优化。