使用Laravel优化颤动应用程序的图像

Question

我对图片在移动应用程序中的工作原理有点困惑，比如良好的大小和尺寸才能获得良好的性能。

我准备了这么多文章，但没有人给我一个好的答案，所以我在这里请求有经验的开发人员给我一条可遵循的道路。

我有一个像服装市场这样的应用程序，所以我的应用程序有很多图像和产品，问题是我从Angular应用程序中对图像进行了小调整，以便在上传之前更改图像的大小。

我的客户上传像3mb，2mb，4mb的图像，我知道这不好，因为我做了调整大小，但我的客户上传了一个大尺寸的图像，这破坏了我的应用程序。

就像一个每2500px有4500px，只有200kbyte的图片，这个图片破坏了我的应用，所以我想知道图片保持良好性能的规则。

我会做一个循环，将调整和优化所有的图像从应用程序使用我的后端Laravel。

因此，在我的flutter应用程序中，我使用这个来进行优化

 CachedNetworkImage(
  fit: BoxFit.cover,
  placeholder: (context, url) =>
      Skeleton(
    height: 200,
    width: 200,
  ),
  imageUrl:
      "${MainConfig.storageDoc + widget.companyProductList[index]['srcimglist'][0]['file_path']}",
),

我看到一些其他的项目使用类似Wordpress的方式。

​

​

这使得如此多的图像尺寸来提高性能，这是移动世界的正确方法吗？

Answer 1

根据我所读到的，我发现图像不能超过2400x1600px，并且应该是jpeg，因为它是最压缩的技术之一，对于上传，你可以确保你的应用程序只接受这种类型的文件，标准如下。

另外，在flutter中，你可能不想在同一个页面上渲染所有的图像，你可以将它分成几个页面，这样你就不会同时加载所有的图像。这里有一个你怎么做的链接：https://flutter.dev/docs/perf/rendering/best-practices#render-grids-and-lists-lazily