Closed
Bug 1150118
Opened 10 years ago
Closed 8 years ago
Lazyload tabzilla.css and MDN fonts
Categories
(developer.mozilla.org Graveyard :: Performance, enhancement)
developer.mozilla.org Graveyard
Performance
Tracking
(Not tracked)
RESOLVED
FIXED
People
(Reporter: shobson, Unassigned)
Details
Lazy load tabzilla.css and the MDN fonts.
Requirements for font lazy loading:
- prefer if fallback displays on first visit and web font displays on second (no FOUT, all UT and then no UT.)
- create very close fallback fonts so that difference is not immediately evident.
Comment 1•10 years ago
|
||
I remember lazyloading the CSS a while back but it did a wicked, wicked repaint or something else weird. I don't know that this is an option without changes to Tabzilla.
Reporter | ||
Comment 2•10 years ago
|
||
I think we'll have to copy a few lines of their CSS into our CSS, but I'm okay with that.
Updated•10 years ago
|
Severity: normal → enhancement
OS: Mac OS X → All
Hardware: x86 → All
Comment 3•10 years ago
|
||
Commits pushed to master at https://github.com/mozilla/kuma
https://github.com/mozilla/kuma/commit/b13892846fe678243299b5a2f84144e9e7893ba3
Bug 1150118 - Lazy load fonts
Some clean up in anticipation of changes to font stuff:
- Use variable to set font family
- Use mixin to set font size
- Added Arial to fallback list (more size appropriate than Helvetia which is Mac sans-serif default)
- Line-height and letter-spacing should be relative to font-size not pixels
https://github.com/mozilla/kuma/commit/0b0eeedd723e05d72afb5d108a4dce69c679ea67
Merge pull request #3168 from stephaniehobson/BUG-1150118-lazyload-fonts
Bug 1150118 - Lazy load fonts
Comment 4•10 years ago
|
||
Commits pushed to master at https://github.com/mozilla/kuma
https://github.com/mozilla/kuma/commit/94b3ddb43bf54a3048ff113b4dedb53a48451a6e
Bug 1150118: Lazyload Tabzilla
Added necessary CSS to MDN sheets to prevent repaints as tabzilla js and css load.
https://github.com/mozilla/kuma/commit/e999b23294f4d8392461ac9ebf2f6a90da2614d9
bug 1150118 - Ensure tabzilla link does not display until after load
Reporter | ||
Comment 5•10 years ago
|
||
:gerv I could use a 3rd opinion on the inclusion of the Font Face Observer library in the MDN. The original repo is here: https://github.com/bramstein/fontfaceobserver I copied only fontfaceobserver-standalone.js from the repo but the file did not include the license so I added the license into the file. I need to double check that 1) the license is compatible with MDN and 2) I am adhering to it.
PR with details and links here:
https://github.com/mozilla/kuma/pull/3192#discussion_r28984443
Thanks!
Flags: needinfo?(gerv)
Comment 6•10 years ago
|
||
shobson: the file you copied is minified. It seems to me that we should take the unminified file into the tree as well, even if we don't link to it anywhere.
Adding the license to the top of the file(s) makes good sense, unless you create a subdir and put the files in it along with a LICENSE file. However, you seem to have added the copyright line, not the license text itself. You either need to add the contents of this:
https://github.com/bramstein/fontfaceobserver/blob/master/LICENSE
in a comment at the top (which doesn't fit well with minification), or do the subdirectory thing and add something like:
BSD License - see LICENSE file
to the minified file.
Hope that helps,
Gerv
Flags: needinfo?(gerv)
Comment 7•10 years ago
|
||
Commits pushed to master at https://github.com/mozilla/kuma
https://github.com/mozilla/kuma/commit/d32979b8b74e452cc03ec448ba694707c177285b
Bug 1150118 - Lazy load fonts
Added FontFaceObserver library.
Added python to check for cookie to speed up loading fonts.
Hand crafted fallback font declarations for several font declarations.
Removed MozTT declarations from opensans.styl file.
ToDo:
- get Y/N go ahead
- waffle
- find solution for javascript disabled
- check licence on FFO
https://github.com/mozilla/kuma/commit/2de7605125b7f6ac160e8c03e788f5c393cae41d
Merge pull request #3192 from stephaniehobson/BUG-1150118-lazyload-fonts
Bug 1150118 - lazyload fonts
Comment 8•10 years ago
|
||
Commits pushed to master at https://github.com/mozilla/kuma
https://github.com/mozilla/kuma/commit/c77f6da3037287c3e41ae91ac0ea95329ff323b6
Bug 1150118: Dropping time out to 2 seconds
Let's experiment with this for a week. It's not quite the "Can we just not swap out the fonts on first load" some people are asking for but it decreases how far someone can get before the swap happens, if it happens at all.
https://github.com/mozilla/kuma/commit/3c293f921bdbad4d70833bf8c67c5c791625cf44
Merge pull request #3224 from stephaniehobson/BUG-1150118-lazyload-fonts
Bug 1150118: Dropping time out to 2 seconds
Comment 9•10 years ago
|
||
Commits pushed to master at https://github.com/mozilla/kuma
https://github.com/mozilla/kuma/commit/397b78815150ab642f60d1262fb649a7805991d0
bug 1150118 - JavaScript code quality updates
https://github.com/mozilla/kuma/commit/8f3241ddf5563d235f319fda51701825ab977f1e
Merge pull request #3225 from darkwing/1150118-fonts
bug 1150118 - JavaScript code quality updates
Reporter | ||
Comment 10•10 years ago
|
||
We've got a technique for this decided and working for open sans and open sans light :)
Still to do:
- Open Sans Extra Bold
- remove code relating to waffling the behaviour.
Comment 11•10 years ago
|
||
Commits pushed to master at https://github.com/mozilla/kuma
https://github.com/mozilla/kuma/commit/9e44bc7562b99d5deafd47cd6563e962d99b27de
Bug 1150118 - fixing munged variable name
https://github.com/mozilla/kuma/commit/6d90a1204a3d5d7645f355c71f8e2c6fd52772cd
Merge pull request #3275 from stephaniehobson/bug-1150118-lazyload-fonts
Bug 1150118 - fixing munged variable name
Comment 12•10 years ago
|
||
Commits pushed to master at https://github.com/mozilla/kuma
https://github.com/mozilla/kuma/commit/408dbca3782c1b9e479a3bef755aa18063d33527
bug 1150118 - A bit of JS cleanup
https://github.com/mozilla/kuma/commit/ff9310d2e1b9965715206dc4befc42d42a98d1ac
Merge pull request #3283 from darkwing/1150118-cleanup
bug 1150118 - A bit of JS cleanup
Reporter | ||
Comment 13•8 years ago
|
||
The new redesign removes Open Sans Extra Bold from the site and the new zilla font is lazy loaded.
Status: NEW → RESOLVED
Closed: 8 years ago
Resolution: --- → FIXED
Comment 14•8 years ago
|
||
Commit pushed to master at https://github.com/mozilla/kuma
https://github.com/mozilla/kuma/commit/4aed0cd374de8da4d7617ed6d2dfe7c878201cfa
Bug 1150118: Fix lazy loading fonts (#4482)
- repair zilla fallback font declaration
- switch to mixin for all font-family declarations
Updated•5 years ago
|
Product: developer.mozilla.org → developer.mozilla.org Graveyard
You need to log in
before you can comment on or make changes to this bug.
Description
•