Fri Jan 21 2022
...

FastComments veröffentlicht serverseitiges Rendering

! Dieser Artikel enthält technische Fachbegriffe

Was gibt's Neues

Seit dem Start Anfang 2020 hat FastComments ausschließlich JavaScript verwendet, um das Kommentarsystem darzustellen.

Was wäre, wenn wir Ihnen sagen würden, dass Sie fast alle gleichen grundlegenden Funktionen haben könnten, aber ohne JS?

Das ist ein Screenshot, versuchen Sie nicht, darauf zu klicken.

Der obige Screenshot zeigt das FastComments-Kommentarsystem ohne JavaScript. Sie können diese Seite hier ohne JavaScript anzeigen.

So verwenden Sie es

Wenn Sie WordPress verwenden, fügt das FastComments-Plugin Version 3.10.1 automatisch Unterstützung für SSR als Rückfalloption für Benutzer hinzu, die mit deaktiviertem JS surfen.

Für benutzerdefinierte Implementierungen holen Sie die Benutzeroberfläche für einen Kommentar-Thread, indem Sie einfach /ssr/comments für diese Seite aufrufen:

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

Wobei $urlId die URL oder die ID der Seite ist. Dokumentation dazu finden Sie hier.

Zum Beispiel können wir mit PHP ein iframe an die Seite senden, das den Kommentar-Thread darin rendert:

PHP-basiertes SSR-Beispiel
<?php
$tenantId = rawurlencode("my-tenant-id");
$urlId = rawurlencode("my-page-url-article-id");
$url = rawurlencode("my-page-url");
$fastcomments_url = "https://fastcomments.com/ssr/comments?tenantId=$tenantId&urlId=$urlId&url=$url";
?>
<iframe
    src="<?php echo $fastcomments_url; ?>"
    horizontalscrolling="no"
    allowtransparency="true"
    frameborder="0"
    title="FastComments"
    width="100%"
    height="1500px"
    style= "width: 1px !important; min-width: 100% !important; border: none !important; overflow: hidden !important;"
></iframe>

Wir könnten auch einen API-Aufruf machen, um das HTML für einen Kommentar-Thread zu erhalten und es darzustellen oder zu speichern.

Vollständige Dokumentation ist in den SSR-Dokumenten unter docs.fastcomments.com verfügbar.

SSO

Weil wir Akronyme mögen, die nach Unternehmen klingen, keine Sorge, SSR unterstützt SSO. Ein Beispiel für Single-Sign-On mit SSR finden Sie hier.

Lokalisierung

Der SSR-basierte Endpunkt lokalisiert automatisch die Antwort basierend auf den sprachbezogenen Headern, die der Browser sendet. Er kann auch die gleichen Lokalisierungsüberschreibungen verwenden wie das auf JavaScript basierende Widget.

Warum wurde das gebaut

Eine der häufigsten Beschwerden über Dienste wie FastComments ist, dass sie JS erfordern. Wir machen unser Kommentarsystem so schlank wie möglich und stellen sicher, dass wir unsere API-Aufruf-SLAs von < 20ms einhalten, aber viele kleinere Gemeinschaften werden eine solche Lösung nicht wählen, wenn es bedeutet, dass sie JS zu ihrer Seite hinzufügen müssen.

Das eröffnet auch die Möglichkeit, Rendering-Engines zu verwenden, die keinen Zugriff auf JavaScript haben.

Die Technologie

FastComments verwendet ein eigenes kleines Mikroframework für das Rendering der UI. Dieses Framework verwendet einen ähnlichen Ansatz wie React, mit der Ausnahme, dass manuelle DOM-Manipulationen außerhalb des ursprünglichen Renderings erlaubt sind.

Die Kernbibliothek des Kommentarsystems hat einen einzigen Einstiegspunkt - sie nimmt einen Satz von Zuständen und erstellt das resultierende HTML und CSS zum Rendern. Wir rufen dies einfach auch auf dem Server auf. Wenn der Benutzer mit der Seite interagiert, ändert sich der Zustand und das neueste HTML wird abgerufen. Dies wurde als Ergebnis eines Hackathons gebaut, der im Rahmen des neuen Jahres stattfand.

Live-Kommentare

Da die UI vom Server einmalig gerendert wird, sind Live-Kommentarfunktionen nicht verfügbar.

Zusätzlich ist die Benachrichtigungsglocke derzeit nicht verfügbar. Wir sind offen für die Hinzufügung dieser Funktion in der Zukunft.

Leistung

Die servergerenderte UI nutzt die gleichen Speicheroptimierungen und Rendering-Engines wie das auf JavaScript basierende Widget. Bei kleinen Kommentar-Threads ist die Leistung tatsächlich besser, da der Benutzer kein Skript herunterladen muss, das dann die Kommentare abruft und die UI rendert.

Crawler und SEO

FastComments funktioniert bereits gut mit Web-Crawlern; wenn SEO ein Anliegen ist, ist die Verwendung von SSR nicht erforderlich.

Zukünftige Anwendungen

Wir planen, in Zukunft eine Forum-Lösung einzuführen. Traditionell sind Foren paginiert und serverseitig gerendert. Moderne Forum-Lösungen weichen von dieser Norm ab, indem sie unendliches Scrollen und clientseitiges Rendering verwenden. Wir denken nicht, dass dies die einzige Option sein muss, um eine Drittanbieter-Forum-Lösung zu verwenden.

Fazit

Wir hoffen, dass Sie diesen Leitfaden hilfreich und leicht verständlich fanden. Fühlen Sie sich frei, unten mit Fragen zu kommentieren.

Prost!

Fri Jan 21 2022...