Page design

Не съм експерт, все пак се занимавам с Web design от някакви си 2.5 години, та затова искам да попитам защо толкова много сайтове включително такива като този на dir.bg, карат сървърите да им чертаят елементите които се повтарят във всяка една страница на сайта или ако не ги чертаят то да изпращат кода за тях по мрежата всеки път когато се прави опит да се отвори страница която съдържа този код? Какво имам в предвид. Ще взема например страницата на Dir.bg на която в момента пиша мнението си. Над текста - "Добре дошъл: *Име на потребителя*" се намира елемент съдържащ няколко линка - "Каталог", "Новини", "Маркет" и т.н., едно текстово поле, едно "<select>" плюс осще няколко поделемента - всичкото това грижливо подредено в малка табличка кода за който се намира във началото на всяка една страница:

В отговор на:

---

<table width="100%" border="0" cellspacing="0" cellpadding="0" bgcolor="#339999">
<tr><td background="img/top_bgr.gif"><img src="img/spacer.gif" width="1" height="3"></td></tr>
<tr><td style="border-bottom: solid 2px #405457;">
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr valign="top" style="padding-top:8px;"><td align="center" width="220" class="yellow_11" style="border-bottom: solid 1px #88B8CF;"><a href="[линк]">&#207;&#250;&#240;&#226;&#224; &#237;&#224; &#196;&#232;&#240;</a> | <a href="[линк]">&#196;&#237;&#229;&#241;</a> | <a href="[линк]">&#203;&#224;&#233;&#244;</a>
<div style="padding-top:12px;"><a href="/"><img src="img/dir_logo.gif" border="0"><img src="img/clubs_logo.gif" border="0"></a></div></td><td>

<table width="405" border="0" cellspacing="0" cellpadding="0">
<tr><td><img src="img/s_box_1.gif"></td>
<td width="100%" bgcolor="#405457">
<table width="100%" height="58" border="0" cellspacing="0" cellpadding="0">
<tr>
<td colspan="3" style="border-top: solid 2px #88B8CF;"><img src="img/spacer.gif" width="1" height="14"></td>
</tr>
<tr><td colspan="3" align="center">



<table border="0" cellspacing="0" cellpadding="0">
<form action="dosearch.php" method="post" name="search_frm">
<input type=hidden name=Cat value="8">
<input type=hidden name=Forum value="All_Forums">
<input type=hidden name= Match value="Entire Phrase">
<tr><td>
<table border="0" cellspacing="0" cellpadding="0" style="border: solid 1px #FFFFFF;">
<tr><td bgcolor="#FE8936" class="white_10">&#196;&#232;&#240;&#232;</td>
<td bgcolor="#FFFFFF"><img src="img/tick.gif" align="absmiddle"> <input name="Words" value="" type="text" class="formi_new" style="width:115px; height:16px;"></td></tr>
</table>
</td><td></td>
<td>
<select size="1" class="formi_new" style="width:100px;" name="Old">
<option value="1day">&#206;&#242; &#228;&#237;&#229;&#241;</option>
<option value="2days">&#206;&#242; 2 &#228;&#237;&#232;</option>
<option value="1week">&#206;&#242; 1 &#241;&#229;&#228;&#236;&#232;&#246;&#224;</option>
<option value="2weeks">O&#242; 2 &#241;&#229;&#228;&#236;&#232;&#246;&#232;</option>
<option value="3weeks">&#206;&#242; 3 &#241;&#229;&#228;&#236;&#232;&#246;&#232;</option>
<option value="1month">&#206;&#242; 1 &#236;&#229;&#241;&#229;&#246;</option>
<option value="3months">&#206;&#242; 3 &#236;&#229;&#241;&#229;&#246;&#224;</option>
<option value="6months">&#206;&#242; 6 &#236;&#229;&#241;&#229;&#246;&#224;</option>
<option value="1year">&#206;&#242; 1 &#227;&#238;&#228;&#232;&#237;&#224;</option>
<option value="allposts">&#194;&#241;&#232;&#247;&#234;&#232; &#242;&#229;&#236;&#232;</option>

</select>
</td>
<td></td>
<td width="22" align="center" bgcolor="#FE8936" style="border: solid 1px #FFFFFF;"><input type=image src="img/butt_arrow.gif"></td>
<td class="grey_10">| <a href="[линк]">&#196;&#229;&#242;&#224;&#233;&#235;&#237;&#238;</a></td></tr>
</form>
</table>


</td></tr>
<tr>
<td style="border-bottom: solid 2px #96CBCB;"><img src="img/spacer.gif" width="220" height="1"></td>
<td width="62" align="center" valign="bottom"><img src="img/spacer.gif" width="66" height="1">

<img src="img/selelected_tick.gif"></td>
<td style="border-bottom: solid 2px #96CBCB;"><img src="img/spacer.gif" width="1" height="14"><img src="img/spacer.gif" width="85" height="1"></td>
</tr>
</table>
</td><td><img src="img/s_box_2.gif"></td></tr>
</table>

---

Та питам - какво пречи този код да се оформи като JavaScript функция, да речем buildTheMainLinks() { blaj; blah; } и тази функция да се прикачи към някой от съществуващите вече *.js файлове или пък да си бъде в неин си и по такъв начин този код да бъде зареждан в "cash"-а на компа на потребителя само когато той посещава сайта за пръв път или пък има промени в *.js файловете, които съдържат buildTheMainLinks()? Това би улеснило трафика. Освен ако това не се прави нарочно поради съображения за сигурност - е не съм толкова напред с PHP материала.

Обикновено е много по-лесно <? require_once ("top.php");?>
Javascripta изисква нагласания за всеки браузер, а и кода е най-малката част от трафика - картинките и рекламните банери са по голямата.

Bukvite.com

..., но пак не обяснява. "require(fail_name.***)" макар и да пести време на програмиста : 1. не пести такова на сървъра понеже го задължава да "parse"-не file_name.*** дори и в случаите когато "extension"-a не е ".php" и 2. не облекчава трафика понеже като резултат от 1., а и от начина по койto РНР работи file_name.*** не може да бъде каширан на компа на крайният потребител, а сървъра трябва да го прикача всеки път към base_file.php и да го изпраща по мрежата.

Не може ли base_file.php вместо да изглежда така:

В отговор на:

---

преди обработката от сървъра

В отговор на:

---

<html>
<head><title>Base_file_title</title>
<?
require(styles.***);
require(scripts.***);
?>
</head>
<body>
<?
require(banner.***);
?>
.......... 15К инфо специфични за този файл
</body>
</html>

---

Където

styles.***

В отговор на:

---

<style type="text/css">
<!--
....... 20K инфо за стайловете .......
-->
</style>

---

,

scripts.***

В отговор на:

---

<script language="JavaScript">
...... 30К инфо за променливи, функции и т.н. .......
</script>

---

и

banner.***

В отговор на:

---

<table(or div) width="100%" border="0" cellspacing="0" cellpadding="0" bgcolor="#339999">
......... 20K инфо
</table(or div)>

---

а след обработката

В отговор на:

---

<html>
<head><title>Base_file_title</title>

<style type="text/css">
<!--
....... 20K инфо за стайловете .......
-->
</style>

<script language="JavaScript">
...... 30К инфо за променливи, функции и т.н. .......
</script>

</head>
<body>
<<table width="100%" border="0" cellspacing="0" cellpadding="0" bgcolor="#339999">
...... 20К инфо
</table(or div)>

.......... 15К инфо специфични за този файл
</body>
</html>

---

което като резултат е 65К инфо прехвърляно от сървъра към крайният компютър

---

да е така:

В отговор на:

---

преди обработката от сървъра

В отговор на:

---

<html>
<head><title>Base_file_title</title>
<?
require(head_elements.***);
?>

</head>
<body>
.......... 15К инфо специфични за този файл
</body>
</html>

---

Където

head_elements.***

В отговор на:

---

<style type="text/css"><!-- @import url(styles.***); --></style>
<script language='JavaScript' src='scripts.***'></script>

---

и

scripts.*** (който вече е каширан върху харда на крайният комп)

В отговор на:

---

function buildBanner() {
document.write("<table(or div) width='100%' border='0' cellspacing='0' cellpadding='0' bgcolor='#339999'>");
......... 20K скрипт инфо
document.write("</table(or div)>");
........
}

---

а след обработката

В отговор на:

---

<html>
<head><title>Base_file_title</title>

<style type="text/css"><!-- @import url(styles.***); --></style>
<script language='JavaScript' src='scripts.***'></script>

</head>
<body>
<script language="JavaScript">buildBanner();</script>

.......... 15К инфо специфични за този файл
</body>

</html>

---

което като резултат е 15К инфо прехвърляно от сървъра към крайният компютър

---

Има много точно определение за такива трикове в програмирането - "намаляване на теглото чрез рязане на ноктите".

Да принципно прав си, да онези, от оня дълъг флейм с CSS-a и те са прави.
За да се правят такива трикове трябва да има две условия:
1. Да си сайт от типа на Гугъл, с техния огромен трафик. Те наистина правят чудеса с Джаваскрипта за да спестят някой байт.
2. Да имаш много свободно време, липса на крайни срокове, липса на клиент на главата, който да сменя през няколко дена концепцията и всички такива дреболии за да можеш да си изпипаш кога до съвършенство.
Това важи за всякакъв вид програмиране - всички знаем, колко добре може да се направи нещо и много рядко имаме времето и ресурсите да го правим.

Дай да ти направя обратната гадна менджерска сметка - при условие, че трафика се плаща грубо левче на ГБ, колко посещения месечно трябва да имаш, за да се плати на кодера да дооправи кода, като опростиш нещата, че той получава минимум 5 лв на час, а дизайна на сайта се сменя средно 6 месеца.

.... Нали ми е хоби, та тези "тънкости" не ги знаех. Жалко наистина, понеже обикновенният потребител е най-засегнатият.

Да ти цитирам ли решението на Римския сенат от "История на света"?
П.С Знаеш ли, това ми е най-трудно да отуча кодерите (не зависимо на какъв език) като започват работа при нас - че по добре 80% работеща програма, но спазен краен срок, отколкото идеална програма две седмици по късно.
Прочети "Ако програмистите бяха строители" - има много истини там.
Най-вече основната - възложителят не искаше да чуе - когато стане тогава, а настояваше за срокове.

Bukvite.com

... На римляните явно това решение не им е свършил добра работа, тъй като за тях сега знаем само от учебниците по история. Докато ние българите (дето вече 13 века векуваме) си имаме нашите - "Накрая евтиното винаги излиза по-скъпо" или още "Скъп на триците, ефтин на брашното". Или както баща ми обича да казва за мене - "Дървен философ".

...

В отговор на:

---

...понеже обикновенният потребител е най-засегнатият...

---

и това се случи. Докато се рових из сайта ти [линк] получих следното съобщение:

В отговор на:

---

Bandwidth Limit Exceeded
The server is temporarily unable to service your request due to the site owner reaching his/her bandwidth limit. Please try again later.
--------------------------------------------------------------------------------

Apache/1.3.33 Server at [линк] Port 80

---

кофти. А тамън бях попаднал на една стихосбирка "Тротоарни песни" ако не се лъжа която много ми хареса.

И каква джаваскирт ерър е това?
Свършили сме лимита за месеца, тва може само да ме радва - значи посещават сайта.
Утре като отиде хостинга на работа, ще го пуснат.

Bukvite.com

И как стои положението, ако ми е изключен ЖабаСкрипта? Излиза, че няма да ползвам сайта пълноценно...

Не ме разбирай погрешно - не съм против ЖабаСкрипта, напротив, в "младите" ми години залагах яко на него, даже предния ми личен сайт беше почти 90% ЖабаСкрипт, но сега вече скриптове ползвам САМО КОГАТО Е НЕОБХОДИМО!!! и то по предназначение... Целта е така да се направи сайта, че ако може да работи въобще без никакви скриптове...

Just a genius

...

Що какво?

Що без скриптове ли? щото например по дефолт Уин ХР, сървиз пак 2 забранява жабаскрипта, та да те питам тогава как точно си визуализираш сайта през жабаскрипт???

Just a genius

...да не би да те е яд на Били Гейтс за това и сега да си го изкарваш на мен. Аз пък си смятам че Били и Ко. са "bunch of greedy arseholes, и единственното нещо за което мислят е да се направят на по-богати. Демба и капиталистите, demba.

И защо са направили Жабаскрипта да е изключен "by default"? Заради "cookie"-тата и "pop-up" прозорците ли?

откъде да знам бе пич?

не искам да си го изкарвам на никой, просто си споделям личния опит (8+ години в областта)... ако искаш - приемай съвети, ако не искаш - работи си както намериш за добре...

Just a genius

// offtopic

предният ми личен сайт беше почти 90% ЖабаСкрипт, но сега вече скриптове ползвам САМО КОГАТО Е НЕОБХОДИМО!!!

А сегашният ти сайт колко процента Javascript е и защо е необходимо това:

[линк] ?

[линк] - блог, уеб дизайн, лекции, интернет сигурност

Със сигурност е заради портфолиото [линк]

Ха, интересно, господина Blake, който мрази до уши IE. А я му вижте скриншут'товете в портфолиото му ;)

Да, но има портфолио за разлика от теб!!!

ако не си забелязал, съм написал сега вече ползвам... нали?
а въпросния сайт е отпреди 2.5 годинки, така чеее... мисля съм ясен...

Just a genius

тва че мразя ИЕ, не ми пречи да го ползвам бе пич... все пак го ползват има/няма 90% от лузърите, и малко съм задължен да го ползвам, независимо дали ми харесва или не...

А и както вече са ти споменали, тъпо е да се заяждаш, след като за момента представляваш пълна нула (не става въпрос лично и само за тебе, а въобще за хората с 0-2 сайта в портфолиото си, ако имат изобщо такова)...

Just a genius