
CSSrefresh - Automatically Refresh CSS files - jenhsun
http://cssrefresh.frebsite.nl/
======
bearwithclaws
LiveReload (<http://livereload.com/>) had already solved this.

I'm wondering if there's something that refreshes the browser when you make
changes to the CSS files _before_ saving? Like CSSEdit (which I've used
religiously for the past 2 years), but applies to all sort of files
(HTML/HAML, SASS/SCSS/LESS).

~~~
X-Istence
It is a real shame that CSSEdit has been rolled into Espresso with no real
benefit or gain to the user. CSSEdit is one of my most favourite tools to use
while developing websites and I am going to hold onto it as long as I possibly
can.

~~~
billpatrianakos
I used to absolutely love both Espresso and CSSEdit too but I've now switched
to a more minimal editor. I started using LESS so CSSEdit wasn't cutting it
anymore. Instead I use either Less.app or CodeKit which monitors your working
directory, automatically compiles LESS to CSS on save, and refreshes the
browser tab of the site you're working on.

I do agree that rolling CSSEdt into Espresso isn't the same. I don't know why
but I liked CSSEdit better when it was a standalone app. Anyway, as an
alternative to CSSEdit or the other desktop apps that give you the instant
refresh, you could always write a shell script that watches your working
directory and executes the LESS (or SASS/SCSS) compiler then refreshes your
browser. I actually used that once but lost it while formatting the laptop it
was on. The part that watches the folder and executes the compiler is easy but
I had someone else help me with the browser refreshing part.

------
sirn
Alternatively, LiveJS[1] which follows the same concept.

[1]: <http://livejs.com/>

------
juriga
It would be nice to have some information about the inner workings of the
script on the site.

The actual script on the site is unminified and quite easy to grasp: Since
it's only a client-side solution it has to resort to polling every stylesheet
every second(!) and check the file's Last-Modified header from the ajax
request.

This is hardly an optimal solution, since you end up making a lot of requests
even though no changes are being made. In addition to the performance
standpoint, you end up cluttering any ajax monitoring views (e.g. Chrome dev
tools).

LiveReload (<http://livereload.com/>) seems to be a good alternative (Mac
only). Any suggestions for similar solutions for other OSes?

EDIT: Just tried the experimental v0.0.2 Windows release of LiveReload.
Installation was really easy, and I got it working with the Firefox extension
right away. More info: [http://help.livereload.com/kb/roadmap/latest-
development-bui...](http://help.livereload.com/kb/roadmap/latest-development-
builds)

~~~
MatthewPhillips
I don't see an issue with the polling. You're only ever going to use this in
dev, I don't care that it polls my localhost frequently. If I'm optimizing my
own JavaScript I won't have it enabled. The bookmarklet seems the way to go.
Enable it while you're working on CSS, otherwise you don't need it.

------
DavidChouinard
A very different approach, but Fog Creek's WebPutty helps solve this as well:
<http://www.webputty.net/> (HN thread:
<http://news.ycombinator.com/item?id=2786893>)

------
andreyfedoseev
Check my django-cssreload app <https://github.com/andreyfedoseev/django-
cssreload>

It does similar thing but with less AJAX requests. Works only with Django
though.

------
d0vs
"When you're coding a website, nothing can be more frustrating than having to
switch from the texteditor to the browser over and over again, just for small
changes to occur."

And then:

"With CSSrefresh installed, all the included stylesheets are automatically
refreshed directly after you save them."

So you still have to switch between your browser and your editor, right?

~~~
waitwhat
side-by-side windows

~~~
rimantas
or multiple monitors.

------
conradfr
I use this bookmarklet : <http://david.dojotoolkit.org/recss.html>

------
padenot
<https://addons.mozilla.org/en-US/firefox/addon/auto-reload/> is a Firefox
addon which reloads a page when it (and any linked files) changes. Works great
for me. It also works with file:/// URLs.

------
AlexFromBelgium
Using guard-livereload on linux, you can make the browser refresh on any
change in the filesystem. <https://github.com/guard/guard-livereload> This is
an awesome tool...

------
Johnyma22
I use firebug to do this

------
pssdbt
Very cool. I still prefer editing via the Chrome developer tools resources
tab.

------
josscrowcroft
github/sourceforge/googlecode/etc link would be lovely!

------
tekromancr
Awesome!!!

------
jsavimbi
sass -watch yourstyles.scss:yourstyles.css is what you should be doing instead
of writing css.

~~~
juriga
Sorry, different issue. Automatic precompilation in SASS is nice, but it
doesn't refresh the browser for you.

As mentioned in other comments, LiveReload does this for CSS or SASS (Mac
only, unfortunately).

~~~
jsavimbi
LiveReload hasn't been that consistent for me. I do wish that not to be the
case.

