Fri Jan 21 2022
...
FastComments Releases Server-Side Rendering
! Cet Article Contient du Jargon Technique
Quoi de Neuf
Depuis son lancement début 2020, FastComments a exclusivement utilisé JavaScript pour rendre le widget de commentaires.
Que diriez-vous si nous vous disions que vous pouvez avoir presque toutes les mêmes fonctionnalités essentielles, mais sans utiliser JS ?
La capture d'écran ci-dessus affiche le widget de commentaires FastComments, sans JavaScript. Vous pouvez voir cette page, sans JavaScript, ici.
Comment l'Utiliser
Si vous utilisez WordPress, la version 3.10.1 du plugin FastComments ajoute automatiquement le support pour SSR comme solution de secours pour vos utilisateurs qui naviguent avec JS désactivé.
Pour des implémentations personnalisées, récupérez l'interface utilisateur pour un fil de commentaires, il suffit d'appeler le /ssr/comments pour cette page :
Où $urlId est l'url, ou l'identifiant, de la page. La documentation à ce sujet est ici.
Par exemple, avec PHP, nous pouvons envoyer un iframe à la page qui rend le fil de commentaires à l'intérieur :
Nous pourrions également faire un appel API pour obtenir le HTML pour un fil de commentaires, et le rendre, ou le stocker.
La documentation complète est disponible dans les Docs SSR à docs.fastcomments.com.
SSO
Parce que nous aimons les acronymes qui font sérieux, ne vous inquiétez pas, le SSR supporte le SSO. Un exemple de Single-Sign-On avec SSR est ici.
Localisation
Le point de terminaison basé sur SSR localise automatiquement la réponse en fonction des en-têtes de langue que le navigateur envoie. Il peut également utiliser les mêmes substitutions de localisation que le widget basé sur JavaScript.
Pourquoi Cela a Été Construit
Une des principales plaintes concernant des services comme FastComments est qu'ils nécessitent JS. Nous faisons déjà en sorte que notre widget de commentaires soit aussi léger que possible, et nous veillons à respecter nos SLA d'appels API de < 20ms, mais de nombreuses petites communautés n'adopteront pas une telle solution si cela signifie ajouter du JS à leur site.
Cela ouvre également la possibilité d'utiliser des moteurs de rendu qui n'ont pas accès à JavaScript.
La Technologie
FastComments utilise son propre petit microframework pour rendre l'interface utilisateur. Ce cadre utilise une approche similaire à React, sauf que les manipulations du DOM manuelles en dehors du rendu initial sont autorisées.
La bibliothèque principale du widget de commentaires a un seul point d'entrée - elle prend un ensemble d'états et crée le HTML et le CSS résultants à rendre. Nous appelons simplement cela sur le serveur aussi. Lorsque l'utilisateur interagit avec la page, l'état change et le dernier HTML est récupéré. Ceci a été construit à la suite d'un hackathon qui a eu lieu dans le cadre du nouvel an.
Commentaires en Direct
Étant donné que l'interface utilisateur est rendue par le serveur, une seule fois, les fonctionnalités de commentaires en direct ne sont pas disponibles.
De plus, la cloche de notifications n'est actuellement pas disponible. Nous serons ouverts à l'ajout de cette fonctionnalité à l'avenir.
Performance
L'interface utilisateur rendue côté serveur utilise les mêmes optimisations de stockage et moteur de rendu que le widget basé sur JavaScript. Pour de petits fils de commentaires, la performance est en réalité meilleure, car l'utilisateur n'a pas besoin de télécharger un script qui récupère ensuite les commentaires et rend l'interface utilisateur.
Explorateurs et SEO
FastComments fonctionne déjà bien avec les explorateurs web ; si le SEO est une préoccupation, utiliser le SSR n'est pas nécessaire.
Applications Futures
Nous prévoyons de lancer une solution de Forum à l'avenir. Traditionnellement, les forums sont paginés et rendus côté serveur. Les solutions de forum modernes s'éloignent de cette norme en utilisant le défilement infini et le rendu côté client. Nous ne pensons pas que cela doive être la seule option pour utiliser une solution de Forum tiers.
En Conclusion
Nous espérons que vous avez trouvé ce guide utile et facile à lire. N'hésitez pas à commenter ci-dessous si vous avez des questions.
Cordialement !