Part of the optimization techniques used by our service is to create the so-called "Critical CSS" for your site. The Critical CSS contains only the minimum required CSS code to correctly render your above-the-fold content while the rest of the resources load, improving the user experience of your site. Without Critical CSS, your visitors will temporarily see your site with missing styles, leading to bad user experience.

Our service generates the Critical CSS by accessing your web page with a disabled JavaScript. Doing this ensures the resulting styles do not rely on dynamically created elements from JavaScript. After all, the Critical CSS is only used before any other resources are loaded (CSS and JavaScript).

To see what your site would look like with only Critical CSS (during the very first instances while your site loads with NitroPack):

  1. Disable JavaScript in your browser. Follow this tutorial to see how to do it:
  2. Access your website. What you see is how your site will load with Critical CSS. In some cases, some website themes may look strange with a disabled JavaScipt. If you want to improve the overall user experience of your visitors, consult with your theme developer to enhance the style of your theme while JavaScript is disabled.
  3. Finally, re-enable JavaScript in your browser.
Did this answer your question?