Image optimize

[PeterDaveHello]

Optimize images losslessly to save to bandwidth to transfer :)

 resources/join/gifts-bag-large.jpg    | Bin 38927 -> 38866 bytes
 resources/join/gifts-bag-small.jpg    | Bin 6388 -> 6369 bytes
 resources/join/gifts-hoodie-large.jpg | Bin 34726 -> 34673 bytes
 resources/join/gifts-hoodie-small.jpg | Bin 5456 -> 5442 bytes
 resources/join/gifts-tshirt-large.jpg | Bin 30254 -> 30217 bytes
 resources/join/gifts-tshirt-small.jpg | Bin 5631 -> 5602 bytes

 resources/banners/bronze.png                 | Bin 9858 -> 3604 bytes
 resources/banners/diamond.png                | Bin 6918 -> 3488 bytes
 resources/banners/gold.png                   | Bin 9567 -> 3461 bytes
 resources/banners/platinum.png               | Bin 9798 -> 3592 bytes
 resources/banners/silver.png                 | Bin 9725 -> 3559 bytes
 resources/board/stevenewcomb.png             | Bin 36232 -> 18714 bytes
 resources/credit-card/jquery-credit-card.png | Bin 67928 -> 62148 bytes
 resources/home/bank-of-america-logo.png      | Bin 2761 -> 1588 bytes
 resources/home/dell-logo.png                 | Bin 1454 -> 740 bytes
 resources/home/ibm-logo.png                  | Bin 4807 -> 3036 bytes
 resources/home/icn-fan.png                   | Bin 6154 -> 2822 bytes
 resources/home/icn-friend.png                | Bin 9315 -> 4046 bytes
 resources/home/icn-hero.png                  | Bin 5378 -> 2391 bytes
 resources/home/icn-jquery-logo.png           | Bin 49535 -> 1137 bytes
 resources/home/icn-jquerymobile-logo.png     | Bin 5137 -> 2052 bytes
 resources/home/icn-qunit-logo.png            | Bin 5529 -> 2060 bytes
 resources/home/icn-sizzle-logo.png           | Bin 6103 -> 5295 bytes
 resources/home/icn-ui-logo.png               | Bin 1949 -> 1004 bytes
 resources/home/media-temple-logo.png         | Bin 1207 -> 1077 bytes
 resources/home/wordpress-logo.png            | Bin 1884 -> 1681 bytes
 resources/join/fan-128x128.png               | Bin 9123 -> 4108 bytes
 resources/join/friend-128x128.png            | Bin 9659 -> 4319 bytes
 resources/join/hero-128x128.png              | Bin 9730 -> 4261 byte
 resources/members/10up.png                   | Bin 2703 -> 1612 bytes
 resources/members/adobe.png                  | Bin 6368 -> 4151 bytes
 resources/members/adzerk.png                 | Bin 6585 -> 2684 bytes
 resources/members/agilefaqs.png              | Bin 15579 -> 11972 bytes
 resources/members/apigee.png                 | Bin 3795 -> 2612 bytes
 resources/members/appendto.png               | Bin 3282 -> 2339 bytes
 resources/members/barewalls.png              | Bin 2075 -> 1185 bytes
 resources/members/bitovi.png                 | Bin 2923 -> 1097 bytes
 resources/members/blackberry.png             | Bin 2488 -> 1930 bytes
 resources/members/bocoup.png                 | Bin 16657 -> 6575 bytes
 resources/members/browserstack.png           | Bin 9613 -> 6473 bytes
 resources/members/chameleonjohncom.png       | Bin 20085 -> 18159 bytes
 resources/members/codeschool.png             | Bin 4282 -> 2658 bytes
 resources/members/davinci.png                | Bin 8528 -> 4311 bytes
 resources/members/dealspotr.png              | Bin 2570 -> 2301 bytes
 resources/members/dequesystems.png           | Bin 25300 -> 19562 bytes
 resources/members/environmentsforhumans.png  | Bin 30762 -> 24163 bytes
 resources/members/famous.png                 | Bin 8127 -> 3692 bytes
 resources/members/fan-120x120.png            | Bin 5870 -> 3986 bytes
 resources/members/filamentgroup.png          | Bin 5244 -> 4090 bytes
 resources/members/fortpointlegal.png         | Bin 4327 -> 2145 bytes
 resources/members/friend-120x120.png         | Bin 6321 -> 4186 bytes
 resources/members/frontendmasters.png        | Bin 18625 -> 14083 bytes
 resources/members/hero-120x120.png           | Bin 6374 -> 4141 bytes
 resources/members/ibm.png                    | Bin 3462 -> 1669 bytes
 resources/members/intel.png                  | Bin 4541 -> 3271 bytes
 resources/members/itmozgru.png               | Bin 11049 -> 7827 bytes
 resources/members/kendoui.png                | Bin 8000 -> 6466 bytes
 resources/members/maxcdn.png                 | Bin 14585 -> 11260 bytes
 resources/members/mediatemple.png            | Bin 11498 -> 8528 bytes
 resources/members/mozilla.png                | Bin 2516 -> 1953 bytes
 resources/members/naver.png                  | Bin 2362 -> 1312 bytes
 resources/members/neobux.png                 | Bin 7036 -> 4844 bytes
 resources/members/nisimheletz.png            | Bin 28946 -> 26904 bytes
 resources/members/ppedv.png                  | Bin 109208 -> 3537 bytes
 resources/members/serenataflowerscom.png     | Bin 68481 -> 61028 bytes
 resources/members/sitepen.png                | Bin 5564 -> 2751 bytes
 resources/members/syncfusion.png             | Bin 2822 -> 1992 bytes
 resources/members/wordpress.png              | Bin 7390 -> 4818 bytes

[AurelioDeRosa]

Hi @PeterDaveHello.

Thank you for your PR, saving bandwidth for our users is certainly important. However, this process should be automated by using a Grunt task since we've already Grunt in place (unless we're already doing something on the server which I'm missing @gnarf).

Can you send a PR based on my suggestion?

[PeterDaveHello]

@AurelioDeRosa I know automated progress is important, but I wonder how often the images will be changed? Especially members image, I have this question because the png optimization using zopflipng will take a long time, if you tried it, you will know, that will totally slow down the whole build process, if the images are not changed so often, isn't pre-compression acceptable?

[gnarf]

I'd agree that automation isn't that important here, but adding some notes about good compression tactics to the readme/contribute sites would probably be a good idea... On Apr 17, 2016 1:56 AM, "Peter Dave Hello" notifications@github.com wrote:

@AurelioDeRosa https://github.com/AurelioDeRosa I know automated progress is important, but I wonder how often the images will be changed? Especially members image, I have this question because the png optimization using zopflipng will take a long time, if you tried it, you will know, that will totally slow down the whole build process, if the images are not changed so often, isn't pre-compression acceptable?

— You are receiving this because you were mentioned. Reply to this email directly or view it on GitHub https://github.com/jquery/jquery.org/pull/121#issuecomment-210961055

[AurelioDeRosa]

@gnarf What do you mean by the tactic used? Something like the tool adopted, the compression type, or the lossless compression vs non-lossless compression?

[PeterDaveHello]

I can add a note in readme to talk about the tools and parameters I used to do the compression :smile:

[gnarf]

Yup, basically we should have a guide about this, and spread info to the rest of @jquery/content when landing new images or image changes On Apr 17, 2016 10:43 AM, "Peter Dave Hello" notifications@github.com wrote:

I can add a note in readme to talk about the tools and parameters I used to do the compression [image: :smile:]

— You are receiving this because you were mentioned. Reply to this email directly or view it on GitHub https://github.com/jquery/jquery.org/pull/121#issuecomment-211034386

[PeterDaveHello]

@gnarf where should I put the guide? The readme in this repo?

[gnarf]

I think this would be more of a contribute thing... On Apr 18, 2016 12:46 AM, "Peter Dave Hello" notifications@github.com wrote:

@gnarf https://github.com/gnarf where should I put the guide? The readme in this repo?

— You are receiving this because you were mentioned. Reply to this email directly or view it on GitHub https://github.com/jquery/jquery.org/pull/121#issuecomment-211199193

[arschmitz]

I agree with @AurelioDeRosa i would prefer an automated approach. If this was truely just about jquery.org it would be fine but this effects all the websites. Most of the websites are also not maintained by @jquery/content but by individual team's members, and community contributions. If we just put this in readme it would have to go in every sites readme and would still likely be forgotten and ignored quickly.

As for concerns about build time. Its fairly simple to setup a task to only run on files which have changed. Also given how often these sites are updated i don't think build time is a huge concern.

[gnarf]

So sometimes the best optimization is a different format image entirely, like using a PNG24 when you have a simple color pallette that fits in a gif... I don't think this is an automated solution, this is an education and external tooling problem... The tools already exist, you just need to remember to use them... Perhaps if you want an automation, a warning about images that are large or something similar. Also not all images need the same levels of compression, etc. On Apr 18, 2016 9:46 AM, "Alexander Schmitz" notifications@github.com wrote:

I agree with @AurelioDeRosa https://github.com/AurelioDeRosa i would prefer an automated approach. If this was truely just about jquery.org it would be fine but this effects all the websites. Most of the websites are also not maintained by @jquery/content https://github.com/orgs/jquery/teams/content but by individual team's members, and community contributions. If we just put this in readme it would have to go in every sites readme and would still likely be forgotten and ignored quickly.

As for concerns about build time. Its fairly simple to setup a task to only run on files which have changed. Also given how often these sites are updated i don't think build time is a huge concern.

— You are receiving this because you were mentioned. Reply to this email directly or view it on GitHub https://github.com/jquery/jquery.org/pull/121#issuecomment-211386479

[mgol]

Do we have any final decision here? This PR is stale now.

[PeterDaveHello]

Let's just close it.