Оптимизация и Быстрый код
 

Всем доброго времени суток.
Предпологается некий интересный тест, проверки написания бустрого ( при выполнении ) когда на JS. Суть в следующим: есть некий HTML code
<table id="Calendar" class="HWCalendar" border="1" cellpadding="0" cellspacing="0" onSelectStart="return false;">
<thead>
</thead>
<tbody>
</tbody>
</table>

неоходимо с помощью JS создать таблицу календаря, а именно с 2008.01.01 по 2009.01.01
первая TR сожержит список дней в формате Friday, February 1, 2008 ; Saturday, February 2, 2008 ... и т.д.
первый столбей содержит время 12:00 AM ; 12:30 AM .. 11:30 PM
остальный ячейки календаря просто пустые
конечная таблица должна быть 365 ( дней в году ) * 49 ( 24 зача * 2 т.к. интервал по 30 мин ) = 17885 TD в искомой таблице.
просто хочу оценить свой уровень и уровень людей на этом форуме.
сразу скажу, задача легкая, у меня для интрини под FF и IE занимает меньше 2с.
заранее спасибо, кому интересно
P.S. позже выложу примерный код для обсуждения

Если честно - лениво, но на результаты бы посмотрел.
А вообще, мне кажется, что самый быстрый способ работы - это подставить строку с таблицей через innerHTML куда надо. В смысле таблица будет целиком написана в строке, константой, благо все данные известны заранее.

И на результаты бы не посмотрел, ибо простая неинтересная задача, требующая, тем не менее, много кодинга (вместе с тестированием и отладкой).

Много кодинга и времени на тестирование ??? :D 30мин на все правсе, динамически создать таблицу и все

Не вижу смысла в этой задаче, если честно. Как можно по ней определить чей-то уровень? Тут не алгоритм какой-то нужно придумать интересный, а просто написать код, который будет наименьшее количество раз "дергать" DOM, соответственно будет быстро работать.

ради чего? 30 мин кодинга на неинтересную задачу -- это много.

Если кто-то на форуме задает простой вопрос, написание ответа на который займет больше минуты, я лично прохожу мимо. Вот если вопрос интересный, то и час потратить не жалко. Ради создания таблички убивать пол часа? Извините, но тут (и не только тут) многим уже не нужно ничего никому доказывать.

Я просто хотел посмотреть, как люди вообще пишут подобные вещи, на сколько они понимают хитрости языка, мне, как разработчику интересно посмотреть и что то взять на вооружение, если никому не интересно, дело каждого, лично яб взяся, что то показать и что то самому дать, если это полезно.
Всем спасибо, всем доволен

У меня к Вам предложение: давайте Вы напишете свой код, а мы все вместе его доведем до оптимального (если это возможно).
И нам не писать много кода и Вам покажем парочку секретных кунг-фу (опять же, если это будет возможно). :)
Просто писать, по сути, одно и то же сразу нескольким людям незачем... ИМХО

Виталий, еще раз повторюсь: это интересно на интересных задачах, рисование таблички интересной задачей назвать трудно.

http://spb-nikitin.110mb.com/Calendar/Calendar.html

вот ссылка на примерный код, да я согласен, легче анализировать код написанный, чем тоже самое плодить.

Заранее спасибо, смотрите, коменируйте что понятно, что не понятно, что плохо сделано, что очень плохо :)

Виталий,

- схожие по семантике методы и общие свойства надо выносить в прототип, иначе у тебя каждый новый объект будет иметь свои методы и свойства (ну вот зачем каждому объекту иметь один и тот же массив - this.week = ['Sunday','Monday','Tuesday','Wednesday','Thursday' ,'Friday','Saturday' ] ;? - ему место в прототипе. (Это не единственный случай)).

- если хочешь сделать shortcut для метода с длинным названием - сошлись на него, а не плоди новую анонимную функцию:

// сжираешь лишние ресурсы
Date.prototype.gDt = function() {
	return this.getDate() ;
}

// а так - нормально
Date.prototype.gDt = Date.prototype.getDate;

- Бенчмарки для работы с таблицами устраивались не раз (вот один из них - http://www.quirksmode.org/dom/innerhtml.html); DOM-методы далеко не самые быстрые.

this.week - ему место в прототипе.
хочу понять, правильно я понимаю, для каждого нового объекта будет создана новая переменная week, с выделенной памятью, а если чере prototype.week то будет ссылка на это массив в Base классе ?
но я не понимаю откуда она возьмется, если Base класс не создается ,?

Мое предложение - шаблоны:

<html>
<head>
<script type="text/javascript" src="calend.js"></script>
</head>
<body>
<div id="test_div"></div>
<script type="text/javascript">
	drawT(new Date(2008, 06, 21));
</script>
</body>
</html>

var STR = '<table cellspacing="0" cellpadding="0" border="1" onselectstart="return false;" class="HWCalendar" id="Calendar"><thead><tr><td colspan="8"></td></tr></thead><tbody><tr class="head"><td> </td><td>#mon#</td><td>#tue#</td><td>#wen#</td><td>#thu#</td><td>#fri#</td><td>#sat#</td><td>#sun#</td></tr><tr><td class="day-time">12:00 AM</td><td/><td/><td/><td/><td/><td/><td/></tr><tr><td class="day-time">12:30 AM</td><td/><td/><td/><td/><td/><td/><td/></tr><tr><td class="day-time">01:00 AM</td><td/><td/><td/><td/><td/><td/><td/></tr><tr><td class="day-time">01:30 AM</td><td/><td/><td/><td/><td/><td/><td/></tr><tr><td class="day-time">02:00 AM</td><td/><td class="click"/><td/><td/><td/><td/><td/></tr><tr><td class="day-time">02:30 AM</td><td/><td/><td class="click"/><td/><td/><td/><td/></tr><tr><td class="day-time">03:00 AM</td><td/><td/><td/><td/><td/><td/><td/></tr><tr><td class="day-time">03:30 AM</td><td/><td/><td/><td/><td/><td/><td/></tr><tr><td class="day-time">04:00 AM</td><td/><td/><td/><td/><td/><td/><td/></tr><tr><td class="day-time">04:30 AM</td><td/><td/><td/><td/><td/><td/><td/></tr><tr><td class="day-time">05:00 AM</td><td/><td/><td/><td/><td/><td/><td/></tr><tr><td class="day-time">05:30 AM</td><td/><td/><td/><td/><td/><td/><td/></tr><tr><td class="day-time">06:00 AM</td><td class="click"/><td/><td/><td/><td/><td/><td/></tr><tr><td class="day-time">06:30 AM</td><td/><td/><td/><td/><td/><td/><td/></tr><tr><td class="day-time">07:00 AM</td><td/><td/><td/><td/><td/><td/><td/></tr><tr><td class="day-time">07:30 AM</td><td/><td/><td/><td/><td/><td/><td/></tr><tr><td class="day-time">08:00 AM</td><td/><td/><td/><td/><td/><td/><td/></tr><tr><td class="day-time">08:30 AM</td><td/><td/><td/><td/><td/><td/><td/></tr><tr><td class="day-time">09:00 AM</td><td/><td/><td/><td/><td/><td/><td/></tr><tr><td class="day-time">09:30 AM</td><td/><td/><td/><td/><td/><td/><td/></tr><tr><td class="day-time">10:00 AM</td><td/><td/><td/><td/><td/><td/><td/></tr><tr><td class="day-time">10:30 AM</td><td/><td/><td/><td/><td/><td/><td/></tr><tr><td class="day-time">11:00 AM</td><td/><td/><td/><td/><td/><td/><td/></tr><tr><td class="day-time">11:30 AM</td><td/><td/><td/><td/><td/><td/><td/></tr><tr><td class="day-time">12:00 PM</td><td/><td/><td/><td/><td/><td/><td/></tr><tr><td class="day-time">12:30 PM</td><td/><td/><td/><td/><td/><td/><td/></tr><tr><td class="day-time">01:00 PM</td><td/><td/><td/><td/><td/><td/><td/></tr><tr><td class="day-time">01:30 PM</td><td/><td/><td/><td/><td/><td/><td/></tr><tr><td class="day-time">02:00 PM</td><td/><td/><td/><td/><td/><td/><td/></tr><tr><td class="day-time">02:30 PM</td><td/><td/><td/><td/><td/><td/><td/></tr><tr><td class="day-time">03:00 PM</td><td/><td/><td/><td/><td/><td/><td/></tr><tr><td class="day-time">03:30 PM</td><td/><td/><td/><td/><td/><td/><td/></tr><tr><td class="day-time">04:00 PM</td><td/><td/><td/><td/><td/><td/><td/></tr><tr><td class="day-time">04:30 PM</td><td/><td/><td/><td/><td/><td/><td/></tr><tr><td class="day-time">05:00 PM</td><td/><td/><td/><td/><td/><td/><td/></tr><tr><td class="day-time">05:30 PM</td><td/><td/><td/><td/><td/><td/><td/></tr><tr><td class="day-time">06:00 PM</td><td/><td/><td/><td/><td/><td/><td/></tr><tr><td class="day-time">06:30 PM</td><td/><td/><td/><td/><td/><td/><td/></tr><tr><td class="day-time">07:00 PM</td><td/><td/><td/><td/><td/><td/><td/></tr><tr><td class="day-time">07:30 PM</td><td/><td/><td/><td/><td/><td/><td/></tr><tr><td class="day-time">08:00 PM</td><td/><td/><td/><td/><td/><td/><td/></tr><tr><td class="day-time">08:30 PM</td><td/><td/><td/><td/><td/><td/><td/></tr><tr><td class="day-time">09:00 PM</td><td/><td/><td/><td/><td/><td/><td/></tr><tr><td class="day-time">09:30 PM</td><td/><td/><td/><td/><td/><td/><td/></tr><tr><td class="day-time">10:00 PM</td><td/><td/><td/><td/><td/><td/><td/></tr><tr><td class="day-time">10:30 PM</td><td/><td/><td/><td/><td/><td/><td/></tr><tr><td class="day-time">11:00 PM</td><td/><td/><td/><td/><td/><td/><td/></tr><tr><td class="day-time">11:30 PM</td><td/><td/><td/><td/><td/><td/><td/></tr></tbody></table>';
var DAY = 1000*60*60*24;
/* #mon#, #tue#, #wen#, #thu#, #fri#, #sat#, #sun#*/
function getD(_date) {
	_date.setTime(Date.parse(_date) + DAY);
	return _date;
}
function drawT(mondayDate) {
	var startT = new Date();
	document.getElementById('test_div').innerHTML = STR.replace('#mon#', mondayDate).replace('#tue#', getD(mondayDate)).replace('#wen#', getD(mondayDate)).replace('#thu#', getD(mondayDate)).replace('#fri#', getD(mondayDate)).replace('#sat#', getD(mondayDate)).replace('#sun#', getD(mondayDate));
	alert(new Date() - startT);
}

Набросал совсем коротко, строго не судите - времени нет %)

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

Кстати, мне тоже интересны мнения.

да, только функцияКонструктор.prototype.wee k = ['bla', 'bla'];

если не создается, то и ссылки нет (я вижу, что вы apply'ете WCalendar_Base к HWCalendar_Sheduling - HWCalendar_Base.call( this ), но этот call создаст лишь свойства для объектов HWCalendar_Sheduling, в то время как HWCalendar_Sheduling.prototype.week = [] или WCalendar_Base.prototype.week = [] (в случае, если б HWCalendar_Sheduling наследовался от WCalendar_Base) держали бы общий массив week на всех)

Вопрос как раз и заключался - чтобы создать таблицу динамически, иначе прикола никакого нету :) просто мне может понадобиться ее сделать на год или на 2 или 3 месяца.

А можно пример функцияКонструктор.prototype = week при множественном наследовании, чтобы все объекты ссылались на один week ?

// а так - нормально
Date.prototype.gDt = Date.prototype.getDate;

при создании календаря на 1 год быстрее примерно от 3-7мс!
+1

Что за множественное наследование? В JS одно наследование - prototype-based. Или ты имеешь в виду call'ы и apply'и чтобы создать объекту свои this-свойства на основе функций-контейнеров? Если последнее - то не получится, т.к. нет возможности по цепи прототипов достучаться до нужного свойства.

P.S.: В сущности, твой подход можно абстрактно-философски (подчеркиваю, т.к. этого нет в JS - для тех, кто любит цепляться к словам) сравнить с примесями (mixin) - ты подмешиваешь в объект свойства из других функций-конструкторов.

А в общем, все просто (без подробностей: "восстановление свойства constructor", "проблема холостых выстрелов" и т.д.):

function A() {};
A.prototype.week = [];

function B() {};
B.prototype = new A();

var b = new B();
// week будет найдено по цепи
// прототипов в прототипе А
alert(b.week);

Ладно, все это конечно то, но особого прироста не дает, есть еще идеи ? методы ?

Мысли системно, а не конкретным "календарем". Если создать 1000 объектов, где у каждого будет один и тот же массив - сколько израсходуется памяти? А если положить его в прототип - сколько? Я всего лишь информировал - дело твое =)