{"id":181603,"date":"2020-05-16T09:00:58","date_gmt":"2020-05-16T01:00:58","guid":{"rendered":"https:\/\/lrxjmw.cn\/?p=181603"},"modified":"2020-05-11T22:01:14","modified_gmt":"2020-05-11T14:01:14","slug":"png-jpg-webp","status":"publish","type":"post","link":"https:\/\/lrxjmw.cn\/png-jpg-webp.html","title":{"rendered":"\u7ebf\u4e0a\u56fe\u7247\u4f7f\u7528WebP\u53ef\u4ee5\u63d0\u9ad8\u7f51\u7ad9\u7684\u4f53\u9a8c\u5ea6"},"content":{"rendered":"
\u5bfc\u8bfb<\/td>\n | WebP \u662f 2010 \u5e74 Google \u5f00\u53d1\u7684\u4e00\u79cd\u56fe\u7247\u683c\u5f0f\uff0c\u5b83\u4e3a\u7f51\u9875\u4e0a\u7684\u56fe\u7247\u63d0\u4f9b\u4e86\u5353\u8d8a\u7684\u65e0\u635f\u548c\u6709\u635f\u538b\u7f29\u3002\u7f51\u7ad9\u5f00\u53d1\u8005\u4eec\u53ef\u4ee5\u4f7f\u7528 WebP \u6765\u521b\u5efa\u5c3a\u5bf8\u66f4\u5c0f\u3001\u7ec6\u8282\u66f4\u4e30\u5bcc\u7684\u56fe\u7247\uff0c\u4ee5\u6b64\u6765\u63d0\u9ad8\u7f51\u7ad9\u7684\u901f\u5ea6\u3002\u66f4\u5feb\u7684\u52a0\u8f7d\u901f\u5ea6\u5bf9\u4e8e\u7f51\u7ad9\u7684\u7528\u6237\u4f53\u9a8c\u548c\u7f51\u7ad9\u7684\u8425\u9500\u6548\u679c\u662f\u81f3\u5173\u91cd\u8981\u7684\u3002<\/strong><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n <\/p>\n \u4e3a\u4e86\u5728\u6240\u6709\u8bbe\u5907\u548c\u7528\u6237\u4e2d\u8fbe\u5230\u6700\u4f73\u52a0\u8f7d\u6548\u679c\uff0c\u4f60\u7f51\u7ad9\u4e0a\u7684\u56fe\u7247\u6587\u4ef6\u5927\u5c0f\u4e0d\u5e94\u8be5\u8d85\u8fc7 500 KB\u3002<\/p>\n \u4e0e PNG \u56fe\u7247\u76f8\u6bd4\uff0cWebP \u65e0\u635f\u56fe\u7247\u901a\u5e38\u81f3\u5c11\u8981\u6bd4 PNG \u56fe\u7247\u5c0f 25%\u3002\u5728\u540c\u7b49\u7684 SSIM\uff08\u7ed3\u6784\u76f8\u4f3c\u5ea6structural similarity\uff09\u8d28\u91cf\u6307\u6807\u4e0b\uff0cWebP \u6709\u635f\u56fe\u7247\u901a\u5e38\u6bd4 JPEG \u56fe\u7247\u5c0f 25% \u5230 34%\u3002<\/p>\n \u65e0\u635f WebP \u4e5f\u652f\u6301\u900f\u660e\u5ea6\u3002\u800c\u5728\u53ef\u63a5\u53d7\u6709\u635f RGB \u538b\u7f29\u7684\u60c5\u51b5\u4e0b\uff0c\u6709\u635f WebP \u4e5f\u652f\u6301\u900f\u660e\u5ea6\uff0c\u901a\u5e38\u5176\u5927\u5c0f\u6bd4 PNG \u6587\u4ef6\u5c0f\u4e09\u500d\u3002<\/p>\n Google \u62a5\u544a\u79f0\uff0c\u628a\u52a8\u753b GIF \u6587\u4ef6\u8f6c\u6362\u4e3a\u6709\u635f WebP \u540e\u6587\u4ef6\u5927\u5c0f\u51cf\u5c11\u4e86 64%\uff0c\u8f6c\u6362\u4e3a\u65e0\u635f WebP \u540e\u6587\u4ef6\u5927\u5c0f\u51cf\u5c11\u4e86 19%\u3002<\/p>\n WebP \u6587\u4ef6\u683c\u5f0f\u662f\u4e00\u79cd\u57fa\u4e8e RIFF\uff08\u8d44\u6e90\u4e92\u6362\u6587\u4ef6\u683c\u5f0fresource interchange file format\uff09\u7684\u6587\u6863\u683c\u5f0f\u3002\u4f60\u53ef\u4ee5\u7528 hexdump \u770b\u5230\u6587\u4ef6\u7684\u7b7e\u540d\u662f 52 49 46 46\uff08RIFF\uff09\uff1a<\/p>\n $ hexdump --canonical pixel.webp\r\n00000000 \u00a052 49 46 46 26 00 00 00 \u00a0[...] \u00a0|RIFF&...WEBPVP8 |\r\n00000010 \u00a01a 00 00 00 30 01 00 9d \u00a0[...] \u00a0|....0....*......|\r\n00000020 \u00a00e 25 a4 00 03 70 00 fe \u00a0[...] \u00a0|.%...p...`....|\r\n0000002e<\/pre>\n |