Squoosh
新加坡
视觉传达无损放大

Squoosh

一款终极图像优化工具,可让你在浏览器中使用不同的编解码器对图像进行压缩和比较

标签:

Squoosh的全面解析

一、Squoosh是什么

Squoosh是由Google Chrome Labs开发的一款开源的在线图片压缩工具3 4。它的源码基于Apache License 2.0协议开源,托管在Github上,任何个人和公司都可以免费使用,也可以将源码用在自己开发的项目上3。此外,还有基于其开放原始码开发的桌面版应用(Squoosh Desktop App),适用于Windows、macOS和Linux系统,可100%离线使用13

Squoosh支持多种图像压缩格式,包括BMP、GIF、JP2、JPEG、MozJPEG、PDF、PNG、TIFF和WebP等,不过图像压缩的支持因浏览器而异22。它旨在通过减小图片文件的大小,同时保持尽可能高的图片质量,使得图片更易于传输和加载4 21。在Squoosh中,用户可以方便地尝试不同的图像编解码器,这也是其开发团队构建它的目的之一,通过使用WebAssembly模块的形式编译编解码器(编码器和解码器),即使用户的首选浏览器不支持某些较新的编解码器,也可以进行访问和试验20

二、Squoosh的用途

(一)网页开发中的应用

在网页开发领域,图片的大小对网页加载速度有着至关重要的影响。如果图片未经压缩,可能会导致网页加载缓慢,影响用户体验。Squoosh可以对网页中的图片进行压缩,从而减少文件大小,提高网页的加载速度。例如,一个包含大量高清图片的电商网站,如果使用Squoosh对产品图片进行压缩,能够使网页在用户访问时更快地呈现内容,减少用户等待时间,提高用户留存率和购买转化率。

(二)摄影后期的好帮手

对于摄影爱好者或专业摄影师来说,拍摄的照片往往体积较大。Squoosh在摄影后期处理方面能发挥很大作用。在保证图片质量的前提下,它可以减小图片文件大小,这样便于存储大量的照片,节省存储空间。而且在分享照片时,比如通过电子邮件、社交媒体或者云盘分享给他人时,压缩后的小体积图片传输速度更快,也能为接收者节省下载流量和时间。

(三)移动应用中的优化

在移动应用开发中,应用包的大小是一个重要因素。图片资源往往占据了相当大的部分。Squoosh可以用来减小应用中图片的大小,从而减小整个应用包的大小。这将加快应用的下载和安装速度,提升用户获取和使用应用的体验。例如,一款包含大量精美图片资源的旅游类移动应用,使用Squoosh优化图片后,用户在下载该应用时可以更快地完成下载并开始使用。

(四)电子邮件附件的优化

当我们需要通过电子邮件发送图片附件时,大体积的图片可能会导致邮件发送缓慢,甚至可能因为附件大小超过邮箱限制而无法发送。Squoosh可以对要作为附件的图片进行压缩,减小附件大小,这样不仅能够加快邮件的发送速度,而且接收者也能够更快地下载查看附件。

三、Squoosh怎么使用

(一)在线版使用方法

  1. 打开网页
  2. 上传图片
    • 可以通过上传或拖放自己的图片到编辑器中的方式添加需要压缩的图片。不过需要注意的是,在线版一次只能处理一张图片16 23
  3. 调整压缩设置
    • 上传图片后,在浏览器界面中可以开始调整图片的压缩设置。Squoosh提供了多种压缩算法和选项,如OptiPNG、MozJPEG、WebP等,并且每种算法都有不同的可自定义选项。例如,WebP可调整压缩比、画质或设定为「无损画质」(Lossless),也能对图片进行编辑(重设尺寸、减少调色盘)等操作,设定后会立即更新预览,通过预览可以从右下角图片大小得知是否获得更好的压缩效果13
  4. 比较原始与压缩图片
    • 在界面中有比较滑块,通过滑块可以显示原始图像和压缩图像之间的差异,这样用户就可以根据自己的需求保持项目所需的图像质量水平16
  5. 保存压缩后的图片
    • 当调整好压缩设置并对压缩效果满意后,选择右下角或左下角的「下载」按钮就能保存压缩后的相片13

(二)桌面版使用方法(Squoosh Desktop App)

  1. 下载安装
    • 访问Squoosh Desktop App网站,点击「Download」会跳到版本选择页面,提供Windows、Mac和Linux三种作业系统对应的软件下载,其中Windows有可携式免安装版(Portable) 13
  2. 打开应用并添加图片
    • 开启Squoosh桌面版后,其界面看起来和线上的Squoosh差不多,只要将相片拖曳到应用内就能进行压缩、最佳化等操作。在开始前Squoosh提供几种不同的示例图片,如大型相片、艺术工作、屏幕截图和SVG图标,可以点选先进行测试13
  3. 选择压缩算法和调整设置
    • 与在线版类似,桌面版也提供多种压缩算法如OptiPNG、MozJPEG、WebP等,用户可以选择切换不同的压缩工具,比较哪一种优化可以提供最佳的文件大小或相片品质。每一种优化相片的算法都有不同的可自定义选项,用户可以根据需求进行设置,设定后会立即更新预览,以查看压缩效果13
  4. 保存压缩后的图片
    • 对压缩效果满意后,通过应用内相应的保存按钮(通常是类似“下载”功能的按钮)保存压缩后的图片。

(三)命令行(Squoosh CLI)使用方法

  1. 获取命令行工具
    • 如果要使用命令行方式(Squoosh CLI),需要先确保系统安装了相关依赖(如可能需要先安装nodejs)。可以通过访问Squoosh的GitHub仓库获取相关命令行工具的信息和代码。例如在某些系统中,可以使用命令“npx @squoosh/cli options…”进行操作,不过具体操作可能因系统环境和需求而有所不同8
  2. 配置压缩参数
    • 例如,配置像“–mozjpeg {quality:80,baseline:false,arithmetic:false,progressive:true,optimize_coding:true,smoothing:0,color_space:3,quant_table:3,trellis_multipass:false,trellis_opt_zero:false,trellis_opt_table:false,trellis_loops:1,auto_subsample:true,chroma_subsample:2,separate_chroma_quality:false,chroma_quality:75}”这样的参数(这里以MozJPEG压缩算法为例),需要注意复制出来的参数可能需要进行格式调整,如去掉一些特殊字符才能正确使用8
  3. 设置循环和输出路径(针对批量压缩)
    • 如果要进行批量压缩,可以编写循环及设置输出路径。例如,若选择要压缩图片的原格式是“.JPG”,输出路径是“E:\桌面\compress\”,可以编写如下命令(在Windows系统下):“for %a in (*.JPG) do squoosh – cli –mozjpeg {quality:80,baseline:false,arithmetic:false,progressive:true,optimize_coding:true,smoothing:0,color_space:3,quant_table:3,trellis_multipass:false,trellis_opt_zero:false,trellis_opt_table:false,trellis_loops:1,auto_subsample:true,chroma_subsample:2,separate_chroma_quality:false,chroma_quality:75} %a -d E:\桌面\compress\”。然后在命令行中切换到要压缩的图片文件夹下,粘贴完整代码,回车运行即可开始批量压缩8

四、Squoosh的优势和劣势

(一)优势

  1. 高压缩比与高质量平衡
    • Squoosh具有极高的压缩比,能够在大幅减小图片文件大小的同时,尽可能保持图片的质量。这对于那些既需要减小图片体积又不想过度损失画质的用户来说非常重要。例如在网页开发中,经过Squoosh压缩后的图片在网页上显示时,用户很难察觉到与原始图片在画质上的明显差异,但文件大小却显著减小,从而提高了网页的加载速度。在摄影后期处理中,摄影师可以在保证照片质量的前提下,轻松地减小照片的存储大小以便于分享和存储9 14
  2. 开源免费
    • 作为一款开源工具,其源码基于Apache License 2.0协议开源,任何人都可以免费使用,并且可以将源码用于自己的开发项目。这为开发者提供了很大的便利,他们可以根据自己的需求对Squoosh进行定制化开发,或者将其集成到自己的应用或工作流程中。同时,对于普通用户来说,免费的特性也使得它成为一个经济实惠的图片压缩选择3
  3. 支持多种格式和编解码器
    • Squoosh支持多种图像压缩格式,如BMP、GIF、JP2、JPEG、MozJPEG、PDF、PNG、TIFF和WebP等,并且还支持多种编解码器。这意味着它可以处理各种各样的图片类型,满足不同用户在不同场景下的需求。例如,在处理不同来源(如相机拍摄的JPEG图片、扫描的PDF文件中的图片等)的图片时,都可以使用Squoosh进行压缩操作22
  4. 可离线使用(桌面版)
    • Squoosh的桌面版应用(Squoosh Desktop App)可以在没有网络的情况下使用。这对于一些在没有网络环境或者网络不稳定的场景下需要进行图片压缩的用户来说非常实用。比如,摄影师在户外拍摄时,可能没有网络信号,但可以使用Squoosh桌面版对拍摄的照片进行压缩处理,以便后续存储或分享13
  5. 多种使用方式
    • 它提供了在线版、桌面版和命令行(CLI)等多种使用方式。在线版方便快捷,无需安装即可使用;桌面版适合在本地进行批量处理等操作;命令行方式则为高级用户或者需要进行自动化批量压缩等操作的用户提供了更灵活的选择。用户可以根据自己的需求和使用场景选择最适合自己的方式来使用Squoosh进行图片压缩13 16 8

(二)劣势

  1. 批量处理不便(在线版)
    • Squoosh的在线版一次只能压缩一张图片,如果用户手中有大量的图片需要压缩,操作起来会非常繁琐。相比之下,一些其他的图片压缩工具可能提供更方便的批量压缩功能。例如,TinyPNG在处理大量图片的批量压缩时可能是一个更好的选择23
  2. 学习成本(命令行方式)
    • 对于不熟悉命令行操作的普通用户来说,使用Squoosh的命令行方式(Squoosh CLI)可能存在一定的学习成本。需要掌握相关的命令、参数设置以及可能的系统环境配置等知识。例如,在配置压缩参数时,需要了解像“–mozjpeg {quality:80,baseline:false,arithmetic:false,progressive:true,optimize_coding:true,smoothing:0,color_space:3,quant_table:3,trellis_multipass:false,trellis_opt_zero:false,trellis_opt_table:false,trellis_loops:1,auto_subsample:true,chroma_subsample:2,separate_chroma_quality:false,chroma_quality:75}”这样复杂的参数含义和用法,这对于非技术用户来说可能是一个挑战8

五、Squoosh相关案例

(一)网页开发中的案例

  1. 电商网站优化
    • 某电商网站拥有大量的产品图片,这些图片在未优化之前,导致网页加载速度很慢。开发团队决定使用Squoosh对图片进行压缩。他们选择了合适的压缩算法和质量设置,对所有的产品图片进行了压缩处理。经过Squoosh的优化后,网页的整体加载速度得到了显著提升。原本需要等待较长时间才能完全加载的商品页面,现在能够快速地呈现在用户面前,提高了用户体验,同时也减少了用户因为等待时间过长而离开网站的可能性,最终提升了网站的销售额。
  2. 新闻媒体网站
    • 新闻媒体网站通常会包含很多新闻配图。在使用Squoosh之前,由于图片体积较大,在移动设备上加载时会消耗大量流量并且速度较慢。通过将Squoosh集成到图片上传和发布流程中,对每一张要发布的图片进行压缩,新闻媒体网站在移动网络下的加载速度明显加快,读者能够更快地浏览新闻内容,特别是在一些网络信号不好的地区,这种优化效果更加明显,提高了网站的用户满意度和新闻的传播效率。

(二)摄影后期的案例

  1. 婚礼摄影师
    • 一位婚礼摄影师在拍摄完一场婚礼后,得到了大量的高清照片,总大小达到了几十个G。他需要将这些照片分享给客户,但直接分享原始照片不仅传输速度慢,而且会占用大量的存储空间。于是,他使用Squoosh对这些照片进行了压缩。在保证照片质量的前提下,将照片的大小减小到原来的几分之一,既方便了他将照片存储到云盘分享给客户,也让客户能够更快地下载和查看照片。
  2. 摄影爱好者分享作品
    • 摄影爱好者经常在社交媒体上分享自己的作品。在使用Squoosh之前,由于图片未经压缩,上传速度慢,而且会消耗大量的移动数据流量。使用Squoosh对照片进行压缩后,他可以更快地将作品分享到社交媒体上,同时也不会因为图片质量过度压缩而影响作品的展示效果,吸引了更多的朋友点赞和评论。

(三)移动应用中的案例

  1. 旅游类应用
    • 一款旅游类移动应用包含了大量世界各地的美景图片,这些图片使得应用包的大小达到了几百兆。这导致用户在下载和安装应用时需要花费较长的时间,并且占用了大量的手机存储空间。开发团队使用Squoosh对应用中的图片进行了优化,减小了图片的大小。经过优化后,应用包的大小显著减小,用户下载和安装应用的速度加快,同时在使用应用过程中,图片的加载速度也得到了提升,提高了用户对该应用的满意度和使用率。
  2. 美食类应用
    • 美食类应用中有很多精美的菜品图片。在使用Squoosh之前,由于图片文件较大,在用户浏览菜品信息时,图片加载缓慢。通过使用Squoosh对菜品图片进行压缩,优化了图片文件大小,在保证菜品图片美观的前提下,提高了图片在应用中的加载速度,让用户能够更流畅地浏览美食信息,增加了用户在应用内的停留时间和下单的可能性。

数据评估

Squoosh浏览人数已经达到4,如你需要查询该站的相关权重信息,可以点击"5118数据""爱站数据""Chinaz数据"进入;以目前的网站数据参考,建议大家请以爱站数据为准,更多网站价值评估因素如:Squoosh的访问速度、搜索引擎收录以及索引量、用户体验等;当然要评估一个站的价值,最主要还是需要根据您自身的需求以及需要,一些确切的数据则需要找Squoosh的站长进行洽谈提供。如该站的IP、PV、跳出率等!

关于Squoosh特别声明

本站i For AI – 人工智能AI工具,一站式导航提供的Squoosh都来源于网络,不保证外部链接的准确性和完整性,同时,对于该外部链接的指向,不由i For AI – 人工智能AI工具,一站式导航实际控制,在2024年11月18日 下午1:33收录时,该网页上的内容,都属于合规合法,后期网页的内容如出现违规,可以直接联系网站管理员进行删除,i For AI – 人工智能AI工具,一站式导航不承担任何责任。

相关导航

暂无评论

您必须登录才能参与评论!
立即登录
暂无评论...