简体中文(ZH-CN) English(EN) 繁体中文(ZH-TW) 日本語(JA) 한국어(KO) Melayu(MS) Français(FR) Deutsch(DE)
javascript - Was ist das Prinzip der Leinwandkomprimierung von Bildern?
给我你的怀抱
给我你的怀抱 2017-06-26 10:55:55
0
2
1025

Die toDataURL-Methode im Canvas kann das Format und die Komprimierungsqualität des Bildes nach der Komprimierung angeben, beispielsweise in das WebP-Format komprimieren:

canvas.toDataURL('image/webp',quality);

toDataURLDas Bild wird mit Base64 kodiert und die kodierte Quelldatei ist 33 % größer als vor der Kodierung. Sehen Sie sich die Adresse an, aber der Qualitätsparameter kann die Komprimierungsqualität angeben. Je näher die Komprimierungsqualität bei 0 liegt, desto besser ist das Bild Kompression.

Frage 1: Kann Base64 das Bild komprimieren, wenn Base64-Kodierung zum Vergrößern der Bildquelldatei verwendet wird?

Frage 2: Dient die Codierung kleiner Bilder mit Base64 nur dazu, http-Anfragen zu reduzieren?

Frage 3: Was ist das Prinzip der Komprimierung von Bildern mit der toDataURL-Methode in Canvas? Was genau macht der Qualitätsparameter?

给我你的怀抱
给我你的怀抱

Antworte allen (2)
滿天的星座
滿天的星座2017-06-26 10:57:55 2 Etage

base64只是对图片对应的二进制码，按照六位对应一个字符规则做转换，转码后是反而比原图片文件大的。但是对于小图片而言，经转换后多出来的字节传输远比多建立一个http连接开销小，所以会利用base64对小图转码来提高页面加载速度。
至于图片压缩原理，简单来说，通过算法减少一张图片上的颜色差异，牺牲图片画质。比如紧挨着的颜色相近的四个像素的颜色信息压缩前大概占16个字节，压缩后变成一个颜色就能减少近4倍。quality用来控制色差的力度，值越小力度越大，颜色相差较大的两个像素也会被处理，自然被压缩后文件就越小，画质就越烂

Wie+0
Antwort hinzufügen
    黄舟
    黄舟2017-06-26 10:57:55 1 Etage

    1. 不行

    2. 是

    3. 控制图片编码格式的质量，例如webp可以进行有损压缩，质量越高，损失越小，文件体积就越大

    Wie+0
    Antwort hinzufügen
      Beliebte Themen
      Mehr>
      Populäre Artikel
      Beliebte Tutorials
      Mehr>
      Verwandte Tutorials
      Beliebte Empfehlungen
      Aktuelle Kurse
      Neueste Downloads
      Mehr>
      Web-Effekte
      Quellcode der Website
      Website-Materialien
      Frontend-Vorlage
      Über uns Haftungsausschluss Sitemap
      Chinesische PHP-Website：Online-PHP-Schulung für das Gemeinwohl，Helfen Sie PHP-Lernenden, sich schnell weiterzuentwickeln！