Hi All,
On Sun, Jun 2, 2013 at 7:46 AM, Ruchira Wageesha <[email protected]> wrote: > Hi Chathura, > > I am not aware of your particular use-case. But it is always better to > separate HTML stuff out from JavaScript which helps you to maintain in > the long run. For that, try to use a client side JavaScrpt based templating > framework as much as possible. There are many alternatives such as > handlebars.js, dust.js(used by linkedin), jade etc. > +1, please dont mix your html in js, it will be a nightmare to theme these stuff later, when requirements come Regards, /Nuwan > > UES team and the latest caramel framework uses handlebars framework. So, > it would be better if everyone can stick into a single framework. > > Further, regarding your array iterating code, it would always be better to > use event delegation concept. i.e. If you have 100 buttons, then > registering onclick events for each and every button will eat up > memory unnecessarily. Instead register a single onclick event to a parent > element. Because of the event bubbling, any event take place on an HTML > element will be propagated upwards if you haven't explicitly prevented. > > If you have any specific data, then you can embedded those using HTML5 > data-* attributes[1]. Combining this with event delegation, you can achieve > pretty decent UI performances. > > Please also refer the thread, I just posted on architecture, Proposing a > components layer across all WSO2 > UIs<http://markmail.org/message/kcnmbsicxf3aijfr> > too. > > [1] > http://www.w3.org/TR/html5/dom.html#embedding-custom-non-visible-data-with-the-data-*-attributes > [2] https://github.com/component/component > [3] http://www.w3.org/TR/components-intro/ > [4] > https://github.com/component/component/wiki/F.A.Q#what-about-web-components > > > On Sun, Jun 2, 2013 at 12:57 AM, Manuranga Perera <[email protected]> wrote: > >> 1) >> I am not sure what you referring to by "string templates". >> but I'd like the following version better : >> >> var buildButton = $('<button id="bulid-2.3.0">Build</button>'); >> $("#sandbox").append(buildButton); >> buildButton.bind("click",function (){ >> console.log(version); >> }); >> >> is there any reason to use the version you have mentioned over this? >> >> >> 2) >> when using loop just wrap the loop body in a function to avoid dynamic >> variables being overridden. >> eg: >> for (var i=0; i < 5; i++) { >> (function (buttonId) { >> var buildButton = $('<button>x</button>'); >> buildButton.bind("click", function () { >> console.log(buttonId); >> }); >> })(i); >> } >> >> or just write loop body as a separate function , which some times can be >> more readable >> >> function addButton(buttonId) { >> var buildButton = $('<button>x</button>'); >> buildButton.bind("click", function () { >> console.log(buttonId); >> }); >> }; >> >> for (var i = 0; i < 5; i++) { >> addButton(i); >> } >> >> 3) >> +1 for using 'incremental for loop' for arrays >> >> -- >> With regards, >> *Manu*ranga Perera. >> > > > > -- > *Ruchira Wageesha > **Associate Technical Lead** & Member, Management Committee, Development > Technologies* > *WSO2 Inc. - lean . enterprise . middleware | wso2.com* > * > email: [email protected], blog: ruchirawageesha.blogspot.com, mobile: +94 > 77 5493444* > > _______________________________________________ > Architecture mailing list > [email protected] > https://mail.wso2.org/cgi-bin/mailman/listinfo/architecture > > -- *Thanks & Regards, Nuwan Bandara Technical Lead & Member, MC, Development Technologies WSO2 Inc. - lean . enterprise . middleware | http://wso2.com blog : http://nuwanbando.com; email: [email protected]; phone: +94 11 763 9629 * <http://www.nuwanbando.com/>
_______________________________________________ Architecture mailing list [email protected] https://mail.wso2.org/cgi-bin/mailman/listinfo/architecture
