算法自动确定最佳的响应图像断点

Question

cloudary发布了一个自动生成响应式图像断点的工具:http://www.responsivebreakpoints.com/

使用以下旋钮调整断点和图像:

1. 分辨率范围(例如200px到1400px)
2. 每个图像之间的最小文件大小差异
3. 生成的最大图像数
4. 美术方向通过裁剪图像到不同的长宽比

美术方向的问题可以通过使用智能裁剪工具和人脸检测轻松解决。一个例子是smartcrop.js。

前3个条件进一步复杂化:

1. 不同的图像格式将有不同的文件大小与图像大小的比率。
2. 根据图像本身，它也会有不同的文件大小与图像大小的比例。

我能想到的唯一方法是生成一些断点，生成这些图像，然后检查约束并根据需要进行调整和再生。然而，这种暴力方法似乎效率极低。在给定这些条件下，是否有任何算法可以生成响应性断点(没有暴力强制)?

Answer 1

我的看法:

1. 分辨率范围(例如200px到1400px)
2. 每个图像之间的最小文件大小差异
3. 生成的最大图像数

这可能并不总是正确的，但我假设更高的分辨率总是导致更大的文件大小。换句话说，文件的大小是一个带有参数图像大小的强单调增长函数。

这可能不是对所有的压缩算法都成立，但是对所有的压缩算法都是一个很好的近似。

在此假设下，您可以通过在图像大小空间中的二进制搜索获得任何文件大小。这意味着您不必创建那么多不同的映像来满足您的需求。

备注:
他们不希望对生成的图像使用不同的图像格式。所以这个过程总是只使用一种文件格式。