Front-end perf of mozilla.org homepage could use improvement

RESOLVED INVALID

Status

www.mozilla.org
General
RESOLVED INVALID
4 years ago
a year ago

People

(Reporter: cvan, Unassigned)

Tracking

(Blocks: 1 bug)

Production

Firefox Tracking Flags

(Not tracked)

Details

(Whiteboard: [kb=1605165] , URL)

(Reporter)

Description

4 years ago
First off, apologies for not breaking this up into separate bugs. I noticed a few things while looking in the Network tab, so I thought I'd file.

https://www.dropbox.com/s/hi9q8x8oqtlvwka/Screenshot%202014-10-13%2020.14.08.png?dl=0

* Things seem to take a while to load.

* I have the "Open Sans" fonts installed; why is every weight of the font being downloaded? Are local `src` and correct font-families being set?

* The "Open Sans" fonts are not being gzip'd:

    https://www.dropbox.com/s/5uh1vedx8jlvlp7/Screenshot%202014-10-13%2020.15.32.png?dl=0

The proper request headers are being sent, but the CDN ain't doing it.

* Optimizely is blocking execution of all the HTML below the `<script>` in `<head>`.

* None of the Optimizely XHRs seem to be returning gzip'd JSON responses:

    https://www.dropbox.com/s/7p9cd3mp9dbtddw/Screenshot%202014-10-13%2020.28.00.png?dl=0

* Images should be resized to the dimensions they are rendered at. See this one:

    https://mozorg.cdn.mozilla.net/media/img/home/panel/lightbeam/logo-lightbeam-hires.png

    A 942px image is being sent down the wire, when only a 680px one is needed for Retina (2x DPI displays).
* Images should be web optimised/crushed. 515 KB of images is a lot to load the homepage. This one alone is 114KB:

    https://mozorg.cdn.mozilla.net/media/img/home/panel/lightbeam/logo-lightbeam-hires.png

    You can use tools like pngcrush and pngquant to losslessly compress PNGs.

* CSS gradients should be used when possible. This one, for example, could be recreated with an organge CSS gradient and a tiny 10x10 grain image as a repeating background-image:

    https://mozorg.cdn.mozilla.net/media/img/home/panel/fxdesktop/background.jpg
(Reporter)

Comment 1

4 years ago
https://cdn.optimizely.com/js/246059135.js is cached for only 2 minutes. Optimizely might have a reason for this, but that seems a tad low - because that can really negative page speed across the site (especially since most other Mozilla resources on the site are 304 NOT MODIFIED on subsequent loads).
(Reporter)

Updated

4 years ago
See Also: → bug 1082319

Updated

4 years ago
Component: Webdev → General
OS: Mac OS X → All
Product: mozilla.org → www.mozilla.org
Hardware: x86 → All
Version: other → Production
Hi Alex-

For our future iterations/improvements list.

Thx,
Jen
This bug is specifically referencing parts of the old home page, however certain things such as font downloading and Optimizely are still relevant, and applicable to the whole of mozilla.org in general.

Updated

4 years ago
Blocks: 1107980

Updated

4 years ago
Whiteboard: [kb=1605165]
This bug is now so old it references the home page design that was active 2 major revisions ago. We now also use different fonts to Open Sans. The only thing that remains is use of Optimizely. If still relevant we should file a separate performance bug for it (or for any performance issues on the current home page).
Status: NEW → RESOLVED
Last Resolved: a year ago
Resolution: --- → INVALID
You need to log in before you can comment on or make changes to this bug.