Optimizare CSS/CSS3

CSS joaca un rol foarte important in dezvoltarea de aplicatii web. Cateva optimizari legate de organizarea codului se pot face astfel:

1.    - CSS ar trebuii sa fie extern fisierului pentru a beneficia de “caching”

2.    - Referintele CSS ar trebui sa fie pus in varful paginii deoarece engine-ul de randare HTML care deasemenea interpreteaza CSS este primul chemat

3.    - Incercati in a evita referintele CSS  duplicate

4.    - Dimensiune Fisierelor CSS

O alta practica buna este aceea in minimizare de cod prin folosirea avantajului de a grupa elementele logic. Cateva exemple ar fi:

1.    - background (controleaza elementele din background, pozitionarea lor, cat de mult se repeta)

2.    - font (font-size, font-weight, line-height, etc)

3.    - margin( defineste latimea marginii unui compartiment)

4.    - border (defineste proprietile pentru frontiera compartimentului)

5.    - padding (defineste latimea umpluturii in laturile compartimentului)

O problema generata de CSS care duce la performante scazute in JavaScript sunt legate de redesenari in browser. Numeroase inbunatatiri de performanta pot fi obtinute prin aplicarea de animatii la elemente care au pozitie fixa sau absoluta si evitarea de expresii JavaScript in CSS.

CSS3

CSS 3 aduce multe lucruri si efecte noi ce inainte puteau fi facute doar folosind Flash, Javascript sau alte librarii. Deasemenea avem optiune pentru gradient implementat in cod cat si diferite efecte ce pot fi aplicate direct pe unele imagini cum ar fi shadow sau optiuni pentru hover,border,combinarea de imagini si multe altele fara a fi nevoie ca acestea sa fie complexe de la bun inceput si de o capacitate ridicata. Acest lucru acorda si o mare flexibilitate in design nemaifiind nevoie sa inlocuim imaginea toata ci doar sa scriem codul pentru efectul dorit. Toate acestea duc la o reducere a resurselor ce trebuie stocate la nivel de client.