В тысячный раз вы тестируете! В Chrome, Firefox, Safari, Edge, Opera, Midori (подождите, что это за хрень?) И Internet Explorer (хотя мы смеялись над мемами, мы все боялись отключиться и оставить наш дорогой IE уравнения). Для мобильных устройств и Интернета; вы не оставите камня на камне здесь. Ваше приложение изменит мир! Это изменит то, как люди управляют машинами - или как машины управляют людьми (поверьте мне, нет предела тому, насколько безумными могут быть эти идеи). У вас столько возможностей для этого приложения, что все ... просто ... так ...

Приятель, тебе лучше очнуться от задумчивости. В вашем приложении будут ошибки! Извини, если я обидел твои чувства (часть меня на самом деле не собиралась этого делать), но это не мюзикл для старших классов. Здесь у нас будут проблемы; проблемы с пользователями, которые даже не знают своего дела, проблемы с сервером, даже проблемы с людьми, у которых еще нет рабочих драйверов Wi-Fi на своем устройстве, загрузите Xender и затем дайте ему оценку одной звезды. Плохая новость в том, что демоны будут всегда, хорошая новость в том, что мы можем отслеживать в реальном времени этих демонов, откуда они приходят и как отправить их обратно в яму.

Войдите в LogRocket! Профессиональный инструмент JavaScript из конюшни Мэтта Арбесфельда и Бена Эдельштейна, он был разработан для того, чтобы запутался »разработчик программного обеспечения (на самом деле мы с вами). Когда ваше приложение становится золотым, LogRocket записывает сеансы каждого действия, выполняемого пользователями, регистрирует журналы и воспроизводит ошибки. В целом это помогает быстрее устранять проблемы. Пора тебе перестать гадать, почему случаются ошибки, пойдем со мной.

Установка LogRocket

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

Затем мы устанавливаем через npm, регистрируя в нашем интерфейсе командной строки следующее:

npm i --save logrocket

В первых строках нашего кода:

import LogRocket from 'logrocket';

LogRocket.init('app/id');

Сбор отзывов с помощью LogRocket.

Основная функция LogRocket - сбор пользовательских данных различными способами, это помогает быстрее отлаживать проблемы и понимать, как ведут себя пользователи. Другие способы достижения этого включают:

  1. Автоматический захват действий Redux, состояния Redux и журналов консоли из вашего приложения.
  2. Захватывает реальные живые видео пользователей в вашем приложении, функция стала возможной с помощью MutationObserver API. LogRocket позволяет вам воспроизводить эти видео, чтобы вы могли разобраться в проблеме, а также определить соответствующее поведение пользователя.
  3. Обработка сетевых запросов и ответов. LogRocket делает это, используя API XmlHttpRequest и fetch для получения данных запросов и ответов из вашего приложения с учетом кодов состояния, заголовков и тел.
  4. Сбор данных о производительности. Хотя все еще находится в альфа-версии, количество кадров в секунду (FPS), пропускная способность и использование памяти вашего приложения фиксируются, чтобы помочь вам лучше понять, как в целом пользователь взаимодействует с вашим приложением.

Конфиденциальность данных с LogRocket

Учитывая все эти летающие пользовательские данные, единственное, что нужно знать о том, насколько осторожно LogRocket обрабатывает данные, верно? Что ж, LogRocket достаточно серьезно относится к конфиденциальности, чтобы скрыть пользовательские данные, такие как пароли, личные данные и данные кредитной карты. Ключевым моментом здесь является знание того, что при сборе достаточного количества информации для помощи в отладке нужно пересечь черту. Чтобы реализовать это, был разработан SDK LogRocket, позволяющий разработчикам принимать решения о том, какую информацию исключать из отчетов LogRocket (нужно ли говорить, что, поскольку конфиденциальность и безопасность никогда не устареют, в LogRocket вносятся постоянные обновления и добавляются новые функции). SDK выполняет это, добавляя имя класса _lr-hide к любому элементу DOM, который вы хотите сделать закрытым. Таким образом, любой элемент (-ы) DOM, родителем которого является частный элемент DOM, не покинет родительский браузер. Поля данных формы и пароля не исключаются из этого, _lr-hide также могут быть добавлены к input и textarea элементам DOM.

Безопасность с LogRocket

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

  1. Блокирует сторонние файлы cookie; LogRocket не создает уникальный профиль для отслеживания пользователей в доменах, не связанных с пользователем.
  2. При использовании LogRocket с вашим приложением вы можете заблокировать запись и сбор любой личной информации (PII), вставленной нажатием клавиши в формах или определенной пользователями. LogRocket делает это с помощью ряда средств, некоторые из которых:
  • API, разработанный LogRocket для идентификации и блокировки любого вида PII до того, как он покинет браузер пользователя. Этот инструмент также позволяет пользователям легко идентифицировать поля PII и, таким образом, поддерживать астрономический уровень безопасности данных.
  • Блокировка нажатия клавиш на стороне клиента; Это происходит по умолчанию, ввод паролей, кредитных карт и других конфиденциальных полей не регистрируется LogRocket.

3. Он соответствует определенным важным правилам и политикам по безопасности и регулированию PII, некоторые из которых - Закон о переносимости и подотчетности медицинского страхования (HIPAA), Стандарт безопасности данных индустрии платежных карт (PCI DSS) и Gramm- Leach-Bliley Act (GLBA), чтобы гарантировать, что он не получает никакой личной информации от своих пользователей и что любые данные, которые он обрабатывает, остаются анонимными.

Производительность с LogRocket

Ага! Самое интересное ... В инженерном деле и приложениях производительность является ключевым фактором. Зависание приложения должно быть последним из ваших беспокойств при использовании LogRocket. Он улучшает и обеспечивает оптимальный уровень производительности за счет:

  • Добавление небольшой прокладки незначительного размера (‹8kb) для перехвата API-интерфейсов браузера. Для успешного перехвата прокладка должна загружаться до загрузки страницы. Весь процесс добавляет очень незначительное увеличение времени загрузки страницы.
  • Использование потоков пользовательского интерфейса (UI). Поскольку наиболее ограниченным ресурсом в браузере является загрузка ЦП в потоке пользовательского интерфейса, LogRocket был построен для выполнения всех длительно выполняемых задач в рабочем потоке. Это снижает рабочую нагрузку на основной поток и гарантирует, что единственная работа, выполняемая в основном потоке, - это отправка данных в рабочий поток.
  • Ограничение использования полосы пропускания браузерами с помощью высоко оптимизированного формата двоичного сжатия. Это гарантирует, что все сжатие и загрузка выполняются в рабочем потоке.

Вот и все! Наблюдение за развернутыми и находящимися в производстве приложениями не могло быть более гладким. Я мог бы продолжать и продолжать, но вы должны все увидеть здесь. Я наткнулся на LogRocket после того, как у меня возникли проблемы с отслеживанием времени, и что нет, мне только жаль, что я не знал раньше, lol:) ... Ура!