Huomioita Backbonen käytöstä

Kirjoitin pari kuukautta sitten Backbonesta ja Emberistä. Sen jälkeen olen koodannut useampiakin käyttöliittymiä Backbonella ja ajattelin jakaa muutaman pienen havainnon sen käyttämisestä. Tarinan opetuksen voisi sanoa olevan, että jokaista frameworkkia kannattaa aina käyttää sen omalla tavalla, eikä yrittää soveltaa "ulkopuolisia" käytäntöjä siihen.

Backbone.View

Kun koodasin ensimmäisiä Backbone-sovelluksiani, minua hieman häiritsi kontrollerien puuttuminen ja yritin erottaa niitä omiksi luokikseen. Sittemmin kuitenkin tajusin, että Backbone.View on käytännössä tarkoitettu tekemään se, mitä kontrollerit yleensä tekevät. Varsinainen näkymähän on yleensä HTML-sivupohja, ja View-objekti taas ohjaa sen toimintaa ja kuuntelee sen tapahtumia.

View-objektin initialize()-metodi on siis hyvä paikka alustaa näkymän oletusarvot ja asettaa tarvittavat tapahtumankuuntelijat. Itse kuuntelijat taas kannattaa koodata View-objektin metodeiksi siten, että "this" osoittaa niissä aina View-objektiin. Tällöin koodin rakenne pysyy selkeänä ja vakiomuotoisena.

Backbone.View.events

Backbone.View.events-property tekee jQuery-tapahtumankuuntelusta siistiä. Sen avulla kuunneltavat tapahtumat voi määritellä deklaratiivisesti näin:

var MyView = Backbone.View.extend({
    events: {
        'click a.refresh': 'refreshClick'
    },
    refreshClick: function(event) {
        event.preventDefault();
        this.collection.refresh();
    }
});

Tässä on syytä huomata, että "this" osoittaa tapahtumankäsittelijässä View-objektiin eikä klikattuun linkkiin, kuten jQuerya manuaalisesti käytettäessä. Klikattuun linkkiin viittaaminen onnistuu event.target-propertylla. jQueryn pitäisi huolehtia, että event.target menee oikein myös IE:ssä.

Backbone.View.collection

Vastaavasti kannattaa aina käyttää Backbone.view.collection-propertyä, jos näkymään liittyy jonkin Collection-objektin sisältämää dataa. Se on nimittäin helppo asettaa näkymää luodessa:

var view = new MyView({collection:myCollection});

Mitä enemmän tällaisia oletuskäytäntöjä hyödyntää, sitä vähemmän omaa koodia tarvitsee kirjoittaa, ja sehän on jokaisen frameworkin perimmäinen idea.

Yhteen ongelmaan en ole vielä keksinyt hyvää ratkaisua. Jos nimittäin Backbone.View-näkymässä luo setInterval()-kutsulla säännöllisesti ajettavan koodinpätkän, joka päivittää näyttöä, niin miten se olisi paras sammuttaa näkymän kadotessa? Toisaalta voi olla huono idea ylipäätään käynnistellä setInterval()-kutsuja yksittäisissä näkymissä. Niiden olisi ehkä parempi olla sivukohtaisia globaaleja tapahtumia, joihin näkymät vain kytkeytyvät tarvittaessa.