DevProTalk

DevProTalk (http://www.devprotalk.com/index.php)
-   (X)HTML, JavaScript, DHTML, XML, CSS (http://www.devprotalk.com/forumdisplay.php?f=8)
-   -   CSS optimizacija (http://www.devprotalk.com/showthread.php?t=1395)

Vladimir Nikolic 19. 08. 2006. 20:26

CSS optimizacija
 
Za optimizaciju CSS-a preporučujem
ovu stranicu: http://iceyboard.no-ip.org/projects/css_compressor

Sa tim na lak način možete da smanjite veličinu CSS-a.

Ali oprezno: ako aktivirate sve opcije, rezultat može biti greška
u nekim browserima.
Zato oprezno podešavanje i eksperimentisanje.

Sa poštovanjem

Nikolić Vladimir

[nq] 19. 08. 2006. 22:06

Pozdrav, i dobrodosao.

Da koristio sam ove alate sve ga par puta, probacu da pronacem link ka slicnom, koji ni na najvecem stepenu nazovimo je "kompresije" nije pravio greske.

Off Topic:
:1043: za Limundo, svidja mi se!

Vladimir Nikolic 19. 08. 2006. 22:17

Ovaj CSS-Compressor sam izabrao iz liste.
Bilo je nekoliko, ali se ovaj pokazao kao najbolji.
Testirali su različite stranica (među njima i digg.com)
i ovaj je imao samo jedanput grešku dok su ostali malo češće grešili.

A i kompresija je ovde jača.

Za početak sam koristio samo najminimalniju verziju (znači ništa nije štiklirano).
Sve radi kako treba, a opet po 1.5KB manji.

PS: Hvala na pohvali i dobrodošlici.

[nq] 19. 08. 2006. 22:21

Citat:

Originalno napisao Vladimir Nikolic
Ovaj CSS-Compressor sam izabrao iz liste.
Bilo je nekoliko, ali se ovaj pokazao kao najbolji.

Deder podeli link sa nama, da procitamo.

Vladimir Nikolic 19. 08. 2006. 23:16

Već bi ga napisao da ga još imam.

O meni treba dve stvari znati: volim da se informišem što više moguće.
Prosto upijam informacije (pamćenje je druga stvar :-) ).

A druga stvar: sve što sam pročitao i nema značaj za mena, bacam, prodam ili (kao u ovom slučaju) izbrišem.

Ja mislim da sam preko digg-a naleteo na sajt.

jasmanac 20. 08. 2006. 12:46

Ukoliko pravilno koristis CSS2 ne vidim neku potrebu za optimizacijom...

Vladimir Nikolic 20. 08. 2006. 13:02

Uvek ima prostora za optimizaciju.
Na primer: retko ko pise CSS (ili bilo koji durgi kod) do maksimalne uštede prostora. Ovaj program smanuje CSS, među ostalim opcijama, tako što sklanja whitespace. Samo da (basic) opcija dovodi do smanjenja za nekih 5-10 %.
A mala stranica je cilj koji treba uvek biti u vidu.
Dizajn je bitna stavka, ali ne vredi mnogo ako je sajt preterano velik, tako da dial-up korisnici nemaju želju da čekaju.

Pozdrav

jasmanac 20. 08. 2006. 13:58

Citat:

Originalno napisao Vladimir Nikolic
Dizajn je bitna stavka, ali ne vredi mnogo ako je sajt preterano velik, tako da dial-up korisnici nemaju želju da čekaju.

CSS fajl utice na brzinu ucitavanja stranice ali to su mili/nano sekunde u pitanju tako da je potpuno bespredmetno raspravljati o CSS optimizaciji u ovom slucaju.

CSS optimizacija da ali je pitanje do koje mere? Svaki profesionalni developer tezi ka optimizaciji koda, zato postojie i standardi. Ali nikada necu zagovarati ovakav vid optimizacije.

Prvo sto nije nimalo citak. Ajde otvori da editujes jedan ovako optimizirani fajl? Koliko ti je vremena potrebno da pronadjes liniju koda (u ovom slucaju deo koda jer je sve strpano u jednoj liniji) koju zelis editovati?

kao sto sam i napomenuo ranije, onaj ko se striktno drzi standarda nema potrebe za optimizacijom, narocito ako je u pitanju CSS.

Vladimir Nikolic 20. 08. 2006. 14:11

Nanosekunda?
Ne bih se složio.
Evo ja sam smanjio na početnoj stranici kod za 2,5 kb.
To znači otprilike pola sekunde brže učitavanje na dial-up liniji.
To nije za potcenjivanje.
Pogotovo ako se ovako lako može dobiti.

Editovanje isto nije problem:
Izvorni fajl ostavljaš dalje na serveru.
Onda na njemu izmeniš to što želiš, i ako sve radi kako treba,
odeš na stranicu i opet ka kompresuješ.

Naravno da je malo napornije, ali ću ti korisnici biti zahvalni.
I to je valjda cilj našeg angažovanja.

Slažem se sa tobom, da ovo nije zamena za dobro pisan kod.
Ali sigurno interesantan dodatak.

Sa poštovanjem

Nikolić Vladimir

borstale 20. 08. 2006. 14:34

Citat:

Originalno napisao Vladimir Nikolic
To znači otprilike pola sekunde brže učitavanje na dial-up liniji.
To nije za potcenjivanje.

Meni jeste.

Dragan Babić 20. 08. 2006. 14:46

Ovim štediš tih pola sekunde samo posetiocu koji dolazi po prvi put na sajt, ostalima su eksterni fajlovi kesirani. S Jasmancem sam kod ovoga, jednostavno je pro-con odnos smesan. Da bi malo dobio na brzini (samo za first timere) moram da žrtvujem organizaciju svog CSS fajla -- nema 'leba.

[nq] 20. 08. 2006. 14:46

Citat:

Originalno napisao Vladimir Nikolic
Editovanje isto nije problem:
Izvorni fajl ostavljaš dalje na serveru.

A ako ga slucajno i zaboravis samo odes na w3c i proveris (validate) ga i on ti ga lepo slozi, koliko me pamcenje sluzi.

jasmanac 20. 08. 2006. 14:52

Mislis da je to sto si smanjio CSS fajl za 2,5kb razlog brzeg ucitavanja stranice?

Ako nisi znao, eskterni CSS fajl se ne ucitava ceo vec browser preko HTTP protokola salje zahtev serveru sa koga 'cita' one stilove koji su navedeni u stranici. Ako gresim neka me neko ispravi?

Tvoje resenje bi imalo smisla samo ako embedujes CSS u okviru stranice pri cemu se ceo CSS ucitava zajedno sa html stranicom.

Vladimir Nikolic 20. 08. 2006. 15:05

Citat:

Originalno napisao Dragan
Ovim štediš tih pola sekunde samo posetiocu koji dolazi po prvi put na sajt, ostalima su eksterni fajlovi kesirani. S Jasmancem sam kod ovoga, jednostavno je pro-con odnos smesan. Da bi malo dobio na brzini (samo za first timere) moram da žrtvujem organizaciju svog CSS fajla -- nema 'leba.

To je tačno, ali to nije razlog da ne bude fajl što manji.
Mislim onda bi se isto mogli reći: na početnoj imam sliku od 300KB.
Nije problem, čim ga korisnik učita on mu ostaje u cache-u.
I onda može da uživa u brzoj stranici.

Znam malo sam preterao, nije isto 300KB i 2,5KB,
ali ako se teži ka prefekciji onda se pridržavam japanskog Kaizena.
Nijedna promena nije suviše mala.
Uspeh leži u tim malim promenama.

Sa poštovanjem

Nikolić Vladimir

bluesman 20. 08. 2006. 18:58

Ja sam takođe pristalice ne-optimizovanja, ti fajlovi su ionako mali da je takav korak potpuno nepotreban. Ako je već do optimizacije, bolje je optimizovati jedan JPG, tu može da se uštedi na veličini više nego bilo kakvom optimizacijom css fajlova. Šta se dešava kada želite da promenite nešto u CSS? Morate da imate dve verzije: čitljiva i nečitljiva... previše cimanja za nikavo "dobro".

jablan 20. 08. 2006. 19:31

Citat:

Originalno napisao jasmanac
Ako nisi znao, eskterni CSS fajl se ne ucitava ceo vec browser preko HTTP protokola salje zahtev serveru sa koga 'cita' one stilove koji su navedeni u stranici. Ako gresim neka me neko ispravi?

Grešiš. (Ovo je stvarno provala što si napisao...)

Inače, slažem se sa tobom da nije potrebno optimizovati CSS. Pored toga što se učitava samo prvi put, vrlo je verovatno da je HTTP između vas i servera i tih 2.5kb kompresovao (bacite pogled na http://www.serverwatch.com/tutorials...le.php/3514866 npr) na nekih 500 bajtova (CSS je jaaako zahvalan za *zip kompresiju).

Vladimir Nikolic 20. 08. 2006. 19:59

Kompresija CSS-a nema ništa sa verovatnoćom.

To se podešava na serveru, time što se aktivira (n.pr. mod_gzip na Apache serverima).
Ja sam aktivirao HTML i PHP kompresiju, ali CSS nisam.

Razlog je, što neki browseri imaju probleme sa prikazom kompresovanog CSS-a.
Ali i tu opciju imam u skorije da isprobam i po mogućnosti da aktiviram.

Ako želite da znate koliko je velik vaš sajt, i da li je aktiviran Gzip:

Web Site optimization

Sa poštovanjem

Nikolić Vladimir

jasmanac 20. 08. 2006. 20:09

@jablan: Sorry ja nisam programer a i stavio sam znak pitanja na kraju sto znaci da nisam bio siguran da li je to zaista tako ;)

jablan 20. 08. 2006. 20:17

@vladimir: Rekao sam verovatno u smislu da dobar procenat sajtova koristi kompresiju... Naravno da je to do vebmastera da odluči hoće li je koristiti ili ne i za koje tipove fajlova...

@jasmanac: Ma ok, nisam imao ideju da te prozivam nego reko' da deca ne uče pogrešno... ;)

Ilija Studen 20. 08. 2006. 20:31

Slažem se sa bluesmanom. Glupo bi bilo strpati PNG24 od 50kb i praviti problem oko 2.5kb ekstra CSSa. Ili recimo, gurati CSS priču, a koristiti tag soap gde se ne zna ko pije, a ko plaća od TR i TD tagova.

CSS se kešira, tekst baziran format pa se fino kompresuje što Jablan reče, a svuiše često je potrebno da se odradi quick and dirty fix tako da je uglavnom i više nego poželjno ostaviti ga u originalnom, neoptimizovanom obliku.

Stvari se menjaju kod fajlova koji su veći od 50kb. Kod CSSa je to retko slučaj, ali se zato često znaju sresti glomazni JS fajlovi (po par stotina KB u nekim slučajevima!) Tada kompresija već znači nešto više.

dinke 20. 08. 2006. 20:35

Citat:

Originalno napisao jablan
Grešiš. (Ovo je stvarno provala što si napisao...)

A kako onda objasnjavas ovo:

Kôd:

82.117.208.66 - - [20/Aug/2006:11:39:20 -0700] "GET /blog/ HTTP/1.1" 200 7475 "-" "Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.8.0.6) Gecko/20060728
 Firefox/1.5.0.6"
82.117.208.66 - - [20/Aug/2006:11:39:21 -0700] "GET /blog/wp-content/themes/fsimple/style.css HTTP/1.1" 304 - "http://www.dinke.net/blog/" "Mozilla/5.0 (Wind
ows; U; Windows NT 5.1; en-US; rv:1.8.0.6) Gecko/20060728 Firefox/1.5.0.6"

apache-ov access.log sa dinke.net (nakon moje posete home page-u).

MorenoArdohain 20. 08. 2006. 21:44

I'm back

Dinke, mislim da je jablan hteo da kaze da se css eksterni fajl ucitava ceo, posto je jasmanac mislio da se ucitava deo po deo tj parcijalno, za svaki element stila u strani..

bluesman 21. 08. 2006. 00:02

Na kraju, ne znam zasto je odluka o optimizaciji pala bas na css koji je defiitivno najmanji element strane. U petak mi jedan prijatelj pokaze home page nekih norveskih dnevnih novina, citavih 1.2 Mb. Prvo sam se zgrozio ali onda sam shvatio da je u stvari 90% tamo koristi bradband pa im i ne pada tesko.

Pored toga, kada pogledamo redosled ucitavanja elemenata, css ce sigurno ici pre renderovanja strane pa tek na kraju fotke, sto jednostavno znaci da ce tih 3 ili 7 kb koje "zauzme" css biti neprimetno. Dakle, bolje je trositi vreme, energiju i sive celije na optimizaciju drugih elemenata nego cinculirati sa nečim što je totalno nepotrebno.

Cela ta situacija mi liči na čoveka koji potroši recimo 10 000 eur da renovira stan a onda se dvoumi da li da kupi zvonce za ulazna vrata od 70 ili 80 dinara.

jablan 21. 08. 2006. 00:06

@Moreno: Tako je. Načelno, ta ideja sa parcijalnim povlačenjem CSS-a je teoretski moguća, ali bi bila jaaako zeznuta za izvesti (veb server bi morao parsirati (obično generisani) HTML da bi video šta ovaj traži od klasa itd itd), a u tom slučaju bismo se mogli oprostiti od keširanja CSS-a u brauzeru, pa bi bila veća dara nego mera...

borstale 21. 08. 2006. 00:12

Off Topic:
Citat:

Originalno napisao bluesman
Cela ta situacija mi liči na čoveka koji potroši recimo 10 000 eur da renovira stan a onda se dvoumi da li da kupi zvonce za ulazna vrata od 70 ili 80 dinara.

Imam ja jedno glanc novo, poneću ti kad budem došao krajem nedelje u Bg da ti platim resller. :)

mungos 23. 08. 2006. 21:54

Sačuvaj me Bože kuge i CSS nafuranata...


Vreme je GMT +2. Trenutno vreme je 02:45.

Powered by vBulletin® Verzija 3.6.8
Copyright ©2000 - 2024, Jelsoft Enterprises Ltd.
Copyright © DevProTalk. All Rights Reserved.

Mišljenja, saveti, izjave, ponude ili druge informacije ili sadržaji nastali na Sajtu su vlasništvo onoga ko ih je kreirao, a ne DevProTalk.com, tako da ne morate da se oslanjate na njih.
Autori poruka su jedini odgovorni za ovakve sadržaje. DevProTalk.com ne garantuje tačnost, kompletnost ili upotrebnu vrednost informacija, stavova, saveta ili datih izjava. Ne postoje uslovi pod kojima bi mi bili odgovorni za štetu ili gubitak koji je posledica bilo čijeg oslanjanja na nepouzdane informacije, ili bilo kakve informacije nastale kroz komunikaciju između registrovanih članova.
Web sajt može sadržavati linkove na druge web sajtove na Internetu ili neke druge sadržaje. Ne kontrolišemo niti podržavamo te druge web sajtove, niti smo pregledali bilo kakve sadržaje na takvim sajtovima. Mi nećemo biti odgovorni za legalnost, tačnost ili prikladnost bilo kog sadržaja, oglasa, proizvoda, usluga ili informacije lociranim na ili distribuiranih kroz druge web sajtove, niti za bilo kakvu štetu nastalu kao posledica takvih informacija. DevProTalk.com drži i čuva druga prava vlasništva na web sajtu. Web sajt sadrže materijale zaštićene copyright-om, zaštitne znakove i druge informacije o pravu vlasništva ili softver. Članovi mogu poslatu informacije zaštićene pravima vlasništva njihovih nosilaca i ona ostaju zaštićena bez obzira da li su oni koji prenose te informacije to naveli ili ne. Osim informacija koje su u javnom vlasništvu ili za koje dobijete dozvolu, nemate pravo da kopirate, modifikujete ili na bilo koji način menjate, objavljujete, prenosite, distribuirate, izvršavate, prikazujete ili prodajte bilo koju informaciju zaštićenu pravima vlasništva. Slanjem informacija ili sadržaja na bilo koji deo DevProTalk.com, Vi automatski dozvoljavate i predstavljate garanciju da imate pravo da dozvolite DevProTalk.com ili članovima DevProTalk.com bespovratnu, kontinualnu, neograničenu, globalnu dozvolu da koriste, kopiraju, izvršavaju, prikazuju i distribuiraju takve informacije i sadržaje i da iz takvih sadžaja koriste bilo koji deo u bilo koje svrhe, kao i pravo i dozvolu da koriste gore navedene sadržaje. Svi zaštitni znakovi (trademarks), logotipi, oznake usluga, firme ili imena proizvoda koji se pominju na ovom web sajtu su vlasništvo kojim raspolažu njihovi vlasnici.