标签: image-optimization

我想看一些在线与离线图像优化器的比较数字,即Yahoo! Smush.it与OptiPNG或pngcrush.

这些东西在速度和图像尺寸方面有何不同,最佳选择是什么？

我的网站有大约2万个产品图片.谷歌页面速度告诉我他们可以优化,这是正确的 - 差异是巨大的.Google可以保持相同的质量并将图像尺寸缩小70-90%,而Page Speed甚至可以为我优化它们,并为我提供优化图像的链接.如果我只有一些图像,这将是很好的,但我无法手动更新20k图像.我不想进行任何程序化更改来处理优化,我宁愿通过一个可以优化它们并替换现有图像的软件来运行我的所有图像.如果以前经历过此项目的人能推荐一个能够完成这么大的工作而又能保持质量的好程序,我将不胜感激.谢谢.

我正在尝试使用paperclip-optimizer部署Rails应用程序,它给了我一个关于丢失二进制文件的错误.我已经捆绑了image_optim_pack来提供二进制文件,但仍然得到这个:

ImageOptim::BinResolver::Error occurred
pngcrush worker: `pngcrush` not found; please provide proper binary or di=
sable this worker (--no-pngcrush argument or `:pngcrush =3D> false` throu=
gh options)
advpng worker: `advpng` not found; please provide proper binary or disabl=
e this worker (--no-advpng argument or `:advpng =3D> false` through optio=
ns)
optipng worker: `optipng` not found; please provide proper binary or disa=
ble this worker (--no-optipng argument or `:optipng =3D> false` through o=
ptions)
pngquant worker: `pngquant` not found; please provide proper …

在Google Chrome中运行Page Speed时,建议优化/压缩图像.这些图像大多是由用户上传的,因此我需要在上传过程中对其进行优化.我发现用PHP优化jpeg图像就像使用以下GD功能:

getimagesize()
imagecreatefromjpeg()
imagejpeg()

因为我上载后调整图像我已经通过这些功能,拉动图像,另外我用imagecopyresampled()后imagecreatefromjpeg()调整其大小.

但是,Page Speed仍然告诉我这些图像可以进行优化.如何在php脚本中完成此优化？在imagejpeg()中设置较低的质量也没有区别.

在HTTP/2中不需要捆绑JS和CSS文件,但是图像精灵呢？

看一下这个演示,它似乎已经比HTTP/1.1更快地运行,但不会将图像捆绑到精灵中使它更快？我的意思是,当所有数据都在一个文件中时,PNG的优化算法不会更好吗？

亚马逊上有一个特定的 url，它在 s3 上存储一些图像，相关的亚马逊域已在 next.config.js 中的域上配置，但不会在前面加载。如果我输入任何外部网址、unsplah 或其他网址，它会正常加载。

有问题的网址是：idinheiro-admin-images.s3.sa-east-1.amazonaws.com

控制台上出现的错误是在带有 404 (Bad Request) 的 url 中

-- 错误控制台 --

GET http://localhost:3000/_next/image?url=https%3A%2F%2Fidinheiro-admin-images.s3.sa-east-1.amazonaws.com%2Fcartao-de-credito%2Fol%25C3%25A9%2520consignado_1619718123784.png&w=64&q=75 400 (Bad Request)

-- next.config.js --

(module.exports = {
    images: {
      domains: [
        'images.unsplash.com',
        'idinheiro-admin-images.s3.sa-east-1.amazonaws.com'
      ]
    }
  })

-- 使用组件 --

<Image
   src="https://idinheiro-admin-images.s3.sa-east-1.amazonaws.com/cartao-de-credito/ol%C3%A9%20consignado_1619718123784.png"
   alt={partnerCard.alt}
   width={100}
   height={63}
/>

我已经在Google上搜索了一个很好的Mass Image Optimizer,可以在Windows或PHP上使用来优化文件夹的图像,但没有一个像TinyPNG.com那样好.他们中的大多数都提高了规模而不是收缩.谷歌Pagespeed Insight喜欢TinyPNG的尺寸,但没有发现任何比较.

我可以使用任何建议吗？

图像优化器库似乎存在错误。

同样的错误发生在gulp-image-min其他一些 gulp 插件上。

任何人都可以帮忙吗？

我的吞咽任务：

var image = require('gulp-image');

gulp.task('images', function () {
    return gulp.src('app/images/*')
        .pipe(image())
        .pipe(gulp.dest('dist/images'));
});

结果：

[13:22:35] Using gulpfile ~/Desktop/Test/gulpfile.js
[13:22:35] Starting 'images'...
{ Error: spawn /Users/Sam/Desktop/Test/node_modules/jpegoptim-bin/vendor/jpegoptim ENOENT
    at exports._errnoException (util.js:953:11)
    at Process.ChildProcess._handle.onexit (internal/child_process.js:182:32)
    at onErrorNT (internal/child_process.js:348:16)
    at _combinedTickCallback (internal/process/next_tick.js:74:11)
    at process._tickCallback (internal/process/next_tick.js:98:9)
code: 'ENOENT',
errno: 'ENOENT',
syscall: 'spawn /Users/Sam/Desktop/Test/node_modules/jpegoptim-bin/vendor/jpegoptim',
path: '/Users/Sam/Desktop/Test/node_modules/jpegoptim-bin/vendor/jpegoptim',
spawnargs: 
[ '--strip-all',
    '--strip-iptc',
    '--strip-icc',
    '--stdin',
    '--stdout' ],
cmd: '/Users/Sam/Desktop/Test/node_modules/jpegoptim-bin/vendor/jpegoptim --strip-all --strip-iptc --strip-icc --stdin --stdout',
stdout: <Buffer >,
stderr: <Buffer > }

我有以下类来处理Bitmap以在其上放置鱼眼失真.

我通过TraceView运行我的应用程序,发现几乎所有的处理时间都花在循环遍历位图上.
一位开发人员建议不使用float,因为这会降低图形的速度.还需要使用math.pow()和ceil()吗？
目前通过循环整个位图放置效果需要大约42秒,是秒:)
我已经尝试用int替换浮点数并且已经将时间减少到37秒,但效果不再出现在位图.
arg k最初是一个浮点数并设置失真级别,例如0.0002F,如果我传递一个int,效果不起作用.

任何人都可以指出我如何优化这个过程的正确方向？一旦我对它进行了优化,我想调查可能不会遍历整个位图,并且可能在效果周围放置一个边界框,或者使用下面的算法来确定像素是否在半径为150的圆内.

class Filters{
    float xscale;
    float yscale;
    float xshift;
    float yshift;
    int [] s;
    private String TAG = "Filters";
    long getRadXStart = 0;
    long getRadXEnd = 0;
    long startSample = 0;
    long endSample = 0;
    public Filters(){

        Log.e(TAG, "***********inside filter constructor");
    }

    public Bitmap barrel (Bitmap input, float k){
        //Log.e(TAG, "***********INSIDE BARREL METHOD ");

        float centerX=input.getWidth()/2; //center of distortion
        float centerY=input.getHeight()/2;

        int width = input.getWidth(); //image bounds
        int height = input.getHeight();

        Bitmap dst …

我一直在寻找一种优化图像以获得更好性能的解决方案。

在尝试了一些解决方案（例如Sharp和imagemin，这导致文件永远不会更小，有时更大）之后，我现在正在尝试尝试 Google 的 pagespeed。不幸的是，pagespeed 似乎只支持 Apache 和 Nginx，我不想将其添加到我的堆栈中只是为了图像优化（另外，我更喜欢在上传时进行优化，而不是在服务器请求时进行优化，即使缓存）。

我将非常感谢任何可能帮助我在本机 Node.js 中实现这一点的信息，以及任何其他（有效！）图像优化建议。