TL;DR I created jade-inheritance to understand the dependencies between Jade templates in order to only compile the files I needed.
In a previous post I described how some much needed updates to our Jade templates at CrowdTwist came at the cost of slowing down our development time.
At first I thought, “Sure. We’re doing some pretty complicated stuff now and our app has grown, so it’s bound to take longer.”
But then it hit me – our watch task (which monitors changes to our templates) was compiling everything everytime I edited something. Even if the edited file lived in total isolation, the entire app’s Jade files were getting compiled into HTML.
And it was taking 57s.
Even for the smallest change. Fixing a typo, iterating on a feature, anything at all.
The Problem
I started by asking, “Why?”.
Why were we compiling all of our templates when potentially only one of them had changed?
Well, there was the possibility that the changes to the modified file could impact the output of other files. Updating a file which was extended or included by other files would require those files to be recompiled too.
The Solution
To solve this problem I created jade-inheritance.
Given a Jade file and a directory, it will determine which files within that directory extend or include the file. By passing a modified file to jade-inheritance it’s possible to understand which other files should be recompiled. On the file with the most dependants in our project, this additional processing can be done in around 1.5s.
Conclusion
Now, modifying a file which is completely isolated takes only 0.15s. A 99.7% improvement, with other files of varying dependence compiling in much less time too.
Paul Young 