My CSS file is in need of optimization for quicker loading times. It contains numerous components utilized across various pages (such as the start page, category pages, and detail pages) on different screen sizes (mobile, tablet, desktop). Manual optimization is complex due to this variation. Extracting the key parts could improve load times by async loading the current large file.
I have experimented with critical CSS extractors and uncss but found them limited to extracting CSS for a single page on one screen size. Is there a tool that can assist me in extracting used CSS across multiple pages and breakpoints?
Would anyone happen to know of a tool like:
magic-used-css-extractor 400px,1024px,2048px http://example.com/ http://example.com/category1/ http://example.com/category2/ http://example.com/detail1/ http://example.com/detail2/This tool would generate CSS matching the used styles on all provided pages. Alternatively, a tool capable of merging critical CSS from several sources into the correct order with at-rules could also be helpful.