User Experience on mobile might not be great yet, but I'm working on it.

Your first time on this page? Allow me to give some explanations.

Awesome Critical-Path Tools

Tools to prioritize above-the-fold (critical-path) CSS

Here you can see meta information about this topic like the time we last updated this page, the original creator of the awesome list and a link to the original GitHub repository.

Last Update: Nov. 30, 2021, 11:11 a.m.

Thank you addyosmani & contributors
View Topic on GitHub:
addyosmani/critical-path-css-tools

Search for resources by name or description.
Simply type in what you are looking for and the results will be filtered on the fly.

Further filter the resources on this page by type (repository/other resource), number of stars on GitHub and time of last commit in months.

Node modules

Generate critical css for your web pages

2.48K
150
108d
MIT

Extract & Inline Critical-path CSS in HTML pages

9.34K
390
85d
Apache-2.0

Finds the Above the Fold CSS for your page, and outputs it into a file

1.64K
73
2y 8m
MIT

Server-side modules

Apache module for rewriting web pages to reduce latency and bandwidth.

670
170
26d
Apache-2.0

Automatic PageSpeed optimization module for Nginx

4.32K
366
1y 4m
Apache-2.0

Grunt tasks

A grunt plugin that uses Penthouse to extract critical path css

69
10
3y 8m
MIT

Grunt wrapper for criticalcss

539
28
2y 9m
MIT

Grunt task to extract & inline critical-path CSS from HTML

144
21
5m
n/a

CasperJS

A CasperJS script to pull critical CSS information from your page.

69
4
7y 8m
n/a

PhantomJS

DEPRECATED! PhantomJS script to inline above-the-fold CSS for a webpage.

81
11
1y 13d
n/a

Inline sources (styles, scripts)

replaces link tags with inline style tags + inlines CSS url() calls with data URIs

23
0
7y 4m
n/a

Inline flagged js & css sources.

212
32
3y 10d
MIT

Inline critical path CSS and async load existing stylesheets

103
15
65d
n/a

CSS style loader for Webpack that is optimized for isomorphic (universal) web apps.

1.23K
147
96d
MIT

Async load CSS

Online tools

Bookmarklets/Extensions

optimize your critical rendering path

44
3
8y 82d
MIT

exercise using the snippet you can try out.

Render-blocking issues detection

Supplementary tools

Remove unused styles from CSS

9.15K
434
27d
MIT