У меня есть признание: я зависим от Wordle. Особенно сейчас, когда это не в моде и люди не пишут об этом. Мне нравится, что он короткий, я могу разгадать одно слово, а потом его нет. Я не чувствую себя слишком плохо из-за зависимости и траты времени на игру. Этот учебник по облачному отладчику является для меня огромной проблемой, поскольку целью является игра Wordle. Но я забегаю вперед.

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

Мы решили выбрать Wordle в качестве нашего демонстрационного приложения, потому что оно сразу знакомо, визуально и не слишком интерактивно. Отладка демо-версии Flappy Bird может быть болезненной. На этом этапе наша ключевая задача заключалась в создании ошибки, в которой процесс отладки был бы достаточно интересным и в то же время достаточно тонким, чтобы он не был сразу очевиден.

Создать такую ​​ошибку на удивление сложно. Нам не нужно слишком сложное приложение, охватывающее несколько файлов. Это может сделать процесс отладки слишком сложным. С другой стороны, ошибка должна быть достаточно тонкой, чтобы мы не замечали ее, даже если пристально смотрели на нее.

Вот ошибка:

constguess = []
for (leti = 0; i < game.word.length; ++i) {
  if (game.word.includes(guessWord[i])) {
    guess.push({ letter:guessWord[i], check:CHECK_TYPES.LETTER_INCLUDED })
  } else if (guessWord[i] === game.word[i]) {
    guess.push({ letter:guessWord[i], check:CHECK_TYPES.LETTER_MATCHED })
  } else {
    guess.push({ letter:guessWord[i], check:CHECK_TYPES.LETTER_NOT_INCLUDED })
  }
}

Можете ли вы определить проблему?

Чтобы понять это, нам нужно сначала понять симптом ошибки, которую мы выбрали. Когда я говорю о багах, люди часто думают о сбоях. Иногда это может иметь место, но, по моему опыту, наиболее частые ошибки — это логические ошибки, возникающие из-за того, что производственная среда каким-то тонким образом отличается от нашей тестовой среды. Из-за этого мы выбрали логическую ошибку, к сожалению, из-за ограничения простоты я сомневаюсь, что подобная ошибка попала бы в производство. Основной урок остается в силе.

Ошибка в этом случае заключается в том, что буквы в Wordle, которые должны быть окрашены в зеленый цвет, потому что они находятся в правильном месте в слове, окрашены в желтый цвет. Эта логика реализуется кодом, который мы видим выше. Как видите, у нас есть три режима:

  • CHECK_TYPES.LETTER_INCLUDED - указывает, что буква должна быть окрашена в желтый цвет
  • CHECK_TYPES.LETTER_MATCHED - указывает, что буква должна быть окрашена в зеленый цвет
  • CHECK_TYPES.LETTER_NOT_INCLUDED - указывает, что буква отсутствует и должна быть серой

Можете ли вы определить проблему сейчас?

Не листайте вниз, чтобы избежать спойлеров...

Вот рабочий код:

constguess = []
for (leti = 0; i < game.word.length; ++i) {
  if (game.word.includes(guessWord[i])) {
    guess.push({ letter:guessWord[i], check:CHECK_TYPES.LETTER_MATCHED })
  } else if (guessWord[i] === game.word[i]) {
    guess.push({ letter:guessWord[i], check:CHECK_TYPES.LETTER_INCLUDED })
  } else {
    guess.push({ letter:guessWord[i], check:CHECK_TYPES.LETTER_NOT_INCLUDED })
  }
}

Разница в том, что я поменял местами две строки кода. Нам нужно проверить CHECK_TYPES.LETTER_MATCHED перед тестом CHECK_TYPES.LETTER_INCLUDED. Тесты должны располагаться в порядке значимости, а зеленый (полное совпадение) должен предшествовать желтому (частичное совпадение).

Процесс отладки относительно прост. Мы поместили снимок/точку останова на следующую строку, где увидели неверные значения на уровне кода сервера. Я думаю, что более естественным способом отладки было бы поместить точку останова в строку CHECK_TYPES.LETTER_MATCHED, и как только мы поймем, что она никогда не сработала, мы бы поняли, что пошло не так. Для нашего конкретного случая использования игровой площадки это был неправильный подход. Мы хотели, чтобы люди видели, как срабатывает моментальный снимок (неразрывная точка останова). Но кроме этого, это хороший баг.

Если это все еще не ясно, у нас есть эта классная анимация на игровой площадке, которая визуально объясняет ошибку:

Обучение отладке

Отладка — один из тех предметов, которые мы не изучаем в университете. Да, есть курсы, которые охватывают это, но не так много. В основном ожидается, что вы справитесь с этим самостоятельно (например, с помощью специального инструмента для оперативной отладки). Это во многом показывает, почему это так. Очень сложно создавать упражнения для отладки и еще сложнее проверять знания.

Мы могли бы создать более сложную демонстрацию для отладки, но здесь мы переходим в мир понимания и объяснения этой кодовой базы. Это не цель. За последние пару лет я просмотрел множество материалов, связанных с отладкой, и это, похоже, универсальная проблема, с которой боремся все мы. Это позор, поскольку существует так много инструментов, методов и подходов, которые упускают даже опытные разработчики.

В этом смысле я сторонник обучения отладке без ошибок. Отладчики — это инструменты, которые мы можем изучить и использовать до того, как у нас появится какая-либо ошибка, даже в качестве инструмента обучения. Я думаю, что нам должно быть комфортно в среде отладки, и мы должны использовать ее, когда ошибок нет. Это не должен быть инструмент, к которому мы обращаемся только в случае чрезвычайной ситуации. Если мы будем работать с отладчиком на регулярной основе, с его помощью будет намного проще отслеживать ошибки, когда он нам действительно понадобится.

Это философия, которой я придерживаюсь в отношении таких инструментов, как инструменты наблюдения, журналы и т. д. Мышцы, которые мы не напрягаем регулярно, теряют свою массу и ослабевают. Синтетические задачи хороши для короткого урока, но мы не можем использовать их ежедневно, и их сложно масштабировать до полноценного семинара или курса.

Окончательно

Как вы относитесь к тому, как вы научились отладке? Это было в колледже, университете, буткемпе или на работе?

Считаете ли вы, что хорошо знаете предмет?

Вы обучаете отладке других? Если да, то как и какие методы вы используете? Что, по вашему мнению, работает лучше всего?

Я хотел бы услышать от вас в Твиттере @debugagent (мои личные сообщения открыты), LinkedIn или в комментариях или на любом другом канале. Частный или публичный.

Напоминаем, что наша игровая площадка открыта для бизнеса — не стесняйтесь бродить, проверять наши навыки отладки и отчитываться!