frontend.lt » javascript

BoilerPlate HTML5 šablonas

Petras — Mon, 07 Mar 2011 10:52:11 +0000

Programuojant web HTML šablonus, prieš pradedant dažniausiai tenka atlikti nuobodų ir mechaninį darbą – pasiruošti šablonų išdėstymą, įtraukti skriptus, sudėlioti “fix’us”, bei daug kitų dalykų, kurie paprastai pasikartoja visuose projektuose. Turbūt nesuklysiu pasakydamas, jog dauguma web programuotojų turi pasiruošę vienokius ar kitokius bazinius šablonus, kuriuos naudoja.

Nesenai atradau vieną visiems prieinamą šabloną HTML5 BoilerPlate: http://html5boilerplate.com/, kurį čia norėjau pristatyti. Šio šablono esmė, priversti senesnes naršykles palaikyti HTML5 žymas. Nors kol kas tai nėra itin reikalinga funkcija, šiame šablone yra daug įvairių dalykų, dėl kurių jį verta naudoti:

Iš karto paruošta failų struktūra ir įtraukti reikalingi išoriniai skriptai, su “fallback’ais” į lokalius skriptus. (yra netgi Google Analytics :) )
Optimizavimas mobiliesiems įrenginiams
Senesnių naršyklių palaikymas ir visi reikalingi fixai (net IE6)
.htaccess direktyvos (www peradresavimas, duomenų kompresija)
Optimizuoti spausdinimo šablonai

Geriausias dalykas yra tai, jog iš šio šablono galima pasiimti tik funkcijas kurių reikia, bei papildyti savo paties naudojamą šabloną :)

Nuorodos #2

andrius — Sun, 27 Sep 2009 13:11:06 +0000

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:

jQuery data() metodas, skirtas duomenims bet kokiam DOM elementui priskirti;
live() - būdas priskirti įvykių apdorojimui skirtas funkcijas net prieš DOM elementų sukūrimą;
$(‘a[rel=external]‘).attr(‘target’,‘_blank’) – taip geriausia apdoroti naujame lange atidaromas nuorodas išlaikant dokumentą validžiu;
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;
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!

Sprendimas kuris gelbsti: Firebug Lite

Petras — Tue, 04 Aug 2009 11:27:02 +0000

Turbūt nei vienas tinklapių kūrėjas neapsieitų be Galingiausio FireFox priedo – FireBug, kuris yra pripažintas pačiu naudingiausiu įskiepiu. Gaila, tačiau FireBug kol kas galima įsidiegti tik į FireFox, o kitų naršyklių Web-developer įrankiai negali jam prilygti. Tam, kad situacija būtų nors kiek geresnė FireBug Kūrėjai sukūrė pilnai JavaScript’u parašyta FireBug Lite versiją, kurią galima įsidėti į bet kokį tinklapį ir matyti visose naršyklėse (Juk JS palaiko visos naršyklės)

Paprasčiausias būdas naudotis šiuo įrankiu yra įsikelti jo kodo nuorodą į savo Bookmark’us – Tiesiog nutempkite FireBug Lite tinklapyje pateiktą nuorodą į savo BookMarko juostą ir turėsite nuorodą, kurią paspaudus FireBug Lite atsidarys bet kuriame tinklapyje.
Gaila tačiau ši FireBug’o versija dar negali redaguoti tinklapio turinio, bet manau pradžia jau padaryta :)
Taip atrodo FireBug Lite:

Patarimas: JavaScript bibliotekų užkrovimas

andrius — Sat, 20 Jun 2009 11:32:37 +0000

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:

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.
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ų.
Taupote resursus – bibliotekos saugomos Google serveriuose, naudojamas srautas.