Defer Font Loading #46
Open
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
|
Chrome developer tools has a really nice new "visualizer" that shows you a timeline of what the page looks like so you can get an idea of what loads and when. This might be a good pattern to use to introduce students to the critical rendering path and how to optimize content delivery. Also, they could push up to gh-pages before optimizing. Do a Google Page Speed Insights test. Note their score. Optimize. Push. Test again. And get a sense for how their delivery and SEO score was improved. |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
As is, the entire font has to download (from another domain) before any of the stylesheet is loaded and long before any HTML content is delivered. In other words, the font delays interface from becoming usable. Usually this is unintended, so this may be a good opportunity to introduce this defer font pattern.
Closes #43
We also are not setting media on the
<link>for the stylesheet, which seems like another issue. We probably should be doing that, even if it is just to set it to"all".