Mkdocs-material: Great Layout and functionality but real bad pagespeed rating

Created on 1 Mar 2018 · 4Comments · Source: squidfunk/mkdocs-material

Description

Coming from HUGO I stumbled over the real impressive mkdocs-material.
Before switching over to the mkdocs world I made a quick pagespeed test (see blow) and was a bit dissapointed by the figures (73 mobile, 46 desktop).

Expected behavior

Clients nowadays demand loading times of less than 3 seconds with a pagespeed rating of at least 85.

Actual behavior

PageSpeed Insights

Question

Can "mkdocs-material" be improved with respect to render-blocking?

proposal

Source

dbdevtop

All 4 comments

Thanks for reporting. I did a pagespeed test some while ago and it had the same result. I try to explain the penalties:

Eliminate render-blocking JavaScript and CSS in above-the-fold content: for JavaScript this could theoretically be omitted by moving modernizr.js to the bottom of the body right above the application.js . It's possible as Material is entirely built using progressive enhancement, but I don't know if it will greatly improve rendering. Extracting the above-the-fold CSS is not really possible, as "above the fold" can be the entire page, see:

bildschirmfoto 2018-03-01 um 18 59 33

Leverage browser caching: this is entirely attributed to the cache headers of GitHub pages. The theme can't do anything about these values. If you self-host, you can eliminate all errors by setting more appropriate cache headers.
Optimize images: that's a problem specific to the Material documentation and the large image. I may consider generating a thumbnail for this, but it's not a problem of the theme but of the content.

Same for desktop and mobile. For validation, I searched for people self-hosting their docs and found retropie.org.uk to have quite a reasonable configuration:

bildschirmfoto 2018-03-01 um 19 14 40