Framework-uri JavaScript: Introducere


Daca am vazut ca in cazul framework-urilor CSS existau atat pareri pro cat si pareri contra, in cazul framework-urilor JavaScript parerile sunt aproape toate in favoarea folosirii lor. Numai ca exista o problema: exista atat de multe framework-uri CSS in acest moment, incat oricine isi pune problema folosirii unui framework nu poate sa nu se intrebe: care este cel potrivit pentru mine?

O parere cu care sunt personal de acord este ca framework-urile nu concureaza intre ele, ci toate lupta cu limitarile si diferentele dintre implementarile de JavaScript ale browserelor. Si atunci ce caracteristica a unui framework face pe cineva sa aleaga acel framework?

Sa vedem care sunt principalele caracteristici ale celor mai populare framework-uri in acest moment. Mai intai, care sunt cele mai populare framework-uri? Acesta este un subiect popular de discutie, insa cele la care eu ma gandesc atunci cand spun framework JavaScript sunt urmatoarele (nu sunt intr-o ordine anume): Prototype (care de obicei se foloseste impreuna cu script.aculo.us), Mootools, jQuery, YUI, Dojo.

Aceste framework-uri pot fi impartite in doua categorii: jQuery, YUI, Dojo folosesc namespace-uri pentru toate functiile lor, Mootools si Prototype nu folosesc namespace-uri si ca urmare, nu pot fi folosite, de exemplu, ambele in acelasi proiect fara a aparea conflicte.

Haideti sa alegem doua framework-uri despre care sa vorbim un pic mai mult si in care sa implementam functionalitati in articolele viitoare. Asta inseamna ca trebuie sa taiem din lista de 5 framework-uri, 3 dintre ele.

Primul pe care il taiem este Dojo. Cu toate ca pare sa aiba cele mai multe functionalitati disponibile de-a gata, nu este folosit pe site-uri foarte cunoscute (Update: Dylan Schiemann, unul din creatorii Dojo Toolkit, imi atrage atentia (si are dreptate) ca toolkit-ul este folosit si de companii importante (AOL, IBM, Sun, si este chiar integrat cu Zend Framework); desigur, faptul ca este sau nu folosit pe site-uri mari nu ar fi trebuit sa fie un factor decisiv in primul rand) si se spune ca ar merita folosit numai in proiecte medii si mari. (Totusi, daca vreti motive pentru care sa folositi Dojo, iata doua articole care il sustin: Debunking Dojo Toolkit Myths si Why Dojo?)

Apoi, YUI, cu toate ca are in spate Yahoo, pare a fi cel mai lent atunci cand folosim selectori complecsi (conform testului SlickSpeed), si desi faptul ca foloseste namespace-uri este un lucru bun, faptul ca trebuie sa folosesti YAHOO.util.Dom.get si YAHOO.util.Selector.filter pentru a selecta/filtra elemente din DOM, in loc de faimoasele functii $ si $$ din celelalte framework-uri, face ca YUI sa fie al doilea framework pe care il taiem de pe lista.

Pe jQuery oricum nu o sa-l taiem pentru ca este oarecum unic printre framework-uri si, cel putin in ultima vreme, este foarte popular (recent a capatat sustinere din partea Nokia si Microsoft), deci a ramas sa alegem intre Mootools si Prototype. Aici, poate este un pic mai dificil sa alegem, pentru ca Mootools si Prototype sunt foarte asemanatoare. O sa aleg Mootools (si o parte din motivele alegerii o sa le vedeti mai jos), dar este notabil faptul ca sunt farte asemanatoare intre ele, deci ar trebui sa fie usor ca dupa ce inveti Mootools, sa poti sa treci la Prototype (sau invers).

Ca istorie, MooTools isi are radacinile in pluginul moo.fx, un plugin (compact) cu efecte pentru Prototype. Printre punctele forte ale sale se numara faptul ca este modular – se pot selecta numai acele module de care este nevoie pentru un anumit proiect, ajungand astfel la dimensiuni foarte mici ale framework-ului. Apoi, ca implementare, MooTools lucreaza prin modificarea prototipurilor obiectelor native din JavaScript (vezi Obiecte in JavaScript), pe langa faptul ca adauga noi obiecte. Este excelent pentru animatii ale elementelor din pagina (are module pentru Drag and Drop, sau pentru tranzitii ale oricarei proprietati CSS intre doua valori). Si mai interesant, exista un modul MooTools numit Class, care incearca sa creeze un mecanism de creare/extindere de clase asemanator limbajelor OOP ca Java. Exista o comunitate suficient de mare, si o multime de plugin-uri 3rd party facute pentru MooTools (plugin-urile Clientcide sunt excelente, insa exista o multime de alte plugin-uri; descoperirile mele le gasiti pe delicious).

Spre deosebire de MooTools, jQuery nu schimba prototipurile obiectelor native, ci nucleul framework-ului il constituie seturile de elemente – multimi de elemente DOM incapsulate (eng. wrapped set). O caracteristica puternica este faptul ca apelul metodelor multimilor de elemente pot fi inlantuite cu mare usurinta – aproape toate metodele care lucreaza pe aceste multimi, au ca valoare returnata aceleasi multimi asupra carora au lucrat sau o submultime a acestora. Se spune ca jQuery are o sintaxa mai apropiata de SQL (eng. SQL-like) decat de JavaScript, in vreme ce celelalte framework-uri au o sintaxa mult mai apropiata de JavaScript. jQuery dispune de un motor de selectori CSS foarte puternic, care suporta selectorii CSS3 cat si cativa selectori custom.

Acestea fiind spuse, vor urma doua articole, in care sa vedem cum putem manipula DOM, adauga evenimente si folosi AJAX, dar de data aceasta folosind MooTools si respectiv jQuery.

Link-uri utile:

, , , , , , , ,

blog comments powered by Disqus