Как профилировать исходный код React Native с помощью Xcode / Instruments / Time Profiler - PullRequest
18 голосов
/ 28 октября 2019

Мы используем React Native 0.59.10 и React-Redux 5.0.7 и испытываем проблему с привязкой к процессору, из-за которой для наших действий Redux требуется ~ 0,25 с.

МыМы профилировали с использованием конфигурации Time Profiler в Instruments, но ни один из нашего кода JS не обозначен символами.

Удаленная отладка в Chrome, кажется, просто отлаживает страницу «удаленного инспектора», которая совершенно бесполезна.

Есть ли способ построить / прикрепить карту источника или символизировать адреса памяти, показанные ниже, к именам / вызовам функций JS?

Instruments Callstack

1 Ответ

3 голосов
/ 11 ноября 2019

Firefox Profiler

Общие сведения о Firefox Profiler

В Firefox Profiler имеется более актуальная документация, доступная по адресуprofiler.firefox.com/docs/. Однако следующее может содержать некоторую потенциально полезную информацию для проблем, характерных для Gecko.

Вы можете проверить некоторые часто задаваемые вопросы о Firefox Profilers.

В отчете о проблеме с производительностью есть шагруководство по получению профиля по запросу разработчиков Firefox.

1. Временная шкала

Временная шкала имеет несколько рядов маркеров трассировки (цветные сегменты), которые указывают интересные события. Наведите курсор на них, чтобы увидеть больше информации. Под маркерами трассировки находятся строки, соответствующие активности в различных потоках.

Совет: потоки, помеченные знаком «[по умолчанию]», находятся в родительском элементе (он же «UI», он же «браузер хром»). Процесс ", он же" главный "), и те, которые отмечены как" [tab] ", находятся в процессах веб-контента (он же" дочерний ").

enter image description here

Совет. Длительные задачи в родительском процессе будут блокировать весь ввод или отрисовку с помощью пользовательского интерфейса браузера (так называемый "пользовательский интерфейс"), тогда как длительные задачи в процессе содержимого будут блокировать интерактивность со страницей, новсе еще позволяя пользователю выполнять панорамирование и масштабирование благодаря APZ.

маркеры трассировки

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

Black: Это указывает на синхронные вызовы IPC.

2. Дерево вызовов

enter image description here

Дерево вызовов показывает сэмплы, организованные в «Run Time», которые будут показывать данные по времени настенных часов. Справа от элементов дерева есть светло-серые имена, указывающие, откуда исходит код. Помните, что элементы могут быть из JavaScript, Gecko или системных библиотек. Обратите внимание, что если некоторые функции еще не названы должным образом, символизация может быть еще не закончена.

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

3. Совместное использование профиля Нажмите «Поделиться ...»> Поделиться, подтверждая, что URL-адреса, которые вы открыли, и ваши расширения Firefox будут включены в данные профиля, отправленные на сервер. Если вы выберете другой временной диапазон, URL-адрес, отображаемый нажатием «Постоянная ссылка», изменится, так что вы можете быть уверены, что получатель URL-адреса увидит то же, что и вы.

...