Our development team at Opinsys has grown tremendously during the last year and our frustration of Wordpress had escalated to the point we had to do something about it. Since I was already familiar with the developer friendly Octopress by having used it in my personal blog we decided to go for it too.
This new Labs site contains news and updates about our development efforts. Expect posts about Linux and Web technologies. Checkout the archives to see what we have been previously posting.
While making sure that our experience with Octopress would be smooth as possible I integrated Guard::LiveReload with Octopress. Since I could not find any proper documentation on the Web how to do it I’m posting it here.
LiveReload is a OS X tool and a Chrome extension which frees developers from having to reload manually the pages they are developing by monitoring the file system and automatically reloading the pages. Guard::Reload is a CLI version of it written in Ruby.
Guard::LiveReload With Octopress
While there already blog posts about on how to use Guard::LiveReload with
Octopress I was unable to use them with our Octopress installation. For example
this blog post presents the most obvious way of integrating
it to Octopress and it fails with large blogs. It tries to monitor files in the
public/ directory and reloads immediately it sees a change. This is where it
fails. Generating our blog takes from 7 seconds up to 30 depending on the
machine. That means Guard reloads the page way too early.
One could try to workaround it by setting the
--latency option to Guard which
delays the task execution, but that’s pretty much a guess work. Real solution
would be to implement some kind of debounce feature to Guard which delays the
task execution until the events stop arriving. Since I’m not a Guard hacker I
ended up creating a Jekyll plugin to workaround this.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24
It monkeypatches Jekyll to hook into the build process and writes a file to
public/generated when the whole build operation has been completed. Now we
can monitor just this file in our Guardfile and the reload happens exactly when
it is supposed to!
1 2 3 4
Because Octopress (or Jekyll?) uses different thread for compiling stylesheets we want to add separate watcher for it too.
To actually use this we need to add
gems to the Gemfile and install the LiveReload Chrome
1 2 3 4 5 6
Then just install them with
bundle install and start Guard with
Now activate the LiveReload plugin from Chrome, start Octopress in preview mode
bundle exec rake preview and in a second terminal start guard with
bundle exec guard.
Compiling 30 seconds?!
That’s not a smooth developer experience! Not even with LiveReload.
Unfortunately it’s not trivial to speed up Jekyll build process. Generating
dozens of pages just takes time. My solution to this is just remove all the
pages I’m not currently interested in with
rm source/_posts/* and restore
them with git after I’m done.