Sunday, May 15, 2011

2 easy things you can screw up in backbone

First off let's be clear.  Backbone is awesome.  It's totally changed the way I develop web applications for the better.  Before backbone, working on javascript code for a rich client web app was a miserable experience.  With backbone (and coffeescript) I'm now enjoyably writing code I can be proud of.  But because we are now developing our apps in a new way, we've found new ways to mess things up ;)  Here are a couple ways we found that could save you some hours of frustration if you avoid doing them.

Don't have multiple views using the same element

This one I did early on in my backbone days the first time I had one view that created another view.  Imagine some code like the following:



Seems ok at first. When we click a button in FooView it creates a BarView giving it an element and telling it to render. The problem happens the second time the button gets clicked. At that point you have 2 instances of BarView which each use the same element. And if those BarViews are listening to events on (or within) said element, mayhem ensues. I've found it to work out better to write the code like so:



In this version the BarView is created during the render method, right after his element has been created presumably. Then the BarView instance is displayed when needed. I've found this to be a good rule of thumb: backbone view objects should have the same life cycle as their elements. They should be created when their elements are created and destroyed when they are removed.

Beware model defaults that initialize complex attributes

The second gotcha I've run into cost us a good few hours today actually.  Backbone models have a nice feature for allowing default attributes.  It's a handy feature, but by using it to initialize array or object properties we found it caused a subtle (to us) but pretty terrible bug.  In our model we had code like so:



The problem here is what happens when you create a second Foo. Turns out backbone does a shallow clone of defaults, which means the same array object in memory is used for both. This spec describes the problem nicely:



Turns out there is a pretty easy fix for this too. Defaults don't have to be an object literal, they can also be a function and backbone will be smart enough to invoke it to build the model's attributes. In coffeescript, this fix is exactly 2 characters:



Hopefully these two tips will save you some frustration as you dig deeper into backbone. In a future post I'll share some of the code we've refactored out of our app that we feel like is generally useful for other backbone + coffeescript + rails apps.

11 comments:

TerminatorJoe said...
This comment has been removed by the author.
xinag zhong said...

These kind of directories tend to be like magicCheap wow gold don this advantage direction to suit your needs. In your own views, you'll be able to referrals factors in almost any of the internet directories underneath the prefix /assets, such as. if perhaps foo.js was a student in app/assets (or perhaps lib as well as supplier) you'd it is known as /assets/foo.js. The train track helpers for example javascript_include_tagBuy rs gold
is going to do this particular to suit your needs.

Ming Zhang said...

Given that the culture was very wealthy, there was a distinctive language that created. Although presently you will discover up to 12 Chinese Style regional groups of language, Chinese was the language that was spoken in ancient China suitable from the Han dynasty.

summerlijia said...

Guys, do you like to play MMORPG? Guild Wars 2 is one of the most wonderful MMORPGs.I'm a big fan of Guild Wars 2 and good at farming Guild Wars 2 gold. I know a good website to update game guidance about how to farm gold. The cheap Guild Wars 2 gold is also available in that store. So, if you lack gold, you can have a try of that store. Just click the colored word which will direct you.

adeoe said...

"2 easy things you can screw up in backbone" What are useful tips
buy cheap gw2 gold

caton yesiondre said...

Noting that the market for PCs has been cannibalized by tablets and smartphones, amid other factors, the Laptop maker windows 7 anytime upgrade key also produced a press release regarding the uncertainties that goes with the adoption of your Home windows eight OS. The business further more famous microsoft office 2010 activation key that there are adverse developments in tandem using a commonly weakening demand from customers for PCs throughout the world and also unfavorable margin costs for PCs.

AntoL-Nyo said...

HD kaliteli porno izle ve boşal.
Bayan porno izleme sitesi.
Bedava ve ücretsiz porno izle size gelsin.
Liseli kızların ve Türbanlı ateşli hatunların sikiş filmlerini izle.
Siyah karanlık odada porno yapan evli çift.
harika Duvar Kağıtları bunlar
tamamen ithal duvar kağıdı olanlar var

Vivian Salvatore said...

Buy GW2 Gold They should be since efficient at melee at the same time, D3 Gold however for causes described until recently, this can never ever happen.

AntoL-Nyo said...

Ben istanbuldan selda 22 yaşında konfeksiyon içşisiyim Amatör Porno sizleri bekletmeden hemen hikayeme geçiyorum.. Biz 5 katlı bir binanın en üst katında yaşıyorduk ve bir öğlen paydosunda sevgilim beni Anal Sikiş aradı evdeydim çünkü evle iş yerim arasında 2 dakika bile yoktu.. Bende Asyalı Porno sevgilime benden telefon beklemesini söyledikten sonra evin durumuna baktım evde kardeşlerim ve annemin Esmer Porno birkaçtane arkadaşı vardı bu iş imkansızdı tekrardan düşündüm ve çatı katı aklıma geldi sevgilime telefon açıp çatıya çıkmasını ve Fantazi Porno beni beklemesini söyledikten sonra telefonu bir süre elime almadım anneme işe gidiyorum dedikten sonra Gay Porno hemen üst kata çatıya çıkıp sevgilimin
dudaklarına yumuldum az bir süremiz Götten Sikiş vardı ve çok istiyordum onu hemen önünde diz çöküp sikini çıkardım kocaman olmuştu bile... Özlemişti beni HD Porno bitanem başladım sikini yalamaya kafasını öpüyor onu çıldırtıyordum sevgilim saçlarımdan tutmuş ağzımı keyifle sikerken çatı katının kapısı açıldı toparlanamadan Lezbiyen Porno komşunun şişman oğlu efecan gelmişti ben dizlerimin üzerinde sevgilimin Liseli Porno siki ağzımda yakalanmıştım hemen bu halimizi gören komşu oğlu Sarışın Sikiş kaçarcasına gitti.. Sevgilim bir süre güldükten Türbanlı Porno sonra bu şişko neden kaçtı korktu herhalde onu sikicem sandı galiba dedikten sonra bir kahkaha daha attı ben sevgilimin Türk Porno sikine deli gibi saldırıyor yalıyor emiyordum boşalmasını istiyor Zenci Porno sütünü içmek istiyordum sevgilim ağzımı sike sike boşaldı hepsini yuttum bir damlasını ziyan Porno etmedim ve sevgilimle vedalaşıp ayrıldık... Ben her defasında sikiş yapmadan önce yazporno diye olan türkçe siteden Porno izle bölümüne girip seyrediyorum azdıktan sonra şahane sikiş ile gözleri kamaştırıyorum.

Jessica Colin said...

Today I said goodbye to my first Hospice patient. She would have been 100 in December. They work hard to match up volunteers with patients, and they did a fantastic job with us. We bonded quickly and talked about everything, from how short Tom Cruise is to how worried her five-year-old self was that her

www.automotive-law.com |

buysellautoapp.com |

cwyzehealthcare |

http://www.europetravel101.com |

www.housedegree.com |

maryland-funeral-home.com |

plumlivinghealth |

http://www.strategies4realestate.com |

www.wv-car-accident-lawyer.com |

auto-mortgage |

Amna Khan said...

Use real life as a learning opportunity. Daily life is full of opportunities beyond those offered in a traditional learning model. Help them improve their daily grammar mistakes as well. Cooking dinner can teach children important math skills such as measurements and conversions.
http://www.biketowork2013.com |

envisioncentraltexas.com |

http://www.midwestmarketingtesting.com |

aauw-daw.org |

http://www.booksharmexcursions.com |