Лучший способ отлаживать код во Flutter

Вы когда-нибудь пытались отлаживать код во Flutter с помощью отладчика кода VS? Если да, то вы знаете, как мучительно и сложно отлаживать, а если нет, то позвольте мне рассказать вам. Когда вы пытаетесь отлаживать свой код построчно, отладчик иногда имеет тенденцию вызывать методы/функции, предоставляемые Flutter SDK, и выполнять их все. И, конечно же, это не ошибка, это нормальное поведение любого отладчика, потому что иногда написанный вами код имеет тенденцию вызывать методы/функции, написанные во Flutter SDK, для завершения выполнения вашей программы. Но отладка каждой строки, которую вы не написали и о которой не знаете, иногда приводит к суете и трате времени. Представьте себе сценарий, в котором вы написали метод A, который вызывает метод B, который написан где-то во Flutter SDK, а метод B вызывает метод >C, который снова написан где-то во Flutter SDK, а затем метод C возвращает что-то, что помогает вашему методу A выполняться. Теперь представьте, что у вас есть глубокое дерево этого. Разве это не беспокойно? Разве это не отнимает много времени? Что бы вы сделали в этом случае?

Большинство разработчиков, которых я видел, пытаются решить эту проблему, не используя отладчик, они, как правило, используют функцию print(), чтобы познакомиться с функцией или метод выполняется. Теперь я предполагаю, что вы используете версию Flutter 2.5, которая по умолчанию поставляется с пакетом flutter_lints, который содержит набор правил Flutter, который команда Flutter рекомендует вам использовать в приложениях Flutter, пакетах и плагины. Этот подключаемый модуль анализирует код во время написания, и когда вы используете функцию print(), он показывает предупреждение, в котором говорится: "Избегайте вызовов печати в производственном коде". . Теперь это может показаться нормальным, пока вы не забудете удалить print() при использовании его в рабочей среде. Чтобы быстро решить эту проблему, используйте метод debugPrint(). Я пытался использовать этот метод, но почему-то и иногда он показывает мне ошибку, что "Метод debugPrint() не определен" Я имею в виду, что он по умолчанию предоставляется Dart SDK, он не должен показывать мне эту ошибку, но поверьте мне, что это так, и я раздражаюсь, пишу это снова и снова, поэтому ошибка исчезает.

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

Что такое регистратор?

Небольшой, простой в использовании и расширяемый регистратор, который печатает красивые журналы.
Вдохновлен logger для Android. Просто и легко. Теперь, как его использовать?

Как использовать регистратор?

Чтобы использовать средство ведения журнала, необходимо создать экземпляр класса Logger.

final logger = Logger();

Вот методы, которые вы можете использовать:

logger.v("[VERBOSE] You don't always want to see all of these")
logger.d("[DEBUGGING] Logs a debug message")
logger.i("[INFORMATION] A method is called")
logger.w("[WARNING] This might become a problem")
logger.e("[ERROR] You got me 👀")
logger.wtf("What a terrible failure log");

Почему я рекомендую вам использовать логгер

Чтобы отображать только определенные уровни журнала, вы можете установить:

Logger.level = Level.warning;

Вышеупомянутая строка скрывает подробные события, события отладки и информационные журналы, чтобы отображались только журналы уровня предупреждений.

Вы также можете настроить Logger

При создании регистратора можно передать некоторые параметры:

final logger = Logger(
  filter: null, // Use the default LogFilter (-> only log in debug mode)
  printer: PrettyPrinter(), // Use the PrettyPrinter to format and print log
  output: null, // Use the default LogOutput (-> send everything to console)
);

Теперь, когда вы используете описанный выше метод для ведения журнала, он работает довольно хорошо, но есть одна проблема: он показывает все трассировки стека, что лично мне не нравится. А еще, иногда, вывод логов долгий. Давайте настроим его больше.

final logger = Logger(
  printer: PrettyPrinter(
    methodCount: 2, // number of method calls to be displayed
    errorMethodCount: 8, // number of method calls if stacktrace is provided
    lineLength: 120, // width of the output
    colors: true, // Colorful log messages
    printEmojis: true, // Print an emoji for each log message
    printTime: true // Should each log print contain a timestamp  ),
);

Мы можем использовать принтер, который принимает PrettyPrinter() в качестве параметра. Приведенный выше код будет отображать до 8 трассировок стека, настроив количество методов ошибок. Вы также можете контролировать ширину вывода, указав длина строки. Разве не было бы здорово, если бы у нас были какие-то визуальные эффекты, чтобы лучше понимать наши журналы? Я имею в виду красный цвет для ошибки, желтый для предупреждения и синий для информации. Установите цвета на true, чтобы все это произошло. Это действительно очень помогает мне различать ошибки, предупреждения, информацию и многословие.

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

Управление состоянием во флаттере имеет решающее значение, иногда вам нужно отслеживать, когда ваши виджеты перестраиваются и почему ваши виджеты перестраиваются. Как вы отслеживаете перестроения ваших виджетов? Отмечая время, когда виджеты строятся и когда виджеты перестраиваются. Установив значение время печати в значение true, я не только узнаю, в какое время вызываются мои методы/функции, но также могу узнать, в какое время вызываются методы. называется и в какое время мои состояния обновляются. Лучше всего то, что он также показывает время в миллисекундах. Теперь я действительно могу отслеживать перестроения своих виджетов и повышать производительность приложения.

Регистрация больше, чем просто строка!

Каждый раз, когда вы регистрируетесь, нет необходимости, вы всегда будете регистрировать строку. Иногда вам нужно регистрировать списки, карты или наборы. print()и debugPrint() обязывают вас использовать только строку, поэтому каждый раз, когда вам нужно записывать List , Map или Set вам нужно преобразовать эти структуры данных в строку. Лучшее в этом пакете то, что вы можете регистрировать не только строки, но и списки, карты или наборы.

И последнее, но не менее важное: вот мой лично предпочтительный фрагмент кода, который я использую во всех своих проектах Flutter.

Я добавляю приведенный выше код в свой файл constants.dart, чтобы я мог использовать его в любое время в любом месте всего проекта.

Совет и хитрость

Чем больше кода вы пишете и чем больше логов добавляете, тем больше вы запутаетесь при выполнении своей программы. Вы запутаетесь в том, откуда берутся все эти журналы. Какой класс? и с какого метода?

logger.e("[ClassName] Method Name: This is how I debug!")

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

Краткое содержание

Есть еще кое-что о пакете logger, который я не упомянул, потому что вышеперечисленного достаточно. Больше внимания уделяйте коду. logger просто помогает нам упростить отладку, чтобы мы могли писать более полезный код, а не багги. Надеюсь, вам понравилась моя статья. Спасибо за прочтение.

Прежде чем пойти

Flutter 2.8 здесь, и я думал написать статью о том же. Как вы думаете, писать мне это или нет? пожалуйста, поделитесь им в комментариях или зайдите в мои социальные сети. LinkedIn, Twitter, и Instagram