FastComments.com

Menu Icon

Taal 🇳🇱 Nederlands
🇺🇸 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

Achtergrond

Wat is SSR?
Voordelen van SSR
Door FastComments ondersteunde SSR-functies

SSR gebruiken

Gebruiksscenario's
Waar FastComments SSR gebruikt
SSR gebruiken

Wat is SSR? Internal Link

SSR, of Server-Side-Rendering, is een mechanisme en een set conventies waarbij een applicatie of inhoud wordt gerenderd met minimale inspanning van de client.

Met SSR voert de client geen JavaScript uit. In plaats daarvan rendert de client HTML/CSS die door de server is "gerenderd".

Voordelen van SSR Internal Link

Een groot voordeel van SSR is dat JavaScript niet vereist is. Hierdoor kunnen applicaties in veel gevallen "lichter" aanvoelen.

Bovendien kan SSR worden gebruikt als fallback voor het geval de gebruiker JavaScript heeft uitgeschakeld. Op deze manier kunnen commentaardraden nog steeds worden weergegeven, en kan de gebruiker nog steeds op reacties reageren.

FastComments is al goed geoptimaliseerd, dus in de meeste gevallen is SSR niet nodig. Sommige online communities hebben echter gebruikers die geen JavaScript gebruiken, of het uitschakelen ervan is de voorkeurspraktijk. Hier kan FastComments SSR handig zijn.

Een belangrijk nadeel van SSR is echter dat de pagina voor kleine statuswijzigingen opnieuw moet worden geladen.

Door FastComments ondersteunde SSR-functies Internal Link

FastComments ondersteunt de volgende functies met SSR:

  • Aanpasbare commentaarwidget.
  • Anoniem reageren.
  • Reageren terwijl u bent ingelogd.
  • SSO.
  • Hoofd- en geneste reacties.
  • Het bekijken & pagineren van reactiedraden.
  • Stemmen, inclusief anoniem stemmen.
  • De standaard sorteerrichting wijzigen.

Een voorbeeld

Een voorbeeld van FastComments SSR is beschikbaar hier.

FastComments SSR
External Link

Gebruiksscenario's Internal Link

Voorbeelden van gebruiksscenario's voor SSR zijn als volgt:

  • Een fallback voor wanneer JavaScript is uitgeschakeld.
  • Om een reactiesinterface weer te geven in een omgeving waar JavaScript niet beschikbaar is of niet gewenst is.
  • Voor sites of online communities waar het toevoegen van extra JavaScript niet gewenst is.

Waar FastComments SSR gebruikt Internal Link

FastComments gebruikt SSR op de volgende plaatsen:

  • Onze WordPress-plugin gebruikt SSR standaard als fallback. Als JavaScript is uitgeschakeld, kunnen gebruikers nog steeds een reactie plaatsen op je blog.
  • We gebruiken het als fallback op ons eigen Blog! https://blog.fastcomments.com

SSR gebruiken Internal Link

Om FastComments SSR te gebruiken, kan de client HTML ophalen van het endpoint https://fastcomments.com/ssr/comments.

Dit kan op verschillende manieren.

Met WordPress

SSR is standaard ingeschakeld als fallback voor gebruikers zonder ingeschakelde JS in de WordPress-plugin sinds versie 3.10.2.

In een webpagina

Bij een bestaande toepassing kan SSR worden toegevoegd met het volgende voorbeeld, ervan uitgaande dat de gebruikte taal PHP is:

PHP-gebaseerd SSR-voorbeeld
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

We kunnen de SSR-UI ook alleen tonen wanneer de gebruiker JavaScript heeft uitgeschakeld:

PHP-gebaseerd SSR-terugvalvoorbeeld
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

Voor een voorbeeld met SSO, zie hier.

Met vooraf-gerenderde inhoud

Onze blog wordt tijdens het bouwen gegenereerd en biedt een goed voorbeeld van SSR met Handlebars.

De basisparameters

De basisparameters die u moet doorgeven zijn:

  • tenantId - Dit identificeert u als klant.
  • urlId - Dit identificeert de pagina of het artikel waarvoor reacties moeten worden geladen, en bepaalt waar ze worden opgeslagen.
  • url - Dit wordt gebruikt voor meldingen en gerelateerde functies om terug te linken naar de reactiedraad.

Aangepaste styling

De SSR-versie van de reactiewidget gebruikt dezelfde structuur en rendering-engine als de JavaScript-versie.

Als zodanig werkt alle aangepaste styling die voor de JavaScript-reactiewidget werkt ook voor SSR.

Opmerkingen

Bij SSR is er geen JavaScript om de hoogte van de gerenderde container te regelen. In browsers kan bij lange discussies een verticale schuifbalk verschijnen.

Pas dit dus naar wens aan.

Bijdragen aan deze gids