关于前端:学习图片06PNG

本文首发于微信公众号：大迁世界, 我的微信：qq449245884，我会第一工夫和你分享前端行业趋势，学习路径等等。
更多开源作品请看 GitHub https://github.com/qq449245884/xiaozhi ，蕴含一线大厂面试残缺考点、材料以及我的系列文章。

PNG（Portable Network Graphics）与其余格局有一些不同之处，只管它旨在取代GIF，但在多个方面与GIF相似。PNG还应用无损压缩，这意味着图像数据将被压缩而不会失去视觉保真度。图像的调色板能够被量化为“索引色彩”，PNG应用的调色板与GIF一样仅限于256种颜色。而更常见的“真彩色”PNG能够蕴含许多，许多种色彩，最多可达1600万种。

PNG和GIF都反对透明度，不过有一个重要区别。GIF将透明度视为二进制命题——像素要么是不通明的色彩，要么是齐全通明的。PNG反对“alpha通道”透明度，这意味着每个像素能够被设置为0（齐全通明）到255（齐全不通明）之间的透明度级别。

实际上，PNG中的大量量化和无损压缩意味着将图像保留为PNG不会导致视觉品质降落。然而，与更古代的面向Web的编码相比，这总会导致文件大小过大。PNG的传输大小简直从来不是拍摄内容的正确抉择。因而，在波及摄影内容时，PNG 不是正确的抉择。

在过来，PNG在很大水平上被广泛应用于一个用例，即作为惟一反对半透明的光栅编码格局。现在，PNG只应被思考用于须要半透明的简略艺术作品，比方蕴含投影的公司标记，并应与反对半透明的更古代格局（如WebP）进行认真比拟。

与GIF相似，PNG在解决在可扩展性和文件大小方面更适宜应用SVG的用例。因而，有时会看到PNG被用作UI元素的备选版本，这是因为在极少数不反对SVG的浏览器中，这是一种可行的代替办法，但这种状况越来越少见。

实际上，PNG是保护源图像大小正当的“标准”版本的理智抉择，它能够保留在本地开发环境中或提交到我的项目存储库中，以便未来须要编辑或从新保留该图像为代替格局的版本。

但值得注意的是，只管编码是标准化的，不同的编辑工具具备不同的编码方法，有些办法比其余办法更无效。在任何状况下传输PNG文件之前，请务必应用Squoosh或ImageOptim等工具对文件进行解决。

代码部署后可能存在的BUG没法实时晓得，预先为了解决这些BUG，花了大量的工夫进行log 调试，这边顺便给大家举荐一个好用的BUG监控工具 Fundebug。

原文：https://web.dev/learn/images/...

交换

有幻想，有干货，微信搜寻 【大迁世界】 关注这个在凌晨还在刷碗的刷碗智。

本文 GitHub https://github.com/qq449245884/xiaozhi 已收录，有一线大厂面试残缺考点、材料以及我的系列文章。