Jump to content
You must now use your email address to sign in [click for more info] ×

Export compression - jpg and png size


Recommended Posts

Hi,

If I export the file attached in Affinity Photo the exported file size gets very big. So I compared it with my old Photoshop CS4 and got this results:

ps cs4
jpeg 75%: 551 kb
png-8: 475 kb

af 1.7.2
jpeg 75%: 1.36 mb
png-8: 634 kb

Why the compression in Affinity Photo is so worse? Is there no 'save for web' function in Affinity Photo?

tap tab aug-sept flyer front.jpg

Link to comment
Share on other sites

Notice that quality 75 % does not have the same meaning in PS and AP, they do not use the same scale. Thus you must aim for the same file size and then compare visually the results. But yes, AP tends to make not as hi fidelity results as PS when file size is the same.

Link to comment
Share on other sites

Welcome to the forum Trams.
You may already be aware, but if you press the More… button in the Export dialog you will get more options. The same options are also available via the Export persona.
Using a Medium Quality JPEG takes an image size down quite a way without too much loss of detail but there’s no ‘Save for Web’ preset, as such, as far as I know.
I would be interested to know why there’s such a difference between the Photo and Photoshop file sizes too.
Your attached file is 331KB.
Exporting from Photo with JPEG Best Quality gives a 1.37MB image.
Exporting from Photo with JPEG High Quality gives a 459KB image.
Exporting from Photo with JPEG Medium Quality gives a 243KB image.
If the original JPEG is 331KB, where is the extra ‘stuff’ coming from in the Best and High Quality exports? Where is it getting the extra ‘detail’ (or whatever) from?

Link to comment
Share on other sites

11 hours ago, GarryP said:

I would be interested to know why there’s such a difference between the Photo and Photoshop file sizes too.
Your attached file is 331KB.

For me, the attached jpeg downloaded as a 921 x 1287 px, 340 KB (on disk) file. For a JPEG export set to 75% quality, the exported version is 380 to 384 KB, depending on if I include metadata & an ICC profile or not.

But because 8x8 block splitting is a step in the most commonly used JPEG compression encoding method, I wondered if it would make much difference if I very slightly changed the image by resampling it to 920 x 1288, the nearest multiple of 8 pixels to the original size. Sure enough, when I exported that at 75% quality, the file size when down to 342 KB (with no metadata or ICC profile included), just 2 KB larger than the file as it downloaded to my Mac.

All 3 1.10.8, & all 3 V2.4.1 Mac apps; 2020 iMac 27"; 3.8GHz i7, Radeon Pro 5700, 32GB RAM; macOS 10.15.7
Affinity Photo 
1.10.8; Affinity Designer 1.108; & all 3 V2 apps for iPad; 6th Generation iPad 32 GB; Apple Pencil; iPadOS 15.7

Link to comment
Share on other sites

APhoto is doing more to an image under the hood. Original JPEG quality was 85, so I exported the image in APhoto with this quality with no ICC or metadata. After that compared both in IrfanView. Main difference is marked on the attached image. Interesting is the fact, that there about 50.000 unique colours more in the image after the APhoto export. Where do these unique colours come from?

imagecomparison.jpg

------
Windows 10 | i5-8500 CPU | Intel UHD 630 Graphics | 32 GB RAM | Latest Retail and Beta versions of complete Affinity range installed

Link to comment
Share on other sites

  • 3 weeks later...

Hi everyone. Thank you very much for your posts. I was in holidays without any devices, so i can answer only today – digital detox :). The test of Joachim_L is very interesting, thank you for this. I am not a professional in this things, but perhaps anyone of AP team can answer his question?

Link to comment
Share on other sites

As an amateur webmaster, I was appalled at the quality of the images exported from Affinity for use on the web Without going into the detail that others have used. If I export images from Affinity to the same file size as the export from PS, they are absolutely unusable on the web.

Link to comment
Share on other sites

On 8/23/2019 at 2:50 AM, Joachim_L said:

Main difference is marked on the attached image. Interesting is the fact, that there about 50.000 unique colours more in the image after the APhoto export. Where do these unique colours come from?

One of the differences you noticed was that subsampling (2x2) was used for the original, but subsampling was off in the version that Affinity Photo produced.

Subsampling averages the color over a block of pixels, and only uses that average color in the output. Thus, for every 2x2 pixel block in the original, only one color was recorded. But with Affinity Photo, subsampling was not used, and thus eacj 2x2 pixel block could in theory give you 4 colors instead of 1.

-- Walt
Designer, Photo, and Publisher V1 and V2 at latest retail and beta releases
PC:
    Desktop:  Windows 11 Pro, version 23H2, 64GB memory, AMD Ryzen 9 5900 12-Core @ 3.00 GHz, NVIDIA GeForce RTX 3090 

    Laptop:  Windows 11 Pro, version 23H2, 32GB memory, Intel Core i7-10750H @ 2.60GHz, Intel UHD Graphics Comet Lake GT2 and NVIDIA GeForce RTX 3070 Laptop GPU.
iPad:  iPad Pro M1, 12.9": iPadOS 17.4.1, Apple Pencil 2, Magic Keyboard 
Mac:  2023 M2 MacBook Air 15", 16GB memory, macOS Sonoma 14.4.1

Link to comment
Share on other sites

3 hours ago, mpower9 said:

As an amateur webmaster, I was appalled at the quality of the images exported from Affinity for use on the web Without going into the detail that others have used. If I export images from Affinity to the same file size as the export from PS, they are absolutely unusable on the web.

The details are important, though, and in my opinion are needed if one is going to complain about quality.

Please provide an original image, and the resulting image saved from PS and also the one saved by Affinity Photo. Additionally, we would need screenshots of the basic Export dialog in Affinity Photo and also of the More dialog panel to see all the options you've chosen. Also any relevant screenshots of the PS export options would probably be useful.

That will help everyone determine whether the comparison is a fair one, and where any problem may be occurring.

-- Walt
Designer, Photo, and Publisher V1 and V2 at latest retail and beta releases
PC:
    Desktop:  Windows 11 Pro, version 23H2, 64GB memory, AMD Ryzen 9 5900 12-Core @ 3.00 GHz, NVIDIA GeForce RTX 3090 

    Laptop:  Windows 11 Pro, version 23H2, 32GB memory, Intel Core i7-10750H @ 2.60GHz, Intel UHD Graphics Comet Lake GT2 and NVIDIA GeForce RTX 3070 Laptop GPU.
iPad:  iPad Pro M1, 12.9": iPadOS 17.4.1, Apple Pencil 2, Magic Keyboard 
Mac:  2023 M2 MacBook Air 15", 16GB memory, macOS Sonoma 14.4.1

Link to comment
Share on other sites

6 hours ago, mpower9 said:

As an amateur webmaster, I was appalled at the quality of the images exported from Affinity for use on the web Without going into the detail that others have used. If I export images from Affinity to the same file size as the export from PS, they are absolutely unusable on the web.

I don't see any optimization features in the export dialog in Affinity Photo 1.7 nor any traces of optimization in the files it produces.

Photoshop performs better when saving in medium quality even with standard encoding. Choosing optimized (with optimized Huffman encoding) significantly reduces file sizes. The files from Photoshop attached looks much better. Much better.

What is also a life saver in Photoshop is a preview of the resulting image quality as you adjust the quality slider. Who knows the result of 70% before seeing the result?

Examples of a 8-bit TIFF gradient saved in various modes in Photoshop and Affinity Photo... in 100% quality and then 50%.

Out website has millions and millions of visitors every year. Every kilobyte matters bandwidth-wise. It obviously affects page loading speed as well. We have tons of images with bokeh - out of focus areas - and the JPG-rendering of those areas is critical. It has to look good and the file size must be as small as possible.

So Affinity Photo as of September 2019 for serious web use ... well, make your own conclusions based on your website and total bandwidth.

Examples attached. None generated by Save for web. Regular Save As and Export As.

Originals 50%

Originals 100%

image.png.2516315c3851a43322d98a3afc34aac0.png

image.png.c864bf5ce7e663f0e918588eaa68b367.png

  • "The user interface is supposed to work for me - I am not supposed to work for the user interface."
  • Computer-, operating system- and software agnostic; I am a result oriented professional. Look for a fanboy somewhere else.
  • “When a wise man points at the moon the imbecile examines the finger.” ― Confucius
  • Not an Affinity user og forum user anymore. The software continued to disappoint and not deliver.
Link to comment
Share on other sites

3 hours ago, mpower9 said:

As an amateur webmaster, I was appalled at the quality of the images exported from Affinity for use on the web Without going into the detail that others have used. If I export images from Affinity to the same file size as the export from PS, they are absolutely unusable on the web.

It would be useful to know what specifically it is about Affinity's (I presume) JPEG export capabilities that makes you think they are "absolutely unusable on the web." This is because JPEG "quality" is somewhat subjective & also depends on several factors like display size on web pages, browser settings & capabilities, and how compressible each image is to begin with.

Particularly regarding the compressibility factor, Affinity cannot compare to the semi-automated way this is done in Photoshop's "Save for Web" option, but it still should be possible to get reasonably similar results from Affinity, although it may involve several manual adjustments & some understanding of how lossy JPEG compression works. I can't find the link right now, but somewhere in Affinity-land there is an article about this.

Also, a little food for thought: Photoshop's "Save for Web" option has been relegated to "legacy" status, meaning it is no longer being developed & may be removed entirely in some future version. The reason given for this is because "the code is too antiquated to maintain and develop new features."

All 3 1.10.8, & all 3 V2.4.1 Mac apps; 2020 iMac 27"; 3.8GHz i7, Radeon Pro 5700, 32GB RAM; macOS 10.15.7
Affinity Photo 
1.10.8; Affinity Designer 1.108; & all 3 V2 apps for iPad; 6th Generation iPad 32 GB; Apple Pencil; iPadOS 15.7

Link to comment
Share on other sites

I NEVER used 'Save for web' in any program ever in life. Just regular save/export. Photoshop offers standard, optimized and progressive encoding in the save JPG dialog and 'Optimized' is vastly superior in all cases I tried.

Only two factors matter in the end: appearance and file size. And the latter matters when you are a professional: https://www.calculator.net/bandwidth-calculator.html - try using 40 mio visitors a year. That's what I am dealing with. See the difference between 30 and 40 KB.

Some image resizing may happen due to server side scaling (if enabled).

 'Save for web' was replaced with 'Export as' that I never use. But it too has a preview of the result.

image.thumb.png.d17f6cc64bafd6d02a5b720d3c828774.png

  • "The user interface is supposed to work for me - I am not supposed to work for the user interface."
  • Computer-, operating system- and software agnostic; I am a result oriented professional. Look for a fanboy somewhere else.
  • “When a wise man points at the moon the imbecile examines the finger.” ― Confucius
  • Not an Affinity user og forum user anymore. The software continued to disappoint and not deliver.
Link to comment
Share on other sites

26 minutes ago, Jowday said:

Only two factors matter in the end: appearance and file size.

OK, but appearance in turn depends in part also on the device & browser or other user agent used to view the image, not just server side resizing.

Obviously, Photoshop provides much better support for coping with that than does Affinity, but neither one is a complete solution. Besides, Serif has not to my knowledge claimed any Affinity app provided more than prototyping support for graphics for web page designers, so it seems a bit much to criticize it on that basis.

All 3 1.10.8, & all 3 V2.4.1 Mac apps; 2020 iMac 27"; 3.8GHz i7, Radeon Pro 5700, 32GB RAM; macOS 10.15.7
Affinity Photo 
1.10.8; Affinity Designer 1.108; & all 3 V2 apps for iPad; 6th Generation iPad 32 GB; Apple Pencil; iPadOS 15.7

Link to comment
Share on other sites

12 minutes ago, Fixx said:

C'mon, AP is meant for basic graphic tasks, so it should be able to export viable JPEG graphics for web use. Currently it seems JPEG quality/size is not quite good enough.

Right to the point, Fixx. Exactly. 

  • "The user interface is supposed to work for me - I am not supposed to work for the user interface."
  • Computer-, operating system- and software agnostic; I am a result oriented professional. Look for a fanboy somewhere else.
  • “When a wise man points at the moon the imbecile examines the finger.” ― Confucius
  • Not an Affinity user og forum user anymore. The software continued to disappoint and not deliver.
Link to comment
Share on other sites

19 minutes ago, Fixx said:

C'mon, AP is meant for basic graphic tasks, so it should be able to export viable JPEG graphics for web use. Currently it seems JPEG quality/size is not quite good enough.

It is quite capable of exporting JPEG graphics that are viable for web use. But it can't optimize size vs. quality as well as some other apps can, nor does it have a preview mode to help determine the best quality setting.

Because as you say, it is not quite good enough for that, I use a third party app called ImageOptim (Mac only) for that. It has all the optimization options I could hope for, is very fast & easy to use, uses very little memory, does batch processing, & even has a CLI interface. I discovered very quickly that exporting my JPEGs from Affinity at 85% quality (& the equivalent in other apps) & running them through this app produces very good results. I can even automate this using a couple of Mac OS scripting features so I never have to do anything manually other than save the exports to a designated folder.

So at least for me, it is all about picking the right tool for the job -- & that often means using more than one app to do it right.

All 3 1.10.8, & all 3 V2.4.1 Mac apps; 2020 iMac 27"; 3.8GHz i7, Radeon Pro 5700, 32GB RAM; macOS 10.15.7
Affinity Photo 
1.10.8; Affinity Designer 1.108; & all 3 V2 apps for iPad; 6th Generation iPad 32 GB; Apple Pencil; iPadOS 15.7

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
×
×
  • Create New...

Important Information

Terms of Use | Privacy Policy | Guidelines | We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.