actum / gulp-dev-stack

Actum dev stack based on gulp
MIT License
11 stars 7 forks source link

Gulp: Critical CSS #68

Closed kettanaito closed 8 years ago

kettanaito commented 8 years ago

One of the most important things on web right now is performance. The latter often means the page load speed, which is directly influenced by the weight and amount of resources page needs. While this is not the general suggestion to optimize stack performance, I am talking more about generating critical CSS.

Possible solution: Gulp Critical. Idea behind it is to generate critical CSS and load it first, while loading other CSS async. This should be doable since we use templating, resulting in static HTML in the end.

vbulant commented 8 years ago

This topic should be researched and tested on something real first. After that we can implement it based on the results.

We agreed that @kettanaito will look into it when he has some spare time.

I’ll close the issue for now, let’s reopen a new one when that time comes. Thanks for the idea.

janpanschab commented 8 years ago

As I was testing 2 similar tools about year ago, Gulp critical and one other was not working correctly. Let’s test it again and if the situation will be the same, try to focus on app shells https://developers.google.com/web/updates/2015/11/app-shell or splash content screens like FB do.

kettanaito commented 8 years ago

Update status: I have tested Critical on Zindulka and it takes around 2 minutes to compile critical CSS for a big project.

janpanschab commented 8 years ago

Are you processing all templates, or only homepage? How it works with responsivity? And the results, is it OK?