IE9 FTW!

Am instalat și eu IE9 într-o mașină virtuală, să văd și eu despre ce naiba vorbește toată lumea. Prima impresie? Rapid! În mașină virtuală mi se încarcă mai repede decât orice browser rulat nativ (nu virtualizat) iar taburile se deschid instant (spre deosebire de IE8, în care dura vreo 2-3 secunde până se deschidea un nou tab). Cu toate astea, există anumite probleme:

  1. Cufon nu merge;
  2. Document Mode: IE9 fute layout-ul la un site ce merge fără probleme pe orice alt browser (inclusiv ie7/8);
  3. Același Document Mode IE9 introduce o chestie căreia îi simțeam lipsa. Not! Jumping bug!

Din păcate însă, astfel de probleme au fost și când a fost lansat IE8 beta (care culmea, era la fel de standard compliant ca un schnitzel într-un motor de avion IE9). Știu că se voi primi suficiente mailuri de la clienți supărați că nu li se vede site-ul bine într-un browser aflat într-un stadiu beta. Și mai știu că unii se vor supăra și că alții vor înțelege că nu pot oferi suport tehnic pentru un browser aflat în stadiu beta.

Alte chestii amestecate:

  1. Dacă îi dai view source la o pagină ai o surpriză plăcută: ai syntax highlight!
  2. Butonul de compatibility mode l-au mutat, nefiind nevoie să intri în meniuri. Chestia asta există și în IE8, dar… nu am văzut-o. Bonus, există și shortcut (alt+7,8,9) pentru diverse moduri. Din păcate însă, scurtăturile astea merg doar dacă ai focus pe developer toolbar. No biggie.
    Cu toate astea, ar fi fost ok dacă se putea alege modul de compatibilitate (la click dreapta, de exemplu) între IE7 și IE8. Totodată, o chestie care mă amuză: existența unei astfel de funcții înseamnă oare că MS recunoaște că versiunea anterioară era de căcat? :D
  3. Pentru a adăuga un site la favorite este nevoie de minim două click-uri și mișcarea mouse-ului.
  4. Când vrei să validezi un site din Dev Toolbar te duce întâi pe site-ul MS după care pe site-ul W3C. Eu înțeleg că vor să facă statistici cu modul de utilizare, dar totuși…
  5. text-shadow lipsește. Cu desăvârșire. Ce dacă are vreo 3-4 ani de când a apărut și este suportat nativ de restul browserelor (fără niciun prefix)? IE9 e mai tare!

Momentan atât. Timpul nu îmi permite un review mai amănunțit. Cei de la Nettuts se pare că au avut mai mult timp. :D

JavaScript – parseInt()

parseInt() este o functie ce îți permite să extragi primul număr întreg dintr-un șir de caractere. Exemplu:

var string = '123foo456';
parseInt(string); // 123

var string = '1.23foo456';
parseInt(string); // 1

var string = 'foo';
parseInt(string); // NaN

Observi că nu extrage toate numerele, ci doar primul număr întreg. De asemenea, dacă stringul interpretat nu conține niciun număr, funcția returnează NaN (not a number).

Ceea ce nu știu prea mulți – cu toate că este scris în (aproape) toate documentațiile existente, funcția acceptă un parametru suplimentar: baza (decimal, octal sau hexazecimal) în care se face conversia. De cele mai multe ori însă, browserul e suficient de inteligent să ghicească în ce bază, doar că… se mai întâmplă și minuni:

var string = '010';
parseInt(string); // 8

var string = '0x10';
parseInt(string); // 16

Prin urmare, sfatul meu este ca întotdeauna să folosești al doilea parametru, în funcție de baza în care lucrezi:

var string = '010';
parseInt(string, 10); // 10

var string = '0x10';
parseInt(string, 10); // 10
Resurse suplimentare:

Am fost foarte ocupat săptămâna asta, prin urmare… am strâns foarte puține linkuri. Sper să nu pun în curând „link-ul saptămânii” :D

  1. Event delegation pentru iPhone. Și partea a doua.
  2. Cum stăm cu suportul pentru HTML5 și CSS3 în IE9? Așa și-așa. E bine totuși că avem border-radius, audio, video și canvas. Era bun și un text-shadow, dar știi cum e: vrabia mălai visează… :D
  3. O listă drăguță cu diverse bucăți de cod pentru WordPress.

Acolade în JavaScript

Niciodată nu mi-a plăcut codul scris foarte lăbărțat:

function foo()
{
    //cod
}; //foo

Nu mi-a plăcut dintr-un motiv foarte simplu: lungește inutil codul și îl face un pic mai greu de citit. Desigur, cei ce scriu codul în acest fel vor sări să mă contrazică și să-mi spună că modul „celălalt” de a scrie codul este înghesuit și greu de citit (din punctul lor de vedere, desigur :D ):

function foo() {
	//cod
}; //foo

Așa cum (probabil) știi, JS este suficient de prietenos încât nu îți impune să folosești punct și virgulă la sfârșitul fiecărei instrucțiuni, ci presupune că un rând nou înseamnă sfârșitul instrucțiunii. Doar că… nu-i întotdeauna bine că se întâmplă așa. Mai ales dacă scrii lăbărțat!

Exemplu:

function foo()
{
	return // funcția se oprește din execuție aici
	{
		foo : "bar"
	};
}; //foo
alert(foo());

Rezultă un minunat undefined, posibil generator de fire de păr alb/smuls și riduri timpurii. :D

Variabile globale în JavaScript

O chestie scurtă pe care am aflat-o „the hard way” :

(function(){
 var foo = bar = 1;
});

Una e locală (foo), una e globală (bar).

Și rezolvarea, desigur:

(function(){
 var foo, bar;
 foo = bar = 1;
});

Java = JavaScript

La fel cum:

  • ham = hamster;
  • caș = cașcaval;
  • cal = calapod;
  • dor = dormitor;
  • etc…

Ai prin ideea?

  1. O introducere în MySql triggers. Cred că s-ar putea spune declanșatori, dar traducerea probabil ar provoca confuzie.
  2. O chestie care mi-ar fi prins bine în urmă cu aproximativ jumătate de an (poate chiar mai bine) când mă luptam cu un WordPress (prea) customizat: JSON API;
  3. Tot despre WordPress: custom tweet button;
  4. Și dacă tot am început cu WordPress, iată cum îți poți personaliza panoul de administrare.
  5. Continuăm cu WordPress: theme options. Ce sunt ele, cum se fac și cum se fac bine. Exemple și tutoriale.
  6. Sprout Core 1.4 a fost lansat. Asta așa, că tot mă apucasem eu cu câteva zile în urmă să testez diverse chestii :D Între timp a apărut 1.4.1
  7. Ce este adevărat și ce nu despre HTML5? O listă cu treburi bune de știut, picată la fix, după ce toată săptămâna am explicat la vreo patru persoane că HTML5 are parte de un hype mai mare decât ar trebui.
  8. Jquery UI 1.8.5 a fost lansat. Ceea ce mi-a adus aminte că nu am mai folosit de mult altceva în afară de autocomplete (și parcă datepicker, dar nu sunt foarte sigur).
  9. De la cine ai putea învăța JS dacă nu de la un guru? De la mai mulți guru!
  10. Un mod tare interesant de a ține minte cookie-urile: evercookie: cookie normal, local storage, global storage, flash etc. Șanse ca un user să-și șteargă cookie-urile de la tine sunt… cum se spune aici, la voi? MINIME!
  11. E-texteditor 2.0 a fost lansat cu aproximativ o lună în urmă. Una din chestiile noi introduse este un soi de consolă (command mode), funcționalitate asemănătoare cu Vi. Există un post pe blogul E-text și un command cheatsheet.
  12. Câteva tutoriale, resurse, screencasts despre vim au apărut și pe nettuts;
  13. În cazul în care te-ai săturat de clasicul Lorem Ipsum, iată o alternativă!
  14. 10 lucruri despre usability bazate pe studii.
  15. Chiar dacă nu prea are legătură cu web dev, uite o listă cu cinci aplicații pentru editare video. Toate sunt gratuite.

Btw, doar mie Disqus mi se pare o tâmpenie cruntă?

Chestii enervante în interfețe

Cu riscul de a fi catalogat (iar!) ca hater, hai să îți zic câteva chestii văzute prin diversele interefețe cărora eu nu le văd logica. Dacă ai vreo explicație… Simte-te liber să-mi povesteși și mie de ce:

1) Dacă ai email-ul meu și m-am autentificat cu contul de twitter, de ce nu îmi arăți avatarul? De ce este nevoie să fac upload la o imagine când ai două surse din care îmi poți lua imaginea? (Digg)

2) De când nu mai e la modă paginarea așa cum o știam eu? (adică aia cu « 1 2 3 4 ..... 999 ») Cât am dormit? Înțeleg că se actualizează totul atât de repede încât o paginare clasică nu se pretează, dar gândește-te ce se întâmplă când – după 30 de pagini încărcate – îți crapă browserul? E greu să faci o paginare în funcție de id-ul curent? Twitter și Digg fac treaba asta.

3) Video playerul de pe ipad (și bănuiesc că pe iphone e la fel) arată progress bar în partea de sus când e full screen și în partea de jos când nu e full screen?

Cum înveți să programezi?

O întrebare de bun simț pusă de cei de la 37signals: Cum înveți să programezi?

Treaba asta mi-a adus aminte grav de sfârșitul anilor ’90 când tocmai descoperisem internetul și am zis: „Wow! Cred că asta o să fac!”. Am început cu modificarea paginii Yahoo! Sau cel puțin așa credeam eu atunci și, încet, încet, am involuat evoluat la frontpage, home.ro, tabele (scrise în notepad, că era cool!), dreamweaver, crossbrowser, rentacoder. Înainte să-mi dau seama, am ajuns să trăiesc din asta. Zece ani mai târziu am trecut de toate etapele de mai sus. Au rămas toate în urmă, ca o amintire plăcută, dar continui sa învăț și continuă să-mi placă.

Vrei să înveți să programezi? Trebuie să îți placă ce faci! După ce oprești PC-ul să continui să te gândești la ce ai de făcut. Sau la cum ai putea îmbunătăți ce ai făcut deja. Un programator este programator full time. Nu 8h/zi.

Crezi că te încadrezi? Crezi că poți învăța să programezi?

Sfaturi pentru wanna be

Acest post este scris la draci, după modificat câteva zeci de mii de linii de cod (ultimele două luni), deci iertată-mi fie incoerența.

Așadar. Dacă tot de dai mare web developer sau ceva de genul, bagă în plm la cap următoarele:

  • Unele elemente au implicit display:block Exemplu:p, form, div etc
  • Altele au implicit display:inline (cum ar fi span, em, strong), display:table-cell (td, th) șamd.
  • În sfârșit, altele capătă display:block în momentul în care îi aplici un float.

Altfel spus: nu mai folosi ca dobitocu’ toate proprietățile doar să fie! Să dai display:block la un div sau la un element cu float este echivalent cu a pune o clanță la clanța de la ușă!

Ah, da, și folosește-te în plm de clase și id-uri! Nu pune ca tâmpitu’ stiluri inline!

Și pentru clienți: utilizatorii site-ului vostru nu dau doi bani că site-ul arată diferit în browsere diferite. De fapt, sunt șanse MINIME ca un utilizator să nu observe asta! Și știi de ce? Pentru că utilizatorii folosesc un singur browser! Dacă nu funcționează la fel în toate browserele ar trebui să-ți faci probleme!