Это ключевые навыки, необходимые для проработки и исправления ошибок. Здесь сразу надо разделить на C# и JS.
Вы проходите по шагам код и можете видеть и менять различные переменные. Т.е. вы можете заглянуть внутрь и посмотреть как выполняется ваш код. Обязательно проработайте вопрос отладки и изучите инструменты отладки, вы гораздо меньше будете тратить время на отлов ошибок.
Это запись событий по выполнению кода. Это могут быть переменные или просто строки (обычно чтобы просто посмотреть где у нас проблемные участки, которые долго выполняются – т.е. в целях оптимизации).
В JS используйте активно панель браузера (F12). Самые главные вкладки – сеть и консоль.
На вкладке Сеть вы можете видеть все запросы, которые идут на сервер. Особенно полезно здесь видеть, как идут ajax запросы, что передается на сервер и что с него приходит. Вы можете использовать специальные команды console.log и debugger. Первая нужна для вывода в консоль разных значений. Кстати она также позволяет раскрашивать в цвета строки, что может быть удобно при сложной трассировки (погуглите насчет этого). Вторая позволяет сделать остановку в браузере и пройтись по шагам в браузере. Изучите этот момент (Google – отладка в Chrome).
Также вы можете трассировать JS через нашу функцию as.sys.trace – он выводит вашу строку и длительность по времени с момента последнего выполнения этой команды.
Важный момент – лучше оборачивать функции console в какую-то свою функцию и вызывать только ее.
Дело в том, что потом вам нужно будет отключить все console (они в некоторых браузерах не определятся и выдают ошибку). В итоге вы сможете просто поменять в одном месте, т.е. не нужно будет бегать по всему коду и вносить правки.
Еще момент в тему, если хотите более безопасный код, то пишите следующим образом: console && console.log() – функция выполнится если только объект console определен.
Для включения трассировки вы должны в web.config настроить параметр trace в system.web:
<trace enabled="true" localOnly="false" pageOutput="false" traceMode="SortByTime" writeToDiagnosticsTrace="true" requestLimit="1000" />
В коде программы вы можете вызывать методы Trace.Warn или Trace.Write – при этом в трассировке будут показываться ваши данные. Просмотр трассировки может идти прямо на странице или в по отдельному адресу /trace.axd. Второй вариант предпочтительнее, т.к. в противном случае вы не можете изучить ajax запросы.
Важный момент – отключайте трассировку на запущенном в эксплуатацию приложении. Во-первых, это замедляет работу, и, во вторых, это дает полезные данные для злоумышленников.
Обычно трассировку удобно использовать для изучения медленных мест – т.е. для оптимизации хода выполнения кода. Второй вариант применения – как выполняется код на сервере. Вы запускаете страницу с проставленными Trace.Warn и просматриваете Trace.axd.
Лучше сразу попробуйте эти инструменты в деле. Не надейтесь их освоить по мере поступления проблем. Когда будут проблемы в проекте, вам будет совсем не до этого, поэтому прямо сейчас попробуйте все указанные инструменты на простом коде.
Есть альтернативный способ трассировки – это запись всех событий в базу данных. Есть стандартные таблицы (система health monitoring), но мы используем свой механизм – таблицу cms_trace и класс Tracer. Фактически он записывает все полезные данные по работе системы – время по длинным запросам, ошибки и другие критические данные. База особенно удобна, когда речь идет об удаленной отладке, когда локально все работает, а на сервере нет. В этом случае вы пишите в базу данные через tracer и можете разобраться что именно происходит на сервере.
Для локальной отладки удобнее всего использовать встроенные средства отладки Visual Studio. Вы ставите точки прерывания в коде и запускаете проект (F5). При останове на точке прерывания (breakpoint) вы можете по шагам пройти всю логику и посмотреть различные значения через окна снизу (особенно полезно окно Immediate для различных вычислений в реальном времени). Для движения по шагам есть 2 способа:
Разница между ними видна, только если текущая строка является функцией. В первом случае вы одним махом вычислите эту функцию. Во втором – вы “провалитесь” внутрь функции и будете ее также проходить по шагам. Если вам нужно отпустить выполнение – вы просто нажимаете F5 и программа дальше начнет выполняться (пока не встретит следующий breakpoint). Если вам надо остановить процесс выполнения – Shift + F5.
На этом по отладки и трассировке все. Обязательно попробуйте использовать все эти инструменты (или предварительно реализовать). Это значительно упростит поиск и исправление ошибок в ваших будущих проектах.
Далее рассмотри оптимизацию.