PageSpeed ​​Insights: Минимизировать работу основного потока - Отладка этого с Chrome DevTools? - PullRequest
0 голосов
/ 20 апреля 2020

При попытке профилировать производительность сайта с помощью инструментов PageSpeed ​​я получаю смутное предложение минимизировать работу основного потока, как показано ниже:

page speed report

Ссылка «Узнать больше» здесь не совсем полезна. Я вижу, что стиль и макет составляют большую часть, поэтому я пытаюсь профилировать сайт с помощью Chrome Dev Tools. После запуска трассировки производительности я вижу все стили, макет и перерисовку в основном потоке.

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

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

Performance Profile

...