mirror of
https://gitflic.ru/project/photopea-v2/photopea-v-2.git
synced 2025-08-17 17:06:21 +00:00
119 lines
6.5 KiB
HTML
119 lines
6.5 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<title> PNG minifier inside Photopea</title>
|
|
<meta name="viewport" content="width=device-width, minimum-scale=1.0, maximum-scale=1.0, initial-scale=1.0" />
|
|
<link rel="stylesheet" href="https://blog.photopea.com/wp-content/themes/simplex/style.css" type="text/css" media="screen" />
|
|
<link href="https://fonts.googleapis.com/css?family=Open+Sans:400,400i,700,700i" rel="stylesheet">
|
|
<script>
|
|
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
|
|
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
|
|
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
|
|
})(window,document,'script','//www.google-analytics.com/analytics.js','ga');
|
|
ga('create', 'UA-4249565-38', 'photopea.com'); ga('send', 'pageview');
|
|
</script>
|
|
</head>
|
|
|
|
<body>
|
|
<div id="page">
|
|
<div id="header">
|
|
<a href="https://blog.photopea.com/" class="title">Photopea Blog</a>
|
|
<!--<p>Web-based image editor.</p>-->
|
|
<a class="curr" href="//blog.photopea.com">Blog</a> |
|
|
<a href="//www.photopea.com/learn">Learn</a> |
|
|
<a href="//www.photopea.com/tuts">Tutorials</a> |
|
|
<a href="//www.photopea.com/templates">Templates</a> |
|
|
<a href="//www.photopea.com/api">API</a> |
|
|
<a href="//www.facebook.com/photopea"><img src="//photopea.com/img/facebook.svg" /></a> |
|
|
<a href="//www.twitter.com/photopeacom"><img src="//photopea.com/img/twitter.svg" /></a>
|
|
</div> <div id="main">
|
|
<div id="content">
|
|
|
|
<div class="post" id="post-412">
|
|
<span class="date">May 9, 2017</span>
|
|
<h1>PNG minifier inside Photopea</h1>
|
|
<div class="entry">
|
|
|
|
<p>We have added a new feature to Photopea, which can significantly minify PNG images.</p>
|
|
<span id="more-412"></span>
|
|
|
|
<big>Update!!! A separate app at <a href="http://upng.photopea.com">UPNG.photopea.com</a>.</big>
|
|
|
|
<h2>PNG minification</h2>
|
|
|
|
<p>It is very popular to minify PNG images on the web to reduce the network traffic and make websites load faster. There are many free and commercial tools for it, which usually allow reducing the size of PNG files by 50 to 80 percent. <a href="https://tinypng.com/" target="_blank">TinyPNG</a> is a very pupular service for PNG minification. The same company also offers a plugin for Adobe Photoshop for $50.</p>
|
|
|
|
<p>Starting today, there is a PNG minification service built right into Photopea, anybody can use it for free. We decided to publish our efforts in an <a href="https://github.com/photopea/UPNG.js" target="_blank">open-source library UPNG.js</a>, which is also availabe to everybody for free.</p>
|
|
|
|
<p>When minifying PNGs with such methods, there is a tiny loss in the quality. To use PNG minification, go to <a href="https://www.Photopea.com" target="_blank">Photopea editor</a> and open a file (or create a new one). Then, choose File - Save for web - PNG format. You can either leave the quality at 100% for a lossless PNG, or decrease it for minification. You can also see a preview of the result and the size of the new file.</p>
|
|
|
|
<a name="examples"></a><h2>Examples</h2>
|
|
|
|
<p>Here are several examples of PNG minification. Click on the thumbnails to see an actual file.</p>
|
|
|
|
<style> table img { width:100%; height:auto; }</style>
|
|
|
|
<table>
|
|
<tr><th>Original</th><th>TinyPNG</th><th>Photopea: UPNG.js</th></tr>
|
|
<tr>
|
|
<td>31 638 B <a target="_blank" href="/pngs/pug.png" ><img src="/pngs/pug.png" /></a></td>
|
|
<td>12 409 B <a target="_blank" href="/pngs/pug-t.png" ><img src="/pngs/pug-t.png" /></a></td>
|
|
<td>11 102 B <a target="_blank" href="/pngs/pug-pp.png"><img src="/pngs/pug-pp.png" /></a></td>
|
|
</tr>
|
|
|
|
<tr>
|
|
<td>75 628 B <a target="_blank" href="/pngs/mbike.png" ><img src="/pngs/mbike.png" /></a></td>
|
|
<td>21 212 B <a target="_blank" href="/pngs/mbike-t.png" ><img src="/pngs/mbike-t.png" /></a></td>
|
|
<td>17 522 B <a target="_blank" href="/pngs/mbike-pp.png"><img src="/pngs/mbike-pp.png" /></a></td>
|
|
</tr>
|
|
|
|
<tr>
|
|
<td>105 035 B <a target="_blank" href="/pngs/mouse.png" ><img src="/pngs/mouse.png" /></a></td>
|
|
<td> 37 192 B <a target="_blank" href="/pngs/mouse-t.png" ><img src="/pngs/mouse-t.png" /></a></td>
|
|
<td> 33 885 B <a target="_blank" href="/pngs/mouse-pp.png"><img src="/pngs/mouse-pp.png" /></a></td>
|
|
</tr>
|
|
|
|
<tr>
|
|
<td>62 896 B <a target="_blank" href="/pngs/rose-icon.png" ><img src="/pngs/rose-icon.png" /></a></td>
|
|
<td>18 413 B <a target="_blank" href="/pngs/rose-icon-t.png" ><img src="/pngs/rose-icon-t.png" /></a></td>
|
|
<td>14 715 B <a target="_blank" href="/pngs/rose-icon-pp.png"><img src="/pngs/rose-icon-pp.png" /></a></td>
|
|
</tr>
|
|
|
|
<tr>
|
|
<td>23 262 B <a target="_blank" href="/pngs/logo.png" ><img src="/pngs/logo.png" /></a></td>
|
|
<td> 7 275 B <a target="_blank" href="/pngs/logo-t.png" ><img src="/pngs/logo-t.png" /></a></td>
|
|
<td> 5 251 B <a target="_blank" href="/pngs/logo-pp.png"><img src="/pngs/logo-pp.png" /></a></td>
|
|
</tr>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
|
|
</div><!--content-->
|
|
|
|
<div style="width:110px; margin: 0px auto;">
|
|
<a href="#" title="Share on Facebook" onclick="smallWindow('http://www.facebook.com/share.php?u=');"><img src="//www.photopea.com/promo/fb.png" /></a>
|
|
<a href="#" title="Share on Google Plus" onclick="smallWindow('https://plus.google.com/share?url=');"><img src="//www.photopea.com/promo/gp.png" /></a>
|
|
<a href="#" title="Share on Twitter" onclick="smallWindow('http://twitter.com/share?url=');"><img src="//www.photopea.com/promo/tw.png" /></a>
|
|
<script type="text/javascript">
|
|
function smallWindow(url)
|
|
{
|
|
var w = 640, h = 300;
|
|
window.open(url+"https://blog.photopea.com/png-minifier-inside-photopea.html", "Share", "width="+w+",height="+h+",left="+Math.floor((window.innerWidth-w)/2)+",top="+Math.floor((window.innerHeight-h)/2));
|
|
}
|
|
</script>
|
|
</div>
|
|
</div>
|
|
<div id="disqus_thread"></div>
|
|
<script type="text/javascript">
|
|
var disqus_shortname = 'photopeablog'; // required: replace example with your forum shortname
|
|
(function() { var dsq = document.createElement('script'); dsq.type = 'text/javascript'; dsq.async = true;
|
|
dsq.src = '//' + disqus_shortname + '.disqus.com/embed.js';
|
|
(document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(dsq); })();
|
|
</script>
|
|
<!--main-->
|
|
<?//php get_sidebar(); ?>
|
|
|
|
<div id="footer">© 2013-2021 support@photopea.com</div>
|
|
</div> <!--page-->
|
|
</body>
|
|
</html> |