Optimize css for above the fold

[ScottDowne]

What this means is css that isn't used in our initial display, can be loaded later and not block the page.

CSS that is required for the initial page, we should load inline(or something else, require?) as blocking.

I'm guessing that any components or css that's use in the page we link to in the snippet is considered above the fold, the rest we can load later.

[ScottDowne]

From the technical point of view, this might be quite easy.

We already want to chop up our css as a set of component based less files.

Then, we have two less files, one is above the fold, which we require in, one is below, which we link to.

These files would just be importing the components as they need them. So header.less, footer.less, the main page, and any component less files needed for page 1 of seq could be in above the fold.less, the rest in below.