Posted on Dec 22, 2009

Limit App Engine to Minified JS and CSS

Call me paranoid or call me efficient, but I don’t like non-minified CSS and Javascript accessible in a production environment. It’s one thing setting up your web application to use minified files when it’s rolled out , but I’d prefer that the originals aren’t available at all – and yes, part of that is me not wanting to make it too easy for people to snoop through my code (though I do release a lot as open source anyway).

In any event, this proved a little tricky when using Google App Engine for LocationFu. Google’s deploy process has the option of excluding certain application files from being sent up, but it can’t exclude any files that sit within a directory marked as a static path. The solution is simple, but took me a while to figure out. Previously, I had my static path set up like so in my app.yaml file (note that this is for Python App Engine):

- url: /static
static_dir: static

That will map any file starting with /static into the static directory in the app tree. Instead, you can map individual files, and limit the extensions you want to serve:

- url: /static/(.*?)
static_files: static/\1
upload: static/(.*\.(gif|png|jpg|min\.css|min\.js))

That tells App Engine to grab the file name requested and map it into the static directory, while the upload parameter includes a regex to match only selected file extensions (.min.js, but not just .js, for example). This won’t stop your app from serving any file while running on the local development server, but when pushed to production, your JS and CSS files will only be accessible in minified form.

Posted on Dec 17, 2009

MooTools Idle Tracker Class

In web applications, there are times when you may want to track activity of a user within your page – perhaps your project includes a realtime component that you want to pause when the user isn’t actually working with the page, for example. This is pretty easy to take care of, but there are a few little quirks, so to simplify it all I’ve released a MooTools class to take care of it for you.

The class is super simple to use, all that is required is for it to be instantiated and it’ll get on with it. You can specify how many seconds of no activity on your page before the user is classed as idle, as well as a couple of more technical options, then just attach a function to the onIdle and onIdleReturn events of the class. For example:

  1. var tracker = new IdleTracker({
  2.     idleTime: 2,
  3.     onIdle: function() {
  4.         // User is idle
  5.     },
  6.     onIdleReturn: function() {
  7.         // User has returned
  8.     }
  9. });

You can get full details and download the class from my GitHub account.