Reload CSS only if nothing else changed

[milaz]

In a workflow when developer/designer edits stylesheets one change at a time and wants to immediately preview them, it would be very desirable to reload only the stylesheets, as Grunt or Brunch does.

Presently, the workflow is not so smooth, as complete page is reloaded, which makes the page in question to flicker at best. If it was scrolled, on reload we see its upper portion first, and then the page is scrolled back. When one uses Google Fonts, the page may be blank for couple of seconds, while remote servers delaying to respond.

Of course, all these unfortunate effects are due to browser behavior and to Google Fonts. But reloading only the stylesheets mitigates them.

[samccone]

see #149

but in the meantime I think.. maybe this could be something that we could add

eh @Jenius ?

[zspecza]

It would be nice, it'll make developing on Roots seem a lot more fluid. I use Mixture to work on Axis, and it reloads CSS - not the whole page. Add this mixin (borrowed from Jeet) while developing and things really start feeling awesome:

edit()
  body *
    transition: 200ms ease all
    background: rgba(#000, .15)

[samccone]

I guess we could only watch the style folder if someone passes a flag like --only-style or something similar

[jescalan]

Yeah reloading just css is a weird thing - not as easy as it seems. Livereload attempts to do this, but in my experience with livereload, it was fairly faulty and I found myself having to frequently manually reload the page which for me was way more of a pain than just having it auto-reload for me.

Reloading just css means that current styles on the page need to be stripped and new styles need to be injected. Like sam mentioned, this means roots would need a thorough knowledge of where any and all style definitions on a page are so it can strip them and load in the new ones.

I would definitely like to make this happen eventually, but I'd say this issue is low priority for me, just because of the large amount of effort required to implement and the fairly small payoff

[zspecza]

Here's an idea for the meantime: an option to turn off the Roots implementation in case the developer wants to use LiveReload (or a similar app) instead.

[jescalan]

Already in there. You can add exports.no_livereload = true to your app.coffee file and it will turn the live reload functionality off.

[jescalan]

I'm going to close this one - we'll use #170 to track the development of this one 😄