FastComments.com

Menu Icon

Idioma 🇪🇸 Español
🇺🇸 English 🇧🇬 Български 🇨🇳 简体中文 🇹🇼 繁體中文 🇭🇷 Hrvatski 🇩🇰 Dansk 🇳🇱 Nederlands 🇺🇸 English (US) 🇨🇦 Français (Canada) 🇫🇷 Français (France) 🇩🇪 Deutsch 🇨🇾 Ελληνικά (Κύπρος) 🇬🇷 Ελληνικά 🇮🇱 עברית 🇮🇹 Italiano 🇯🇵 日本語 🇰🇷 한국어 🇵🇱 Polski 🇧🇷 Português (Brasil) 🇷🇺 Русский 🇺🇦 Русский (Украина) 🇧🇦 Српски (БиХ) 🇷🇸 Srpski (Latinica) 🇲🇪 Српски (Црна Гора) 🇷🇸 Српски 🇸🇮 Slovenščina 🇪🇸 Español 🇺🇦 Українська 🇹🇷 Türkçe

Antecedentes

¿Qué es SSR?
Beneficios del SSR
Características compatibles con SSR de FastComments

Uso de SSR

Casos de uso
Dónde FastComments utiliza SSR
Uso de SSR

¿Qué es SSR? Internal Link

SSR, o renderizado en el servidor, es un mecanismo y un conjunto de convenciones donde una aplicación o contenido se renderiza con un esfuerzo mínimo por parte del cliente.

Con SSR, el cliente no ejecuta JavaScript. En su lugar, el cliente renderiza HTML/CSS que fue "renderizado" por el servidor.

Beneficios del SSR Internal Link

Un beneficio importante de SSR es que no se requiere JavaScript. Debido a esto, las aplicaciones pueden construirse para sentirse "más ligeras" en muchos casos de uso.

Además, SSR puede utilizarse como reserva en caso de que el usuario tenga JavaScript desactivado. De este modo los hilos de comentarios aún pueden renderizarse, y el usuario todavía puede responder a los comentarios.

FastComments ya está bien optimizado, por lo que en la mayoría de los casos SSR no es necesario. Sin embargo, algunas comunidades en línea tienen usuarios que no usan JavaScript, o deshabilitarlo es la práctica preferida. Aquí es donde SSR de FastComments puede ser útil.

Sin embargo, una desventaja importante de SSR es tener que recargar la página por pequeños cambios de estado.

Características compatibles con SSR de FastComments Internal Link

FastComments admite las siguientes características con SSR:

  • Widget de comentarios personalizable.
  • Comentarios anónimos.
  • Comentar con sesión iniciada.
  • SSO.
  • Respuestas raíz y anidadas.
  • Visualización y paginación de hilos de comentarios.
  • Votación, incluyendo votación anónima.
  • Cambiar la dirección de ordenamiento predeterminada.

Un ejemplo

Un ejemplo de FastComments SSR está disponible aquí.

FastComments SSR
External Link

Casos de uso Internal Link

Los siguientes son ejemplos de casos de uso de SSR:

  • Una alternativa para cuando JavaScript está deshabilitado.
  • Renderizar una interfaz de comentarios en un entorno donde JavaScript no está disponible o no se desea.
  • Para sitios o comunidades en línea donde no se desea la inclusión de más JavaScript.

Dónde FastComments utiliza SSR Internal Link

FastComments utiliza SSR en los siguientes lugares:

  • Nuestro plugin de WordPress utiliza SSR como respaldo por defecto. Si JavaScript está deshabilitado, los usuarios aún pueden comentar en su blog.
  • Lo usamos como respaldo en nuestro propio Blog! https://blog.fastcomments.com

Uso de SSR Internal Link

Para usar FastComments SSR, el cliente puede obtener HTML desde el endpoint https://fastcomments.com/ssr/comments.

Esto se puede hacer de varias maneras.

Con WordPress

SSR está habilitado por defecto para los usuarios sin JS habilitado como alternativa en el plugin de WordPress desde la versión 3.10.2.

En una página web

Con una aplicación ya existente, SSR se puede agregar con el siguiente ejemplo, suponiendo que el lenguaje usado sea PHP:

Ejemplo de SSR basado en PHP
Copy Copy
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

También podemos mostrar la interfaz SSR solo cuando el usuario tiene JS deshabilitado:

Ejemplo de fallback SSR basado en PHP
Copy Copy
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<noscript>
10 <iframe
11 src="<?php echo $fastcomments_url; ?>"
12 horizontalscrolling="no"
13 allowtransparency="true"
14 frameborder="0"
15 title="FastComments"
16 width="100%"
17 height="1500px"
18 style= "width: 1px !important; min-width: 100% !important; border: none !important; overflow: hidden !important;"
19 ></iframe>
20</noscript>
21

Para un ejemplo que usa SSO, vea aquí.

Con contenido pre-renderizado

Nuestro blog se genera en tiempo de compilación y ofrece un buen ejemplo de SSR con Handlebars.

Los parámetros básicos

Los parámetros básicos que necesita pasar son:

  • tenantId - Esto lo identifica como cliente.
  • urlId - Esto identifica la página o artículo para cargar comentarios y define dónde se guardan.
  • url - Esto se usa para notificaciones y funciones relacionadas para enlazar de vuelta al hilo de comentarios.

Estilos personalizados

La versión SSR del widget de comentarios usa la misma estructura y motor de renderizado que la versión de JavaScript.

Por lo tanto, todos los estilos personalizados que funcionan para el widget de comentarios de JavaScript funcionan para SSR.

Notas

Con SSR, no hay JavaScript para controlar la altura del contenedor renderizado. En los navegadores, puede aparecer una barra de desplazamiento vertical para discusiones largas.

Por lo tanto, debe ajustarlo según lo desee.

Contribuir a esta guía