Google App Engine ReferenceProperty and HTML5 local storage

Posted by Johan on Friday, July 22, 2011

The best thing with my job is that I work with the same things that I can spend hours doing in my free time. Too bad you don’t have 40 hours a week free time.

It’s been a while but I have finally made som progress.

I had some troubles with BigTable (the database that you use in Google App Engine). I put pretty large arrays with weather data in db.BlobProperty but when I read this back from the database GAE ran out of memory, even if I didn’t touch the blob. After reading up on this I found out that I had to use db.ReferenceProperty.

As always the manual is not that clear so here is some example code:
class ForecastData(db.Model): values = db.BlobProperty()

class Forecast(db.Model):
  firstGridPoint = db.GeoPtProperty()
  lastGridPoint = db.GeoPtProperty()
  increment = db.FloatProperty()
  parameter = db.StringProperty()
  forecast_data = db.ReferenceProperty(ForecastData)
  reference_time = db.DateTimeProperty()
  forecast_time = db.DateTimeProperty()
  insert_time = db.DateTimeProperty(auto_now_add=True)

I put my blob in a separate model and referenced it with a db.ReferenceProperty(ModelName). Below is an example for putting data in the Data Store.
# Create the data object forecast_data = ForecastData() forecast_data.values = values

    # Put in in the database
    forecast_data = forecast_data.put()

    # Create the forecast object
    forecast = Forecast()
    # Reference the data (forecast_data is a key)
    forecast.forecast_data = forecast_data

And getting the data is done like this:
query = db.GqlQuery(“SELECT * from Forecast where forecast_time=:1”, forecast_time) forecast = query.fetch(1) if forecast: forecast_data = Forecast.forecast_data.get_value_for_datastore(forecast[0]) forecast = ForecastData.get(forecast_data).values

I get the forecast object from the database with a GQL query. The referenced property can be fetched with the get_value_for_datastore method.

After this the application is much faster.

To minimize the data transfered I’m using HTML5 local storage (a very good guide to html5 can be found here).

To put something in the local storage:
window.localStorage.setItem(‘key’, value);

and to get it back (even if the browser have been closed):
window.localStorage.getItem(‘key’);

This is a very simple key/value store. Other useful commands are clear() which clears all saved values.

I’m hoping to launch the site for others to try out very soon but I want to get some more features in place.

Until then here is an up-to-date screenshot: