Спрос
ите любого разработчика программного обеспечения или внешнего интерфейса, и большинство из них скажет вам, что большая часть их профессиональной жизни в основном тратится на отладку, мониторинг и устранение неполадок в приложениях, которые они создали. Дело не в том, что все они плохие специалисты и постоянно нуждаются в бдительном присмотре за своими творениями.
Разработка программного обеспечения, как она есть, строится на предпосылке, что программное обеспечение потерпит неудачу. При этом основное различие между новичком и опытным разработчиком заключается в том, как они готовятся и планируют указанные ошибки.
Один из эффективных способов подготовиться ко всему - это постоянное ведение журнала. Это очень помогает. Эффективное ведение журнала может сделать весь процесс разработки более быстрым, увлекательным и продуктивным.
Хотя большинство экспертов согласятся с тем, что правильная и усердная разработка через тестирование – это единственно верный путь, подавляющее большинство из них также подтвердят, что гибкость и богатство информации могут быть достигнуты за счет эффективного использования console.log ( ). Передовые методы ведения журналов во внешнем интерфейсе могут иметь большое значение для улучшения общего рабочего процесса и качества цикла разработки. С помощью советов и приемов, которыми мы собираемся поделиться с вами, вы можете отлаживать свои проекты на лету, пока вы находитесь в цикле разработки, но они также очень помогут вам еще долго после того, как вы закончите приложение.
Не используйте console.log ()
Это может показаться немного безумным, учитывая актуальную тему, о которой мы говорим. Однако вместо использования console.log () вы всегда можете использовать console. trace (), чтобы узнать, что происходит с вашим приложением. Он делает все, что делает log-route, а также выводит всю трассировку стека. Когда начнется отправка сообщения, вы будете точно знать, откуда.
Чтобы идентифицировать ваши объекты и избежать путаницы в именах переменных, используйте имена вычисляемых свойств ES6.
Они должны быть самоочевидными. Используйте синтаксис вычисляемых свойств ES6 и заключите предпочтительные объекты, которые вы хотите регистрировать, в console.log (), то есть используйте console.log ({user}) vs console.log (user).
Они будут аккуратно зарегистрированы в имени переменной, установленном как значение, и как ключ как сам объект. Это может быть невероятно полезно, если вы хотите зарегистрировать несколько объектов в одной команде журнала.
ошибки, предупреждения и информация (многоуровневые уровни журнала)
По умолчанию console.log (param) будет регистрироваться на уровне INFO. С другой стороны, у вас также есть три других уровня, которые вы можете использовать. Это consoles.debug (), console.warn () и console.error (). Помимо различий в форматировании, консоль разработчика браузера также позволяет фильтровать журналы на разных уровнях.
Для списков и элементов используйте console.table ()
Стоит ли писать дальше? Если вы когда-нибудь окажетесь в ситуации, когда вам нужно зарегистрировать список или элемент, попробуйте эту команду.
Вместо того, чтобы искать свой файл в консоли разработчика, чтобы добавить точку останови, почему бы не сэкономить несколько секунд, почему бы просто не добавить отладчик в свой код, чтобы остановить выполнение, когда выполняется фактическая строка? После этого вы можете перейти к функциям и отлаживать их, как и раньше.
Детальное профилирование производительности с помощью console.profile () и console.time ()
Если вы хотите профилировать точный поток пользователей в своем приложении, чтобы упростить поиск горячих точек, вы можете запустить console. profile (profileName) в начале действия и console.profileEnd (profileName) в конце, чтобы упростить вашу жизнь и проверить профиль ЦП на наличие потока.
Кроме того, вы можете увидеть, сколько времени занимает поток с запуском console.time (id) в начале и console.timeEnd (id) в конце.
Используйте console.count () для подсчета
Эта команда может помочь вам точно узнать, сколько раз выполняется часть вашего кода. В случае исключения условий гонки и других подобных сценариев это может оказаться невероятно полезным.
Ведение журнала с помощью CSS
Вы можете эффективно использовать строки формата для форматирования сообщений журнала. % s - это заполнитель для ваших стилей CSS, а все, что находится после него, будет вашим сообщением.
Помимо этого, вы также можете стилизовать несколько элементов, если расширите строку формата, включив% s для строковых параметров.
Хотя это скорее косметические уловки, наличие красивого журнала с хорошо разделенными и простыми в использовании журналами отладки и информации может иметь большое значение, особенно когда вам нужно изменить приложение, чтобы справиться с неожиданными сбоями.
Долгое ведение журнала с помощью console.log ()
Если ваши журналы остаются в консоли, вы открываете дыры для нарушений безопасности.
Не используйте console.log (). Вместо этого попробуйте написать класс-оболочку, который также включает логику для условного ведения журнала на основе уровня журнала, установленного серверной частью на основе глобальной переменной.
Вы можете настроить свои приложения для включения ведения журнала уровня отладки по умолчанию для пользователей с правами администратора. Вам просто нужна переменная JavaScript, которая устанавливается серверной частью.
Вы увидите, что некоторым пользователям будет очень удобно, и они установят эти флаги в консоли разработчика, чтобы включить детальное ведение журнала, в большинстве случаев вам будет лучше, чем если бы каждый журнал был открыт для каждого пользователя в приложении по умолчанию, или полностью удалить все записи из вашего приложения.
Существует множество сторонних решений, которые включают различные интеграции для передачи ваших ошибок службам исходящих уведомлений. Некоторые из них можно даже подключить к инструментам управления проектами, чтобы автоматически создавать сообщения об ошибках и уведомления для вашей команды.
Надеюсь, эти несколько советов помогут вам как в процессе разработки, так и в долгосрочной перспективе. Хотя это, очевидно, только верхушка айсберга, когда дело доходит до ведения журнала, реализация этих простых шагов может сделать весь процесс разработки более быстрым, творческим и увлекательным, не говоря уже о том, что это также может значительно помочь вам в обслуживании приложений.
Тенденции веб-разработки 2021 года | 10 мощных приемов JavaScript, которые должны знать разработчики