FastComments.com Blog

Fri Jan 21 2022
...

FastComments Выпускает Рендеринг на Серверной Стороне

! В этой статье есть технический жаргон

Что нового

С момента запуска в начале 2020 года FastComments использовал исключительно JavaScript для рендеринга виджета комментариев.

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

Это скриншот, не пытайтесь на него нажимать.
SSR Demo

Вышеуказанный скриншот является виджетом комментариев FastComments, без JavaScript. Вы можете просмотреть эту страницу без JavaScript здесь.

Как это использовать

Если вы используете WordPress, плагин FastComments версии 3.10.1 автоматически добавляет поддержку SSR как резервный вариант для ваших пользователей, которые просматривают с отключенным JS.

Для кастомных реализаций получите UI для потока комментариев, просто вызвав /ssr/comments для этой страницы:

https://fastcomments.com/ssr/comments?tenantId=$tenantId&urlId=$urlId&url=$url

Где $urlId — это url или id страницы. Документация по этому вопросу находится здесь.

Например, с помощью PHP мы можем отправить iframe на страницу, которая рендерит поток комментариев внутри:

Пример SSR на базе PHP
1
2<?php
3$tenantId = rawurlencode("my-tenant-id");
4$urlId = rawurlencode("my-page-url-article-id");
5$url = rawurlencode("my-page-url");
6
7$fastcomments_url = "https://fastcomments.com/ssr/comments?tenantId=$tenantId&urlId=$urlId&url=$url";
8?>
9<iframe
10 src="<?php echo $fastcomments_url; ?>"
11 horizontalscrolling="no"
12 allowtransparency="true"
13 frameborder="0"
14 title="FastComments"
15 width="100%"
16 height="1500px"
17 style= "width: 1px !important; min-width: 100% !important; border: none !important; overflow: hidden !important;"
18></iframe>
19

Мы также можем сделать API вызов, чтобы получить HTML для потока комментариев, и отрендерить или сохранить его.

Полная документация доступна в документации по SSR на docs.fastcomments.com.

SSO

Поскольку нам нравятся звучащие как предприятия аббревиатуры, не беспокойтесь, SSR поддерживает SSO. Пример единого входа с SSR здесь.

Локализация

Конечная точка на основе SSR автоматически локализует ответ на основе языковых заголовков, которые отправляет браузер. Она также может использовать те же переопределения локализации, что и виджет на основе JavaScript.

Зачем это было создано

Одним из основных жалоб на такие сервисы, как FastComments, является то, что они требуют JS. Мы уже сделали наш виджет комментариев максимально легким и гарантируем, что соблюдаем наши SLA для API вызовов менее 20 мс, но многие мелкие сообщества не выберут такое решение, если это означает добавление JS на их сайт.

Это также открывает возможность использовать движки рендеринга, у которых нет доступа к JavaScript.

Технология

FastComments использует свой собственный небольшой микроframework для рендеринга UI. Этот фреймворк использует подход, похожий на React, за исключением того, что ручные манипуляции DOM вне начального рендеринга разрешены.

Основная библиотека виджета комментариев имеет единую точку входа - она принимает набор состояний и создает соответствующий HTML и CSS для рендеринга. Мы также просто вызываем это на сервере. Когда пользователь взаимодействует со страницей, состояние изменяется, и последний HTML извлекается. Это было создано в результате хакатона, который проходил в рамках нового года.

Живое комментирование

Поскольку UI рендерится сервером один раз, функции живого комментирования в настоящее время недоступны.

Дополнительно, колокольчик уведомлений в данный момент недоступен. Мы будем открыты к добавлению этой функции в будущем.

Производительность

Рендеренный сервером UI использует те же оптимизации хранения и движок рендеринга, что и виджет на основе JavaScript. Для небольших потоков комментариев производительность на самом деле лучше, так как пользователю не нужно загружать скрипт, который затем извлекает комментарии и рендерит UI.

Паук и SEO

FastComments уже хорошо работает с веб-сканерами; если SEO является проблемой, использование SSR не обязательно.

Будущие приложения

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

В заключение

Мы надеемся, что вы нашли это руководство полезным и легким для чтения. Не стесняйтесь комментировать ниже с любыми вопросами.

Удачи!