I couldn't find any proper solution for automating Google App Engine CSS and Javascript minification.
0
Add a comment
|
6 Answers
If your JS/CSS files are to be used inside an HTML page, then a very good option is to have App Engine optimize your site automatically (minification, bundling, inlining and more) via the experimental "Page Speed" feature. You can turn this on by doing this:
Go to your projects' App Engine dashboard: https://appengine.google.com/settings?&app_id=s~your_project_id
Click on "Application Settings" (bottom left under "Administration" section).
Scroll down to the "Performance" section and locate "PageSpeed Service:". Check the " Enable PageSpeed Service" checkbox and hit "Save".
This will add response filters that will automatically do stuff like combine and minify your JS, turn the minified bundle from a script reference to an inline script (to lesser the count of server requests) and more cool and effortless performance improvments. Read more about this feature here: https://developers.google.com/speed/pagespeed/service/faq
1 Comment
matangover
Unfortunately this solution will no longer work after December 1, 2015, as the PageSpeed service for Google App Engine is being turned off. As stated in the App Engine documentation: [...] the PageSpeed service for Google App Engine is deprecated and will be turned off on December 1, 2015. The PageSpeed integration on Google App Engine will continue to function until December 1, 2015, after which date PageSpeed optimizations will no-longer be applied to your app.
Write a deploy script that makes a copy of your app with minified JS and CSS, and then calls appcfg on it. You shouldn't be minifying it dynamically unless you're generating it dynamically.
2 Comments
Ron Reiter
What's wrong in minifying on-the-fly? If you're using cached copies, I don't see what's wrong with this method.
Nick Johnson
@Ron Your code isn't changing, so there's no reason to minify over and over again. Those users who get cache misses are going to see significant extra latency, for no real gain on your end. It also wastes resources.
I ended up creating this appengine script (uses memcache and slimit). I found slimit to be the best minification script all around, but I'm thinking about using the one from Google instead.
Comments
You can automate the process pretty efficiently by loading the content of your script into a string, processing it with jsmin and finally save and serve the result. Don't worry about performance, you only run jsmin when the application instance is created (certainty not for every request).
you can grab jsmin.py here.
lets say I have this function that reads the JS from the filesystem (uncompressed, debug version) and returns it's string content in the logger.py module:
class ScriptManager():
def get_javascript(self):
path_to_js = os.path.join(os.path.dirname(__file__), 'js/script.js')
return file(path_to_js,'rb').read()
process it over with jsmin. make sure to use proper caching headers. take this jsrendered sample module as an examp
js_compressed =
jsmin.jsmin(scripts.logger.ScriptManager().get_javascript())
JS_CACHE_FOR_DAYS = 30
class scriptjs(webapp2.RequestHandler):
def get(self):
self.response.headers['Content-Type'] = 'text/javascript'
expires_date = datetime.datetime.utcnow() + datetime.timedelta(JS_CACHE_FOR_DAYS)
expires_str = expires_date.strftime('%d %b %Y %H:%M:%S GMT')
self.response.headers.add_header('Expires', expires_str)
self.response.headers['Cache-Control'] = 'public'
self.response.cache_control.no_cache = None
self.response.out.write(js_compressed)
now return that from a dynamic contnet handler in your main.py:
app = webapp2.WSGIApplication([
('/scripts/script.js', jsrender.scriptjs),...
Comments
Nick's answer is the correct way to do it, but you could do it on the fly when the JS/CSS is requested - then set cache-control to public to cache the results upstream.
- Slimmer - http://pypi.python.org/pypi/slimmer/
- JSmin.py - http://code.google.com/p/v8/source/browse/branches/bleeding_edge/tools/jsmin.py
- Cache control header chatter - http://groups.google.com/group/google-appengine/browse_thread/thread/be3fa7b5e170f378 and blog post - http://www.kyle-jensen.com/proxy-caching-on-google-appengine
Comments
You could try a build-time or a runtime solution (using maven plugin) provided by a tool called wro4j
Disclaimer: this is a project I'm working on.
