CSS timing experiments

This is an experiment to measure the performance cost of large CSS files as generated by CSS preprocessors such as SASS + LESS. Accepted best practice is to have a single large CSS file with all the styles for your site so that users only need to suffer a download hit once. This makes sense, but you are left with a large file with many selectors that do not apply to any specific page.

This experiment is designed to test the 'best-case' loading time, when all resources are cached (including html files, which is unrealistic). All pages include very simple JS which simply times various loading events (initial load, head loaded, body loaded, onready etc).

This page is simply here to warm caches. Loading:

When it has fully loaded, click here.