Si acesta este unul dintre motivele pentru care eu prefer FireFox!

Ca tot scriam de unelte utile si nepromovate in postul trecut, acum m-am gandit sa listez cateva plug-in-uri interesante pentru browserul meu favorit, FireFox!

Si acestea sunt cateva plugin-uri care mi se par utile cand vine vorba de development si nu numai:

YSlow – dezvoltat de Yahoo! pentru a urmarii cateva reguli de baza pentru viteza de incarcare a paginii

Web Development toolbar – adauga un toolbar cu diverse instrumente foarte utile pentru development

Firebug – unealta arhicunoscuta pentru debuging live de DOM si CSS

Live HTTP Headers – pentru a se vedea headerele care transmit in tranzactii si chiar genera raspunsuri

IE Tab – afisaza pagina in motorul de Internet Explorer… fara sa-l deschida, foarte util pentru teste de compatibilitate fara a fi nevoie sa se deschida o noua fereastra, iar schimbarea se face cu un singur click

ColorZilla – una dintre facilitatiile foarte interesante este care are un picker de culori care se poate folosi direct in browser, asta pe langa multe alte unelte

FireShot – pentru screenshot-uri de pagina direct in browser, una din facilitatile utile este ca se pot face screenshot-uri la intreaga pagina (inclusiv zonele care nu se vad)

MeasureIt – traseaza linii pentru a masura elemente din pagina

Venkman – debugger de JavaScript (despre care am mai scris)

FireFTP – client ftp pentru FireFox, simplu si util

Console2 – un inlocuitor mai avansat pentru Error console

Regular Expression Tester – cum spune si numele, unealta pentru expresii regulate

Nagios Checker – pentru monitorizarea serverelor

Live PageRank – pentru a vedea PR-ul paginii curente

Evident lista este scurta si nu sunt decat cateva plug-in-uri care le prefer eu. Lista completa este gigantica si cuprinde cam tot ce ai visat sa aiba un browserul si chiar mai mult.

Din ciclul unelte utile dar nepromovate, in aceasta seara avem o mica unelta numita Venkman. Unealta este realizata ca extensie pentru FireFox si se foloseste pentru debugging a codului JavaScript.

Nu stiu daca mi se pare mie sau chiar sunt foarte putine instrumente pentru asa ceva? Google Chrome are niste unelte foarte interesante pentru urmarirea proceselor JavaScript, iar probabil la polul opus se afla Internet Explorer cu niste mesaje deosebit de generice (si suficient de inutile) cu privire la erorile gasite.

Dar de multe ori nu sunt erori de cod ci erori de logica.

Dar sa revenim la Venkman, acesta ofera posiblitatea de a urmarii executia pas cu pas, de a opri un script sau de a continua. Imi aduce aminte de uneltele din Visual Studio pentru C++, evident nu este la nivelul acela dar este un mare pas inainte pentru JavaScript.

In ultimele luni am incercat sa fac mici joculete in JavaScript, iar o astfel de unealta mi se pare foarte utila pentru a urmarii executia pas cu pas.

Oricum mi se pare ca JavaScript a devenit doar de putin timp apreciat la adevaratul potential, iar aceste unelte aduc limbajul la nivelul la care merita.

Asteptam de ceva vreme video-ul acesta si intr-un final a aparut.

Douglas Crockford este una dintre cele mai importante persoane in comunitatea JavaScript. Modul in care pointeaza toate problemele legate de JavaScript mi se pare genial, parca te tine in tensiune pana la final sa vezi care sunt si partile bune.

Ca tot postam zilele trecute legat de incompatibilitati cu adevarat enervante, zilele trecute am descoperit un bug care l-am plantat cu succes de mai bine de un an jumatate.

Aveam niste campuri, respectiv:

1<input id="cos1" name="cos20" type="text" />
2<input id="cos2" name="cos19" type="text" />
3<input id="cos3" name="cos18" type="text" />
4--------
5<input id="cos10" name="cos11" type="text" />
6<input id="cos11" name="cos10" type="text" />

Ideea era ca atunci cand trebuie sa verific din JavaScript sa o fac folosind un for() iar din PHP folosind numele.

Codul JavaScript arata cam asa:

1for(var i=1; i<=coshmax; i++)
2{
3     element = document.getElementById("cos"+i).value;
4     if(element>0 && !isNaN(element))
5           faCeva();
6}

Pana aici totul bine, am testat aplicatia de nenumarat ori si nu a fost nici o problema.

Pana acum cateva zile cand am primit o reclamatie ca exista o problema pe la ultimele optiuni, respectiv asta se traduce prin ultimele variabile. Am inceput sa testez in Internet Explorer pentru ca acesta era deschis, apoi am testat si in FireFox ca sa urmaresc codul JavaScript si surpriza… in FireFox mergea fara probleme.

Am pierdut aproape jumatate de ora holbandu-ma si punand alert()-uri ca sa inteleg ce se petrece, apoi am realizat: Internet Explorer nu face mare diferenta intre id si name.

Problema era ca atunci cand apelam id-ul cos10 primeam valoarea de la id=”cos10″, cand testam cos11 primeam valoarea de la name=”cos11″. Rezultatul: nu mai testam ultima variabila nicioada.

Evident solutia a fost simpla, am redenumit id-urile ca sa nu mai existe artibute name si id cu aceeasi valoare.

Cazul acesta nu a fost foarte “trist” pentru ca am rasit bug-ul si am putut sa trec mai departe la ce faceam, dar daca eram la final de program dupa o zi agitata cred ca rezultatul era cu totul altul.

Problema este cu atat mai ciudata cu cat daca uiti sa redenumesti un element poti sa te trezesti cu un bug de toata frumusetea, respectiv daca in loc sa dai la un element name ii dai id, o sa mearga in Internet Explorer si… cam atat, de ex:

1<input type="text" id="variabila" />

in Internet Explorer va fi trimis foarte frumos ca orice alta variabila, iar in alte browsere cum ar fi FireFox evident… nu!

Si dupa ce ca bug-ul asta era foarte greu de remarcat oricum nu aparea decat in cateva cazuri speciale, motiv pentru care a si stat linistit un an jumatate.

Povestea incepe pe la inceputul Internetului, atunci cand WWW era inca la inceput, conexiunea se facea prin linii telefonice incete iar Mosaic facea furori. Dar a trecut mult timp de atunci, acum problema generala e cum sa faci o pagina web sa se miste ca o aplicatie Desktop si sa arate ca nimic altceva vazut pana acum. Dar cum unicitatea este doar o problema de timp iar aplicatile web nu vor ajunge niciodata cu adevarat aplicatii desktop nu are rost sa vorbesc despre asta.

Problema este ca o data cu dezolvarea Web-ului tehnologiile au inceput sa fie confilctuale, iar cand spun asta nu ma refer la lucruri cum ar fi ca Microsoft nu a implementat in Internet Explorer sau ca

are margin in Internet Explorer iar in FireFox nu, ma refer la lucruri cu adevarat enervante, cum ar fi incompatibilitatile intre DOM din JavaScript si cel din JScript de la Microsoft. Unul din site-urile care mi se par bizar de incompatibile cu Internet Explorer este site-ul Ubuntu.

Ubuntu.com in Internet Explorer

Ubuntu.com in FireFox

Cand esti o distributie de renume cum e Ubuntu e usor de inteles de ce nu te preocupa compatibilitatea cu IE dar asta nu se aplica si in general. Nu poti pur si simplu sa te duci la un client si sa-i explici ca pe tine nu te intereseaza compatibilitatea cu un anumit browser pentru ca numarul clientiilor va scadea in mod dramatic. Acesta este si unul dintre motivele pentru care nuprea poti sa faci design sau programare JavaScript in linux, cel putin nu lucruri complexe fara sa testezi in Internet Explorer, cel putin partial.

Din pacate se pare ca nici versiuniile Internet Explorer nu sunt tocmai compatibile intre ele, iar cum in acest moment cel mai folosit browser (in Romania) este Internet Explorer 6, urmat la mica distanta de Firefox 3 si Internet Explorer 7, la construirea unui site trebuie luate in calcul toate cele 3 versiuni.

Problema cea mai mare este ca Web-ul acum nu mai este doar pentru sisteme Desktop si eventual cateva Laptop-uri de ultima generatie cum era cu ani in urma, acum exista sisteme cu diverse sisteme de operare, dispozitive mobile etc. De exemplu eu am pe telefonul mobil (HTC Touch Diamond) doua browsere in mod implicit, Internet Explorer si Opera 9.5 pentru mobil, diferentele sunt foarte mari si cu parere de rau Internet Explorer pentru mobil este deosebit de slab! Ca webdeveloper trebuie sa iei in calcul marea majoritate a dispozitivelor de pe piata, nu poti ignora un segment de piata si in special dispozitive de lux, acel segment de piata este foarte important pentru oricine.

Din fericire toate aceste probleme se rezuma de cele mai multe ori la compatibilitatea dintre diferite versiuni de Internet Explorer si celelalte browsere care sunt in general surprinzator de compatibile intre ele. De exemplu eu testez aplicatile in general doar in Internet Explorer si FireFox pentru ca in general daca se comporta similar in cele doua se vor comporta similar si in Opera, Safari, Chrome si altele.

Sa speram ca o data cu Internet Explorer 8 se vor mai reduce din problemele de incompatibilitate si pe segmentul de piata detinut de Microsoft si o data cu asta Internetul va redeveni nu doar pentru toata lumea ci si pentru toate browserele.