Skip to content


Tim Zallmann requested to merge tz-critical-css-poc into master

What does this MR do?

Test for running startup.css/critical CSS inline to improve performance. The actual CSS is automatically extracted and copied over into the GitLab repo (Interim Solution). Target is to have in the critical CSS all CSS for already rendering the top + left menu while the main application.css is loaded.

Currently the application.css has an content size of 1.4MB which need to be parsed and the inlined CSS extracts the minimum which is in the first test around 32KB that is needed to render.

This is now a test version "hidden" behind a querystring parameter (so we can test side by side the same pages) and a cookie to test global navigating with it activated.

Activation by adding ?startup_css=true to any page or setting a cookie startup_css with the value true.

It is very hard to test locally, and we still need to figure out if this really improves performance with our current setup or not (as it adds 32KB to every basic page load). Especially in non cache situations I saw big improvements for the First Paint, see below, which is one of the main things for sitespeed and other statistics especially search engines, etc.



Local Sitespeed runs

Left is current rendering and on the right with startup_css activated.



Does this MR meet the acceptance criteria?


Availability and Testing


If this MR contains changes to processing or storing of credentials or tokens, authorization and authentication methods and other items described in the security review guidelines:

  • Label as security and @ mention @gitlab-com/gl-security/appsec
  • The MR includes necessary changes to maintain consistency between UI, API, email, or other methods
  • Security reports checked/validated by a reviewer from the AppSec team
Edited by Tim Zallmann

Merge request reports