Patarimai

Kasdien tenka perskaityti ne vieną straipsnį, susijusį su vartotojo sąsajos kūrimu, bei programavimu. Ieškant naudingos informacijos, užtinkam tikrų perliukų, taigi, tęsdamas tradiciją, dalinuosi su skaitytojais, vėliausiai atrastomis įdomiomis nuorodomis. Šį kartą nuorodų nebus taip daug, o jos išskirtinai apie JavaScript ir jQuery:

JavaScript Regex generatorius – pagelbės kuriant reguliariąsias išraiškas, pavyzdžiui skirtas formų generavimui.

Top 20 jQuery Tips and trics, 8 awesome jQuery tips ir 7 tips for better jQuery code – išrenku pačius įdomiausius ir naudingiausius patarimus:

1. jQuery data() metodas, skirtas duomenims bet kokiam DOM elementui priskirti;
2. live()  - būdas priskirti įvykių apdorojimui skirtas funkcijas net prieš DOM elementų sukūrimą;
3. $(‘a[rel=external]‘).attr(‘target’,‘_blank’) – taip geriausia apdoroti naujame lange atidaromas nuorodas išlaikant dokumentą validžiu;
4. if ($(”element selector”).length) {..} – būdas patikrinti, ar elementas egzistuoja. Nors šitaip tikrindavau jau seniai, tačiau dabar galutinai buvo patvirtinta, kad šis būdas geriausias;
5. O taip pat prie šio sąrašo labai tinka frontend.lt prašytas būdas geriau užkrauti JavaScript  - naudoti Google Ajax API.

Šiam kartui tiek, geros savaitės pradžios!

Šiuo metu, nemažai tinklapių yra įgyvendintas dinaminis tinklapio užkrovimas, pvz.: Neperkraunant puslapio, galima naršyti po prekių katalogus. Paprastai toks funkcionalumas vartotojui yra daug patogesnis, nei viso puslapio perkrovinėjimas, tačiau jeigu tokiu būdu reikia užkrauti didelį kiekį informacijos ir serveris veikia lėtai, vartotojas gali būti suklaidintas ir nueiti į kitą puslapį. Kad to išvengti, patariame naudoti krovimosi paveikslėlius “Preloader’ius”, kurie yra rodomi vartotojui, kol yra kraunamas turinys. Pvz.:

Tokius dailius paveikslėlius galite pasidaryti patys, su preloaders.net sistemėle. Joje lengvai susikursite norimą paveikslėlį, nurodydami jo išvaizdą, spalvą, dydį, bei animacijos greitį. Taip pat visi šioje sistemoje sukuriami paveikslėliai gali būti su permatomu fonu, todėl tiks bet kokiame tinklapio dizaine.

Kai sukuriame tinklapį, visada privalome jį pratestuoti su įvairiomis interneto naršyklėmis. Dauguma iš mūsų peržiūri gautą rezultatą tik su naujausia FireFox versija ir Su Internet Explorer 6. Dažniausiai to pakanka, tačiau pasitaiko kokių nors klaidų, kurios galimos ir kitose naršyklėse, nors ir FF ir IE6 viskas būna gerai.

Šiam tikslui Yahoo yra apibrėžusi interneto naršyklių palaikymo klasifikaciją, apie kurią trumpai papasakosiu.

Iš viso yra 3 naršyklių palaikymo klasės (lygiai):

C klasė – žemo lygio ir kokybės palaikymas. Iš esmės tai tik gryno HTML kodo pateikiamas naršyklei, be stilių ar JavaScript įgyvendintų funkcijų. Realizuojant šis klasės palaikymo lygį dažnai pasitaiko įvairių defektų.

X klasė - tai absoliučiai visų naršyklių palaikymas. Realizuojant tokį palaikymo lygmenį yra palaikomos retos arba sustabdyto palaikymo ir vystymo naršyklės – tai reiškia kad tinklapis yra atvaizduojamas teisingai net ir ant pačių rečiausių naršyklių. Toks palaikymas yra įgyvendinamas labai retai, nes dažniausiai neįmanoma nuspėti visų egzistuojančių naršyklių niuansų.

A klasė – Pati svarbiausia klasė, nes tai palaikymo lygmuo skirtas pačioms populiariausioms naršyklėms.  Šis lygmuo, pagal Yahoo statistiką yra įgyvendintas 96% tinklapių. Būtent šio lygmens mes ir rekomenduojame laikytis.

Kad būtų lengviau “sugaudyti”  kokias naršykles privalo palaikyti A-klasės palaikymas, čia pateikta naršyklių matrica, kuri parodo visas A klasės naršykles:

Darbui su JavaScrip palengvinti yra naudojamos įvairios bibliotekos. Paruošėme receptą, kaip supaprastinti jų užkrovimą – naudotis paslauga Google AJAX Libraries API, kuri padeda patogiai naudoti tokias JavaScript bibliotekas, kaip:  jQuery, jQuery UI, Prototype, Dojo, Scriptaculous, SWFObject, MooTools, Yahoo! User Interface Library, Ext Core  ir kitas. Pilnas sąrašas pateikiamas dokumentacijoje.

Kodo pavyzdys jQuery 1.3.2 bibliotekos užkrovimui, tačiau su minimaliomis modifikacijomis pritaikomas ir kitoms:

Šis būdas yra geras tuo, kad:

1. Bibliotekos versiją įterpti ir atnaujinti yra lengviau ir greičiau – nereikia siųstis naujausios versijos į savo kompiuterį, išpakuoti, sukelti į serverį, atnaujinti kelius iki bibliotekos bylų svetainės kode. Vienintelis pakeitimas – versijos numerio atnaujinimas HTML kode.
2. Taip yra greičiau – naršyklės riboja lygiagrečių JavaScript failų siuntimų skaičių iš vieno serverio, šiuo atveju kodas yra siunčiamas iš Google serverių.
3. Taupote resursus – bibliotekos saugomos Google serveriuose, naudojamas srautas.