DailyJS

LZF Compression, Nekoreader, Backbone.BindTo

Alex R. Young

Subscribe

@dailyjs

Facebook

Google+

libraries html5 backbone.js filesystem

LZF Compression, Nekoreader, Backbone.BindTo

Posted by Alex R. Young on .
Featured

libraries html5 backbone.js filesystem

LZF Compression, Nekoreader, Backbone.BindTo

Posted by Alex R. Young on .

LZFjs

LZFjs (GitHub: pkalogiros / LZFjs, License: GPL3) by Pantelis Kalogiros is a compression library based on LibLZF that uses the File API to compress files in client-side JavaScript:

The script is converted from the C version of LZF and works surprisingly fast and well. Both its functions (compress/decompress) accept and return an arraybuffer.

Even though it's been converted from C, the JavaScript is surprisingly easy to follow.

Nekoreader

Nekoreader (GitHub: nekoreader / nekoreader.github.com) is a client-side feed reader created by Vincent Grastic. It uses JSONP, and Google's Feed API to handle feeds. It has an API that allows a list of feeds to be specified in a JSON file. A template file and CSS can also be supplied to style the results.

Although people have been using Google's Feed API for a while for similar projects, I like the fact the author's example shows how to configure an entirely client-side app using services like GitHub and Dropbox.

Backbone.BindTo

Radoslav Stankov's Backbone.BindTo (License: MIT) is a Backbone.js extension that makes it easier to bind models to views. The author's example compares standard Backbone.js code with his extension:

window.UserCardView = Backbone.View.extend({  
  initialize: function() {
    this.model.bind('change:name',  this.renderName,  this);
    this.model.bind('change:email', this.renderEmail, this);
  },
  remove: function() {
    this.model.unbind('change:name',  this.renderName,  this);
    this.model.unbind('change:email', this.renderEmail, this);
    Backbone.View.prototype.remove.apply(this, arguments);
  },
  renderName:  function() { /* ... code ... */ },
  renderEmail: function() { /* ... code ... */ }
});

Using Backbone.BindTo makes this feel less like boilerplate:

window.UserCardView = Backbone.View.extend({  
  bindToModel: {
    'change:name':  'renderName',
    'change:email': 'renderEmail'
  },
  renderName:  function() { /* ... code ... */ },
  renderEmail: function() { /* ... code ... */ }
});

Events will be unbound when views are removed, and there's also Backbone.BindTo.noConflict for using the extension without modifying Backbone.View.

The same author has also recently released Backbone.Handlebars, which helps integrate Backbone.js and Handlebars.js.