Skip to content
Permalink
Browse files

feat(cache busting): add cache busting to the prod build for the client

  • Loading branch information
jyounce committed Jul 2, 2015
1 parent 401eade commit 7f66d19d1e4eee58282cca4957bc21003ae28d44
Showing with 103 additions and 15 deletions.
  1. +7 −6 README.md
  2. +21 −9 config/config-globs.coffee
  3. +1 −0 init/tasks.coffee
  4. +1 −0 package.json
  5. +72 −0 tasks/minify/cache-bust.coffee
  6. +1 −0 tasks/minify/minify-client.coffee
@@ -27,13 +27,13 @@ rapid-build currently supports the following technologies:
* src
* this is where you develop, place your working files here
* these files should be under a [version control system](http://guides.beanstalkapp.com/version-control/intro-to-version-control.html)
([ex](https://github.com/ 'Example: GitHub that uses Git'))
([ex](https://github.com/ "Example: GitHub that uses Git"))
* dist
* this is where your distributable packages/folders will be built
* once built you can ship them off to places like a webserver
* these packages should not be under version control
* instead use a [ci system](http://www.thoughtworks.com/continuous-integration 'Continuous Integration System')
([ex](https://travis-ci.org/ 'Example: Travis CI')) to build and deploy your packages
* instead use a [ci system](http://www.thoughtworks.com/continuous-integration "Continuous Integration System")
([ex](https://travis-ci.org/ "Example: Travis CI")) to build and deploy your packages
* client
* directory for all your
[client side](http://programmers.stackexchange.com/questions/171203/what-are-the-differences-between-server-side-and-client-side-programming)
@@ -175,11 +175,12 @@ gulp rapid-build:prod
* js (scripts.min.css created)
4. build the spa.html file
5. minify the spa.html file
6. minify server js files
7. start the server
6. cache bust the files (client)
7. minify server js files
8. start the server

## Develop Rapidly!
![Shake and Bake!](docs/shake-and-bake.jpg)
![Shake and Bake!](docs/shake-and-bake.jpg "Shake n' Bake!")



@@ -8,15 +8,17 @@ module.exports = (config) ->
# defaults
# ========
lang =
all: '/**'
coffee: '/**/*.coffee'
css: '/**/*.css'
es6: '/**/*.es6'
html: '/**/*.html'
images: '/**/*.*{gif,jpg,jpeg,png}'
js: '/**/*.js'
less: '/**/*.less'
sass: '/**/*.sass'
all: '/**'
coffee: '/**/*.coffee'
css: '/**/*.css'
es6: '/**/*.es6'
html: '/**/*.html'
images: '/**/*.{gif,jpg,jpeg,png}'
js: '/**/*.js'
less: '/**/*.less'
sass: '/**/*.sass'
bustFiles: '/**/*.{css,js,gif,jpg,jpeg,png}'
bustRefs: '/**/*.{html,css,js}'

# helpers
# =======
@@ -78,6 +80,16 @@ module.exports = (config) ->
addGlob 'dist', 'views', ['all']
addGlob 'dist', 'views', ['html']

# cache bust
# ==========
addCacheBust = (type, lang) ->
_glob = path.join config.dist.app.client.dir, lang
glob.dist.app.client.cacheBust[type] = _glob

glob.dist.app.client.cacheBust = {}
addCacheBust 'files', lang.bustFiles
addCacheBust 'references', lang.bustRefs

# methods
# =======
removeAppAngularMocksDir = ->
@@ -56,6 +56,7 @@ module.exports = (gulp, config) ->

# minify
# ======
require("#{config.req.tasks}/minify/cache-bust") gulp, config # cache-bust
require("#{config.req.tasks}/minify/concat-scripts-and-styles") gulp, config # concat-scripts-and-styles
require("#{config.req.tasks}/minify/css-file-split") gulp, config # css-file-split
require("#{config.req.tasks}/minify/minify-client") gulp, config # minify-client
@@ -36,6 +36,7 @@
"gulp-angular-templatecache": "~1.7.0",
"gulp-babel": "~5.1.0",
"gulp-bless": "~3.0.1",
"gulp-cachebust": "~0.0.5",
"gulp-coffee": "~2.3.1",
"gulp-concat": "~2.6.0",
"gulp-if": "~1.2.5",
@@ -0,0 +1,72 @@
module.exports = (gulp, config) ->
q = require 'q'
del = require 'del'
path = require 'path'
Bust = require 'gulp-cachebust'
promiseHelp = require "#{config.req.helpers}/promise"
unstampedPaths = []
bustOpts =
checksumLength: 3

# Helpers
# =======
getUnstampedPath = (_path) ->
dir = path.dirname _path
ext = path.extname _path
name = path.basename _path, ext # will exclude the ext
end = name.length - (bustOpts.checksumLength + 1) # + 1 for the dot
name = name.substring(0, end) + ext
_path = path.join dir, name

# Tasks
# =====
runStampFiles = (src, dest, bust) ->
defer = q.defer()
gulp.src src
.pipe bust.resources()
.on 'data', (file) ->
unstampedPaths.push getUnstampedPath file.path
.pipe gulp.dest dest
.on 'end', ->
console.log 'file names busted'.yellow
defer.resolve()
defer.promise

runDelUnstampedPaths = ->
defer = q.defer()
return promiseHelp.get defer if not unstampedPaths.length
del unstampedPaths, force:true, (e) ->
# console.log 'unstamped files deleted'.yellow
defer.resolve()
defer.promise

runStampRefs = (src, dest, bust) ->
defer = q.defer()
gulp.src src
.pipe bust.references()
.pipe gulp.dest dest
.on 'end', ->
console.log 'file references busted'.yellow
defer.resolve()
defer.promise

runCacheBustTask = -> # synchronously
defer = q.defer()
bust = new Bust bustOpts
srcFiles = config.glob.dist.app.client.cacheBust.files
srcRefs = config.glob.dist.app.client.cacheBust.references
dest = config.dist.app.client.dir
tasks = [
-> runStampFiles srcFiles, dest, bust
-> runDelUnstampedPaths()
-> runStampRefs srcRefs, dest, bust
]
tasks.reduce(q.when, q()).done -> defer.resolve()
defer.promise

# register task
# =============
gulp.task "#{config.rb.prefix.task}cache-bust", ->
runCacheBustTask()


@@ -17,6 +17,7 @@ module.exports = (gulp, config) ->
"#{config.rb.prefix.task}build-files-prod"
"#{config.rb.prefix.task}build-spa"
"#{config.rb.prefix.task}minify-spa"
"#{config.rb.prefix.task}cache-bust"
cb
)

0 comments on commit 7f66d19

Please sign in to comment.
You can’t perform that action at this time.