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

How are huge differences in PDF file sizes based on these drawing techniques?


Recommended Posts

The attached Affinity Designer project illustrates how different drawing techniques can result in pdf export files that differ is size substantially.  I discovered this while developing images that are to used in an iOS app.  Of course, we can expect the size of the pdf file to impact the performance of the app.  

The attached AD project has three artboards.  Each artboard has a separate drawing of a flower - all of which look much the same:

  • Yellow-Flower:  The pdf for web file size is 282 KB.

Each of the twelve petals is a separate curve object with yellow fill and a black stroke.  The inner pistils is comprised of 27 brown ellipses imbedded inside a single black eclipse. 

  • Red-Flower:  The pdf for web file size is 31 KB.

The twelve petals is comprised four curve objects (each represent three leaves) with red fill and black stroke .  The inner pistils is comprised of 27 brown ellipses imbedded inside a single black eclipse.  (Same as yellow flower.)

  • Blue-Flower: The pdf for web file size is 176 KB.

The twelve petals is comprised four curve objects (each represent three leaves) with blue fill and black stroke (same as red flower).  The inner pistils is comprised of a single black curve imbedded inside a single brown ellipse.   

Why are these file sizes so different?

The yellow flower has only nine additional petal curve objects compared to the red flower.  Yet, the pdf file size is also nine times the size.  Note, the the pistils are the same.

The blue flower uses the same petals as the red flower.  However the pistils were refactored into only two objects, one complex curve and one ellipse.  The complex object was created by subtracting the 27 ellipses from a single ellipse.  The result of this distillation of the pistils causes the pdf file size to grow from 32 KB to 180 KB.

is there a knowledge-based article that will help me understand why this occurs and how to avoid these problems during design?

Flower-Yellow.pdf

Flower-Blue.pdf

Flower-Red.pdf

Flowers.afdesign

Edited by billm
completion
Link to comment
Share on other sites

  • Staff
5 minutes ago, billm said:

Are the attachments there now?  It looks like it to me.

 

Flower-Blue.pdf

Flower-Red.pdf

Flower-Yellow.pdf

Flowers.afdesign

Yes thank you I will look into this now however I will be leaving the office shortly so you might not receive a response until tomorrow I'm afraid.

Please tag me using @ in your reply so I can be sure to respond ASAP.

Link to comment
Share on other sites

Interesting question, indeed. In the meantime (not as answer to the differences but related): usually a PDF contains data, which are not fundamentally necessary to display or print the content. If you get rid of them you can achieve PDFs with obviously smaller file sizes. (and possible merged items when opening one of them in AfDesigner)

Flower-Yellow_opt.pdf
Flower-Blue_opt.pdf
Flower-Red_opt.pdf

515879752_flowersoptfilesizes.jpg.c37defd27679f26582f67b7b9bb908b7.jpg

Again, there still are differences. Looking forward to Callums reply.

macOS 10.14.6 | MacBookPro Retina 15" | Eizo 27" | Affinity V1

Link to comment
Share on other sites

Here is another example.  This AD project has two artboards, each with a spiral.  The first black spiral was created using an asset that was downloaded from here (sorry, I don't remember where exactly.) I created the second pink spiral by hand.  Export the pdf's and you'll find the black spiral is 25 KB and the pink spiral is 3 KB.  Why?  They are essentially the same spiral except for the color.  The only other difference that I'm aware of is that the black spiral has 10 nodes and slightly better symmetry while my pink spiral has only 9 nodes and is not quite as smooth.

 

Spirals.afdesign

Spiral-Pink.pdf

Spiral-Black.pdf

Link to comment
Share on other sites

It is not a PDF format issue - same pattern in file sizes when you export to SVG.

  • "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

  • Staff

I'd imagine this is happening because of the compositional difference between the designs. There are a lot of nodes in the black space around the dots in the in blue flower this will add to the file size. It also looks as though the yellow flower is comprised of more groups which will increase file size.

Please tag me using @ in your reply so I can be sure to respond ASAP.

Link to comment
Share on other sites

I am hoping that you can identify the differences that add to the file size.  It would be nice to know the cost of these differences and any more economical choices that would yield better designs.

The yellow flower has a warning sign in the export persona slices window.  It says: "The Slice has duplicate paths."

A new version of the flowers.afdesign tests a couple of your theories.  

The green flower is duplicate of the blue flower.  It has the same number of nodes in the pistils.  But, on the pistil, I removed the black stoke and left only the black fill.  The pdf file size went from 180 KB down to 47 KB.  So, the unneeded strokes where very costly.

I duplicated Flower-Yellow to create Flower-Orange and Flower-Purple.  These were used to test theory regarding the number of groups.  The purple flower has 12 separate petal curves, removing the four groups. The purple and yellow exported pdf file sizes are the same at 289 KB.  So, removing unneeded groups did not show any benefit.

The Orange flower is an exact duplicate (except for color) as the Yellow flower.  I included this flower so that you can observe an anomaly that I discovered.  Open the orange flower and within the petals group, select Group1 and then click Ungroup.  Notice that two of the visible petals seem to disappear.  This anomaly also occurs if Group2 is Ungrouped.  The result of ungrouping all three petal groups yields 12 petals with 9 petals visible and 3 petals hidden behind others.  I believe this causes the warning sign on the export slice.  Interestingly though, the yellow flower does not hide 3 petals when grouped, even on the exported pdf rendering.

Note, the purple flower was created by duplicating the petals in each group and then dragging those outside of the original group.  Finally, deleting the groups.  The end result was 12 petals, all of which remain visible.

Callum, thanks for your help and please let me know if there is any information available that addresses economy-of-scale in file size reduction as a result of choosing more efficient design practices. 

Flowers.afdesign

Link to comment
Share on other sites

Here is yet another peculiar example.  The attached project contains six artboards each which has a single curve that represents a curly strand of hair.  Each strand and artboard varies the size of the stroke.  Upon export to pdf for web the stroke and file sizes are as follows:

  • 2.0 = 3 kb
  • 2.1 = 3 kb
  • 2.5 = 3 kb
  • 2.6 = 35 kb
  • 2.9 = 35 kb
  • 3.0 = 35 kb

Why does the pdf file size grow from 3 to 35 given such a small change in the curve?

 

a3-0.pdf

a2-9.pdf

a2-6.pdf

a2-5.pdf

a2-1.pdf

a2-0.pdf

HairCurl.afdesign

Link to comment
Share on other sites

On 9/19/2019 at 9:23 AM, thomaso said:

Interesting question, indeed. In the meantime (not as answer to the differences but related): usually a PDF contains data, which are not fundamentally necessary to display or print the content. If you get rid of them you can achieve PDFs with obviously smaller file sizes. (and possible merged items when opening one of them in AfDesigner)

Again, there still are differences. Looking forward to Callums reply.

Thanks for the tip.  How did you go about optimizing the files?

Link to comment
Share on other sites

On 9/20/2019 at 5:11 AM, Callum said:

I'd imagine this is happening because of the compositional difference between the designs. There are a lot of nodes in the black space around the dots in the in blue flower this will add to the file size. It also looks as though the yellow flower is comprised of more groups which will increase file size.

Hi Callum,

Do you any further analysis of this issue? Clearly there are compositional differences - like the 2.5 versus 2.6 stoke width on the curly hair - but why would that result in a content stream within the pdf file that is 10x larger?  I'm new to the forum and don't know if I should expect you to provide a conclusion on the matter.

Regards,

B~
 

Link to comment
Share on other sites

  • Staff

What BofG has stated is correct. If you look at my below screenshots comparing the imported from PDF versions of A3-0 and A2-0 you will see that there are many many more nodes in the a3-0 version this will cause the ballooning file size. I'm looking into how to prevent this now

Screenshot 2019-09-23 at 14.48.42.png

Screenshot 2019-09-23 at 14.48.36.png

Please tag me using @ in your reply so I can be sure to respond ASAP.

Link to comment
Share on other sites

Well gentleman, thanks - you have confirmed that the PDF files are very different.  However, the most important question remains:

Why does Affinity Designer create hugely different PDF files based upon very small differences in the lines within the artboards?  I hope Callum can find the solution.

Open the HairCurl.afdesign and you'll see that the difference is merely the stroke width.

Link to comment
Share on other sites

  • Staff
34 minutes ago, billm said:

Well gentleman, thanks - you have confirmed that the PDF files are very different.  However, the most important question remains:

Why does Affinity Designer create hugely different PDF files based upon very small differences in the lines within the artboards?  I hope Callum can find the solution.

Open the HairCurl.afdesign and you'll see that the difference is merely the stroke width.

The file size is due to the amount of nodes created during export. You can get around this by removing and re applying the Mitre on the stroke. It looks as though this is a bug.

Please tag me using @ in your reply so I can be sure to respond ASAP.

Link to comment
Share on other sites

  • Staff

The flowers file is due to the compositional differences I pointed out. The amount of nodes visible in my first screenshot is the cause of the Blue flowers large file size.The yellow flower is bigger because each petal is its own individual shape where as the ones in the other flowers have been combined which reduces number of layers, individual strokes / fills etc.

C

Screenshot 2019-09-23 at 14.31.30.png

Screenshot 2019-09-23 at 14.34.47.png

Please tag me using @ in your reply so I can be sure to respond ASAP.

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.