我正在从事一个项目，该项目可以在具有不同屏幕（大约50/50 pc /移动设备）的各种设备上呈现配置文件图像。随着网站和应用程序的发展，我已经看到有必要优化我的图像。我们有两种类型的图像-矩形轮廓图像和正方形头像图像-当前用于：
存储和调整这些图像大小的最佳实践是什么？
针对移动设备和Web上的DPI（出于速度和图像质量）的最佳DPI是什么？
限制图像大小（太大）的有效验证规则是什么？
要与其他用户的许多其他聊天头像图像一起呈现在屏幕上的聊天头像，以px为单位的最佳尺寸是多少？
您是否可以推荐一些不错的React前端库来帮助进行图像验证？