Убираем лишнее из формы комментариев блога на Blogger

Ускорение загрузки блога на Blogger за счёт удаления из шаблона формы комментариев всего лишнего. Статья рассчитана на продвинутого пользователя и требует чёткого понимания того, что вы делаете. Однако результат стоит затраченного времени на 100%.

Проверяя отдельную страницу (работающего на платформе Blogger) блога в Google инструменте PageSpeed Insights, я обратил внимание на проблемы с рядом CSS и JavaScript файлов, связанных с формой отправки комментария.

Если взять простейший вариант системы комментариев в Blogger, с использованием b:includable id='comment-form', то там мы найдём следующий код (привожу только фрагмент!):

<a expr:href='data:post.commentFormIframeSrc' id='comment-editor-src'/>
<iframe allowtransparency='true' class='blogger-iframe-colorize blogger-comment-from-post' frameborder='0' height='410' id='comment-editor' name='comment-editor' src='' width='100%'/>
…
<data:post.friendConnectJs/>
<data:post.cmtfpIframe/>
<script type='text/javascript'>
  BLOG_CMT_createIframe(&#39;<data:post.appRpcRelayPath/>&#39;);
</script>

По крайней мере, в случае использования одноуровневой системы комментариев, он сгенерирует следующий HTML-код, например:

<a href='https://www.blogger.com/comment-iframe.g?blogID=2318043484134145872&postID=594486772191789399' id='comment-editor-src'></a>
<iframe allowtransparency='true' class='blogger-iframe-colorize blogger-comment-from-post' frameborder='0' height='400' id='comment-editor' name='comment-editor' src='' width='100%'></iframe>
<script type="text/javascript" src="https://www.blogger.com/static/v1/jsbin/3369861379-comment_from_post_iframe.js"></script>
<script type='text/javascript'>BLOG_CMT_createIframe('https://www.blogger.com/rpc_relay.html', '18127172147079218923');</script>

Как вы видите, здесь мы имеем:

• ссылку с URL-адресом формы «оставить комментарий» для IFRAME;
• изначально пустой IFRAME, в который подгружается форма «оставить комментарий»;
• подгрузку JavaScript-файла 3369861379-comment_from_post_iframe.js с функцией BLOG_CMT_createIframe() и иже;
• вызов функции BLOG_CMT_createIframe(), которая подгружает форму «оставить комментарий» из ссылки в iframe.

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

Очевидно, что подобная реализации нужна для тех случаев, когда мы работаем с различными «наворотами» в системе комментариев (функция «ответить», многоуровневые комментарии и т.д.). Если же нам это не нужно, то весь представленный выше код шаблона можно заменить всего одной строкой:

<iframe style="width:100%;height:240px" allowtransparency='true' expr:src='data:post.commentFormIframeSrc'  frameborder='0'/>

Здесь вызов формы «оставить комментарий» происходит в самом IFRAME. Никакого JavaScript! Только то, что есть на странице формы «оставить комментарий».

По сути, формат URL-адреса этой страницы имеет вид:

http://www.blogger.com/comment-iframe.g?blogID=XXXXXXX&postID=XXXXXXX

А при необходимости «ответ на комментарий»:

http://www.blogger.com/comment-iframe.g?blogID=XXXXXXX&postID=XXXXXXX&parentID=XXXXXX

Последнее реализовать сложнее, но тем не менее:

• blogID это шаблонная переменная data:blog.blogId;
• postID это шаблонная переменная data:post.id;
• parentID это шаблонная переменная data:comment.id.

Так что если есть желание, можно реализовать достаточно многое, в том числе и с функцией «ответить на комментарий». На счёт последнего, рекомендую глянуть статью «Membuat Fitur Komentar Berbalas (Threaded Comments) pada Blogger dengan Fungsional yang Asli», проследовав по этой ссылке, почерпнёте много интересного.