Форум PHP программистов > Какой код быстрее в плане оптимизации.

[ Поиск ] - [ Пользователи ] - [ Календарь ]

Полная Версия: Какой код быстрее в плане оптимизации.

VELIK505

17.04.2011 - 19:19

Вариант первый нубовской. 5 обращений к серверу за одной картинкой:

<center><img src="images/nagl.png" width="16" height="16" alt="" />У нас Аттестат продавца!<br />
<img src="images/nagl.png" width="16" height="16" alt="" />Автоматические выплаты!<br />
<img src="images/nagl.png" width="16" height="16" alt="" />Автоматическое размещение рекламы!<br />
<img src="images/nagl.png" width="16" height="16" alt="" />12 видов рекламы!<br />
<img src="images/nagl.png" width="16" height="16" alt="" />Уникальная защита от автокликеров!<br />
<img src="images/nagl.png" width="16" height="16" alt="" />Постоянные конкурсы!</center>

Вариант второй выносим картинку в css и из дивов уже подгружаем:

<div align="center">
 <div class="pic"></div><span>У
 нас Аттестат продавца!</span><br />
 <div class="pic"></div><span>А
втоматические выплаты!</span><br />
 <div class="pic"></div><span>А
втоматическое размещение рекламы!</span><br />
 <div class="pic"></div><span>1
2 видов рекламы!</span><br />
 <div class="pic"></div><span>У
никальная защита от автокликеров!</span><br />
 <div class="pic"></div><span>П
остоянные конкурсы!</span>
</div>

код css:

.pic{display: inline-block; background: url(../images/nagl.jpg) no-repeat; width: 16px; height: 16px;}

Вариант третий data:uri кодируем картинку в base64 и работает без обращений к серверу:

<div align="center">
 <div class="pic"></div><span>У
 нас Аттестат продавца!</span><br />
 <div class="pic"></div><span>А
втоматические выплаты!</span><br />
 <div class="pic"></div><span>А
втоматическое размещение рекламы!</span><br />
 <div class="pic"></div><span>1
2 видов рекламы!</span><br />
 <div class="pic"></div><span>У
никальная защита от автокликеров!</span><br />
 <div class="pic"></div><span>П
остоянные конкурсы!</span><br />
</div>

Код css:

.pic{display: inline-block; background: url("data:image/png;base64,iVBORw0KGgoAA
AANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAGXRFWHRTb2Z0d2F
yZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAjpJREFUeNrEU0trE
1EUPnfmJpOJNUknrdaxxkcROj4QOg1IF6WCEEFwUxcKFgou8gv
cSFbi1h+Qgrpw0YVCwY2DG0FwUZopiCAiEdQ+Mk0gJh3ymJk7M
547RWnAXRZeOHDmPL757vnOJWEYwjBHgCEPXXheL4dBUGSeB57
jRMGYJAGNx4EQUg6CYAXzpkhpGVNrWGfwOrffB6fXAwEDus/YQ
9/3/6LyAua6wHOB73MQnftojyEMbwxcAYvrqSRZxL88we8C2jT
aKMYpB1q6eVJHsDL37xZU3XPdARBx/FpxZvZidn76XDoviuF1A
cJFxvwl12H3GWNwVs2os5cUdb/eUm07hLmZY+rHL3UNh/8TmVf
JhUdmPjuaeFaYP68xj4iEcFUOlEHq0On4aAwmJ2VYX/8GiqJAL
peCl28+mwhSEjNzy7vtVifT6fWnxpSRlL3vCbbNoNHswtZeG3b
2mtD41YLq9wacOq3A9g8Ldps9uKxNqNWqpYmpq/cAB7hp1Vrxn
VrzxJGRmGhTkdbwejaNQUOUwBJkmMhlwfpUhe3McRDG0lB5u2n
igEvkzIN3EVWvH00+j7TuIHsNbRyNSLdv6ek4wNEP7+Hr1BWQl
TS4r16bKHEpLssGPSwJNm8g2EbkIyjKVklQAbaerprR0uQXdPv
F6kFzImHw2AADLhX3cbrgdLs8X4mKBKGIgOXIx2ZcMkOSZZCSS
aD/Ws9Ou/3HNbF5RcBNxDlxFms0FjMO15L//piGBvgtwAAyJi/
lbg+vlwAAAABJRU5ErkJggg==") no-repeat; width: 16px; height: 16px;}

Спустя 4 минуты, 28 секунд (17.04.2011 - 18:23) Игорь_Vasinsky написал(а):

Какой оптимизации ? поисковый или по расходу памяти. По моиму и ак всё на лицо.

1. - удобен при поисковой оптимизации
2. - экономичен
3. - дополнительная функция + беда в CSS (валидатор оценит).

Вроде всё очевидно.

Спустя 3 минуты, 47 секунд (17.04.2011 - 18:27) VELIK505 написал(а):

Цитата (Игорь_Vasinsky @ 17.04.2011 - 15:23)

С точки зрения снижения нагрузки на сервер в 3ем варианте обращение к серверу то не идёт за картинкой!
Но кода больше вот мне и интересно что же в итоге быстрее 3ее или 2оее

Спустя 6 минут, 10 секунд (17.04.2011 - 18:33) Игорь_Vasinsky написал(а):

Цитата

С точки зрения снижения нагрузки на сервер в 3ем варианте обращение к серверу то не идёт за картинкой!

наверно ты и ответил сам. Хотя надо просто потестить с сеундомером

Спустя 38 секунд (17.04.2011 - 18:34) Игорь_Vasinsky написал(а):

Затоувеличивается размер CSS файла - который тож со страницей грузится.

Спустя 3 минуты, 15 секунд (17.04.2011 - 18:37) VELIK505 написал(а):

Цитата (Игорь_Vasinsky @ 17.04.2011 - 15:34)

Затоувеличивается размер CSS файла - который тож со страницей грузится.

Вот тото же.
А тестить надо на физ серваке где будет залит только 1 скрипт.
Чтобы узнать точно что быстрее у меня нету такой возможности щас

Спустя 2 минуты, 25 секунд (17.04.2011 - 18:40) Игорь_Vasinsky написал(а):

и всё же мн кажеться 2й. просто в третьем обработка добавляется.

Спустя 1 минута, 55 секунд (17.04.2011 - 18:41) VELIK505 написал(а):

Ещё бы мнений услышать

Спустя 1 минута, 52 секунды (17.04.2011 - 18:43) waldicom написал(а):

Не надо гнаться только за быстротой. У каждого из способов выше есть свои недостатки. У второго дополнительный запрос серверу, у третьего проблема сопровождения.

Спустя 1 час, 1 минута, 47 секунд (17.04.2011 - 19:45) VELIK505 написал(а):

А вот ещё такой вопрос. Почему на многих сайтах css подключают не так:

<link rel="stylesheet" type="text/css" href="/css/al/common.css" />

а:

<link rel="stylesheet" type="text/css" href="/css/al/common.css?128" />

что в данном случаее даёт ?128
??

Спустя 11 минут, 16 секунд (17.04.2011 - 19:56) waldicom написал(а):

Возможно так подключаются только определенные стили. Такое делают, помимо прочего, тогда, когда все стили определены в разных файлах, но при отдаче (или в начале работы) собираются в один файл.

Спустя 1 час, 29 минут, 41 секунда (17.04.2011 - 21:26) twin написал(а):

128 всегда или рандомно? Так делают для того, чтобы CSS не кэшировалась.

Спустя 48 секунд (17.04.2011 - 21:27) waldicom написал(а):

Цитата (twin @ 17.04.2011 - 19:26)

Так делают для того, чтобы CSS не кэшировалась.

А смысл (без иронии)?

Спустя 8 минут, 37 секунд (17.04.2011 - 21:35) neadekvat написал(а):

Цитата (waldicom @ 17.04.2011 - 22:27)

А смысл (без иронии)?

Насчет рандомного не знаю (это и правда несколько нерационально, мягко говоря), но вот если этой цифрой обозначается версия css файла (а не его часть - я не видел такой реализации.. хотя, да, кенгуру я тоже живьем не видел), то есть внесли изменения в css, увеличили цифирку - и он сразу загружается (и нет всем знакомой проблемы с "Ну, вы F5 нажмите и оно обновиться").

Спустя 1 минута, 57 секунд (17.04.2011 - 21:37) waldicom написал(а):

Цитата (neadekvat @ 17.04.2011 - 19:35)

но вот если этой цифрой обозначается версия css файла

Хм... Интересная идея. Надо подумкать, действительно ли так можно делать.

Спустя 35 минут, 5 секунд (17.04.2011 - 22:13) kirik написал(а):

Цитата (waldicom @ 17.04.2011 - 14:37)

действительно ли так можно делать

Ага, так работает. Есть ресурс интересный http://webo.in/ - там куча статей по оптимизации взаимодействия клиента и сервера (меньше данных/меньше запросов).

Спустя 8 часов, 25 минут, 5 секунд (18.04.2011 - 06:38) Dr.Mars написал(а):

Любой нормальный браузер поймет, что 10 раз одну картинку грузить не нужно. Другое дело делать сайт для всех браузеров, я для этих целей использую nginx:

server {
    listen  80;
    server_name static.blablabla.ru;

    location / {
        deny all;
    }

    location ~* ^.+\.(jpe?g|gif|css|js|html|rar|txt|swf|ico|png|mid|xml|htc|mp3)$ {
        root /home/user/www/blablabla.ru/static;
        access_log   off;
        expires      30d;
    }
}

Быстрый ответ:

Здесь расположена полная версия этой страницы.