824331 - Optimize uploaded image attachments in an offline queue

Status: RESOLVED WONTFIX

(developer.mozilla.org Graveyard :: File attachments, defect, P3)

Description

[Jean-Yves Perrier [:teoli]]

Images created by tools like Office, OpenOffice, LibreOffice are far from being optimized for size.

I checked images I added to the MDN and I was able to reach 40 - 67% reduction of size, without lowering the quality, using a tool like ImageOptim.

These tools work by using different compression methods, by removing file comments (like "Creating using Microsoft Office") and large color profiles (unnecessary in most cases).

We should do this on the server side each time we upload such an image. (It can be done in an asynchronous way, btw)

On a primed cache (except for the page content), it may be a significant reduction of loading times as content images represent most of the data to be transferred (w/ the HTML file itself)

Comment 1

[[github robot]]

Commits pushed to master at https://github.com/mozilla/kuma

https://github.com/mozilla/kuma/commit/34e30c4be56b9869cafb30c5a600031ffe7a9ab2
fix bug 824331 - Crush images

https://github.com/mozilla/kuma/commit/e5ac8f902d1dc5491f3b7f19190f7e236b57ecf1
Merge pull request #783 from darkwing/lossless-images

fix bug 824331 - Crush images

Comment 2

[Jean-Yves Perrier [:teoli]]

I'm reopening. Though useful, the commit only crush existing styling images. It doesn't handle the bazillions images added via the wiki interface in the past and the future.

Comment 3

[David Walsh :davidwalsh]

This is being kept open for attachments?

Comment 4

[Les Orchard [:lorchard]]

Renaming the bug. Doing this as a one-shot on core site images is one thing, but setting up an image processing chain on attachment uploads is another enormous beast entirely. We'd have to reliably detect images, and then set up a Celery queue to chew through uploads with some sort of optimizer.

Comment 5

[Isac Lagerblad (:icaaq)]

maybe https://github.com/JamieMason/ImageOptim-CLI would be a good optimizer?

Comment 7

[sethladd]

Compressing images, especially PNGs, can dramatically improve PageSpeed scores. Also, here's another report that shows the benefits of faster page load times: http://www.portent.com/blog/internet-marketing/research-site-speed-hurting-everyones-revenue.htm

Thanks for keeping this on your radar!

Comment 8

[Sheikh Mohammad Bilal]

Compressing the images Jpegs & PNG's is the most important aspect of ON Page SEO you need to compress images and also follow the steps here to have a great on page optimized page , also use Moz Bar to verify your SEO On Page Score , Follow Steps For On Page Optimization and Pagespeed Google Improvement here https://sitesmatrix.com/blog/category/seo-marketing/web-inpage-seo-tips/

Comment 9

[BMO Automation]

MDN Web Docs' bug reporting has now moved to GitHub. From now on, please file content bugs at https://github.com/mdn/sprints/issues/ and platform bugs at https://github.com/mdn/kuma/issues/.