FastComments.com Blog

[קטגוריה:מאפיינים] [קטגוריה:ממשקי API ופיתוח]

[תאריך פרסום]

[קישור לפוסט]FastComments משחררת רינדור בצד השרת[/קישור לפוסט]

! מאמר זה מכיל בז'רגון טכני

מה חדש

מיום ההשקה בתחילת 2020, FastComments השתמשה אך ורק ב-JavaScript כדי להציג את ווידג'ט התגובות.

מה אם נגיד לך שאתה יכול לקבל כמעט את כל הפונקציות הבסיסיות, אך ללא שימוש ב-JS?

זה צילום מסך, אל תנסה ללחוץ עליו.
SSR Demo

צילום המסך למעלה הוא ווידג'ט התגובות של FastComments, ללא JavaScript. אתה יכול לצפות בעמוד הזה, ללא JavaScript, כאן.

איך להשתמש בזה

אם אתה משתמש ב-WordPress, גרסת פלאגין FastComments 3.10.1 מוסיפה אוטומטית תמיכה לרינדור בצד השרת כפתרון לגולשים שלך שמבקרים עם JS מכובה.

להטמעה מותאמת, קח את ממשק המשתמש של שורת התגובות, פשוט קרא ל-/ssr/comments עבור העמוד הזה:

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

כאשר $urlId הוא ה-url, או מזהה, של העמוד. תיעוד על כך נמצא כאן.

לדוגמה, עם 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 שלנו של < 20ms, אבל הרבה קהילות קטנות לא יסכימו לבחור בפתרון כזה אם זה אומר להוסיף JS לאתר שלהם.

זה גם פותח את ההזדמנות להשתמש במנועי רינדור שאין להם גישה ל-JavaScript.

הטכנולוגיה

FastComments משתמשת במסגרת מיקרו קטנה משלה כדי לרנדר את ממשק המשתמש. מסגרת זו משתמשת בגישה דומה ל-React, חוץ מזה שמניפולציות DOM ידניות מחוץ לרינדור הראשוני מותרים.

לספריית ווידג'ט התגובות הליבה יש נקודת כניסה אחת - היא לוקחת קבוצת מצב ויוצרת HTML ו-CSS תוצאה להיות מנותבים. אנו פשוט קוראים לזה מהשרת גם. כשמשתמש אינטראקציה עם העמוד, המצב משתנה וה-HTML החדש נטען. זה נבנה כתוצאה מהאקתון שהתרחש כחלק מהשנה החדשה.

תגובות חיות

מכיוון שה-UI מוכן על ידי השרת, פעם אחת, תכונות תגובות חיות אינן זמינות.

בנוסף, פעמון ההודעות אינו זמין כרגע. אנחנו פתוחים להוסיף את התכונה הזו בעתיד.

ביצועים

ממשק המשתמש המוכן על ידי השרת משתמש באותן אופטימיזציות אחסון ומנוע רינדור כמו הווידג'ט המבוסס על JavaScript. עבור שורות תגובות קטנות, הביצועים הם למעשה טובים יותר, מכיוון שהמשתמש אינו צריך להוריד סקריפט שאחריו שולף את התגובות ומציג את הממשק.

סורקים ו-SEO

FastComments כבר עובד טוב עם סורקי אינטרנט; אם SEO הוא דאגה, השימוש ב-SSR אינו דרוש.

יישומים עתידיים

אנחנו מתכננים להשיק פתרון פורום בעתיד. מסורתית, פורומים הם מעמודים, ומיוצרים בצד השרת. פתרונות פורום מודרניים מתרחקים מהנורמה הזאת על ידי שימוש בגלילה אינסופית ורינדור בצד הלקוח. אנחנו לא חושבים שזה חייב להיות האפשרות היחידה לשימוש בפתרון פורום של צד שלישי.

לסיכום

אנחנו מקווים שמצאתם את המדריך הזה מועיל וקל לקריאה. אל תהססו להגיב למטה עם שאלות כלשהן.

תהנו!