Поскольку Google и прочие алгоритмы индексирования держат в секрете, наверняка мы знать не можем. Но из того, что известно, контент псевдоэлементов не идексируется вообще. Пруф. Впрочем, остальной контент, доступный роботу, будет индексироваться нормально, и наличие контента в псевдо-элементах на качество индексации нормального контента не повлияет.
Код, который вы нашли, правильный и точно работает, удаляя обертывающий тег P вокруг изображений, вставленных в визуальный редактор. Собственно, у вас на скриншоте "с хуком" тега P как раз и нет. Вообще нет. А вот растянуть картинку на всю ширину - это уже другая задача, и она из мира CSS.
1. Вы можете просто присвоить первому посту в цикле отдельный CSS-класс и стилями получить заданный layout.
2. Если стилями недостаточно (надо модифицировать html тоже), опять же проверяете на первый пост в WP_Query и через if/else выводите нужные фрагменты. Смотрите тут Оформление первой записи в цикле wordpress?
Меньше DOM элементов.
Меньше вложенности DOM элементов.
Меньше ивентов
Минус jQuery
Меньше скриптов и библиотек
Меньше CSS
Минус Bootstrap и прочие тяжелые либы
Меньше repaint'ов
Меньше манипуляций с DOM
Больше оптимизации картинок
Меньше кастомных шрифтов
Если шрифты кастомные - использовать ровно необходимый charset и вырезать лишнее
...
PS: SVG на PNG не меняйте. Сомнительная экономия на спичках, а качество сильно хуже, возможностей меньше. Да и вообще "фу, прошлый век"
Ту же сеть не сбрасывайте со счетов - тот же HTTP/2 с его потоком (прощай, конкатенация) одновременно доставит в браузер все нужное, что ускорит прорисовку. А с новым server push все самое нужное вообще прилетает вместе с html. В общем, тут все связано.
Веб-шрифты не объединяются так как вы хотите (насколько мне известно, а известно вроде бы неплохо). Подключаются ручками, процесс можно автоматизировать (вам уже посоветовали как). Перегонять в base64 смысла нет.
У меня все летает прекрасно, топовый MacBook Pro свежий. Да, тазик мощный, но поверьте, многие сайты и на нем лагают, даже браузеры вылетают иногда :)
Так что вопрос в железе.
Это называется FOUC - Flash of Unstyled Content. Когда браузер отрисовывает страницу изначально, шрифты еще не догрузились. Когда догрузились - происходит перерисовка. Убрать полностью можно только отправляя сами файлы шрифтов в base64 в основном файле стилей. Тогда шрифт будет доступен сразу вместе с CSS, и все будет ок. Но есть и другой, более корректный способ - HTTP/2 и (в идеале) server push.