Zepto

Autor: Zlatan Vasović

Zepto je popularna alternativa jQuery biblioteci sa aktivnim razvojem.

Zepto je mnogo „lakši”, brži i više prilagođen mobilnim uređajima. Zato se često koristi na sajtovima sa prvenstvenom namenom za mobilne uređaje.

Zepto je veličine ~10KB, dok je jQuery ~80KB, što je čak osam puta veće.

jQuery ima podršku za stare desktop pregledače (IE <9), dok je Zepto nema. On ima odličnu podršku za mobilne pregledače.

Osnovni moduli:

• zepto: modul sa većinom metoda
• event: upravljanje događajima u pregledaču
• ajax: upravljanje HTTP zahtevima
• form: upravljanje formama
• ie: podrška za IE 10+

Ostali moduli:

• detect: informacije o operativnom sistemu i pregledaču
• fx: osnovna metoda za animacije
• fx_methods: dodatne metode za animacije
• assets: eksperimentalna metoda za čišćenje slika iz iOS memorije nakon uklanjanja elemenata
• data: metoda za skladištenje proizvoljnih objekata
• deferred: pomoćni modul za takozvane promise-ove, specijalne događaje u pregledaču
• callbacks: pomoćni modul za deferred
• selector: eksperimentalna podrška za jQuery selektore, kao što su $(‘div:first’) i el.is(‘:visible’)
• touch: podrška za događaj dodira prsta (eng. touch event)
• gesture: podrška za gesture
• stack: dodatne ciklične metode
• ios3: nedostajuće String.prototype.trim i Array.prototype.reduce metode za iOS3

Potpuna podrška:

• Safari 6+ (OS X)
• Chrome 30+ (Windows, OS X, Android, iOS, Linux, Chrome OS)
• Firefox 24+ (Windows, OS X, Android, Linux, Firefox OS)
• iOS 5+ Safari
• Android 2.3+ Browser
• Internet Explorer 10+ (Windows, Windows Phone)

Delimična podrška:

• iOS 3+ Safari (uz opcioni modul)
• Chrome <30
• Firefox 4+
• Safari <6
• Android Browser 2.2
• Opera 10+
• webOS 1.4.5+ Browser
• BlackBerry Tablet OS 1.0.7+ Browser
• Amazon Silk 1.0+

Primer 1: ciklična petlja

// niz
$.each(['a', 'b', 'c'], function (index, item) {
  console.log('%d je: %s', index, item)
});

// objekat
var hash = {
  name: 'zepto.js',
  size: 'micro'
}
$.each(hash, function (key, value) {
  console.log('%s: %s', key, value)
});

Primer 2: detekcija verzije operativnog sistema i pregledača

// recimo da imamo iOS 6.1
// prefiks `!!` osigurava boolean izlaz (true/false)
!!$.os.phone;      // => true
!!$.os.iphone;     // => true
!!$.os.ios;        // => true
$.os.version;      // => "6.1"
$.browser.version; // => "536.26"

Primer 3: upravljanje događajima u pregledaču

var elem = $('.container');

// praćenje klikova na `elem`
elem.on('click', function (e) { /* ... */ });

// praćenje svih klikova na linkove
$(document).on('click', 'a', function (e) { /* ... */ });

// prekid praćenja svih klikova na linkove
$(document).on('click', 'a', false);

Zepto je odlična alternativa jQuery-ju. Ako su vam prioritet desktop računari, odluka pada na jQuery. Ipak, ako su prioritet mobilni uređaji, Zepto je neuporedivo korisniji (prim.aut.).

Korisni linkovi:
[1] http://zeptojs.com/
[2] https://github.com/madrobby/zepto
[3] http://stackoverflow.com/questions/14830334/what-is-the-difference-between-zepto-and-jquery-2
[4] http://code.tutsplus.com/tutorials/the-essentials-of-zeptojs–net-24867