Получил? Оценка производительности в статистике страницы
Итак, у меня есть 2 сайта Gatsbyjs
Одному было около 40.
Мой второй, который я построил недавно, набрал "?"
И затем, когда я обновил первый, чтобы улучшить его производительность, он получил '?' Также.
2 сайта:
Pixelfriendly.co.za
Bee-projects.co.za
1 ответ
Что-то на вашем веб-сайте вызывает ошибку Page Speed Insights.
Если вы посмотрите на раздел "Лабораторные данные", вы увидите часть с надписью "Самая большая содержательная краска" с надписью "Ошибка" для обоих сайтов.
Это почти наверняка связано с вашей анимацией.
Вы видите, что самая большая Contentful Paint ищет самый большой элемент, нарисованный на экране. Теперь он отслеживает это только через пару секунд после того, как ЦП перестанет работать и все ресурсы будут загружены, после чего тест завершится.
Проблема в том, что ваши анимации так долго "завершаются", что не заканчиваются до окончания теста. Итак, PSI не знает, что такое самая большая Contentful Paint, и выдает ошибку.
Что вы можете сделать, чтобы это исправить?
Если вы хотите сохранить анимацию, ничего, вы не сможете использовать Lighthouse (в инструментах разработчика Google Chrome) или Page Speed Insights (поскольку он работает на Lighthouse).
Однако я бы посоветовал вам значительно сократить продолжительность "анимации открытия" на обоих сайтах. Люди очень быстро принимают решение о том, подходит ли им страница, и ждать до 5 секунд, прежде чем она будет выглядеть готовой, - это слишком много. Обязательно сохраните анимацию, но сократите ее время как минимум наполовину, если не на две трети.
Если вы сделаете это, это принесет пользу вашему сайту за счет снижения показателя отказов, но также сделает ваш сайт снова тестируемым в качестве дополнительного бонуса.