FastComments.com

Menu Icon

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

Arka Plan

SSR nedir?
SSR'nin Faydaları
FastComments SSR Desteklenen Özellikler

SSR Kullanımı

Kullanım Senaryoları
FastComments'ın SSR Kullanım Alanları
SSR Kullanımı

SSR (Sunucu Tarafı Renderlama)

SSR nedir? Internal Link

SSR, veya Sunucu Tarafı Oluşturma, bir uygulama veya içeriğin sunucu tarafından oluşturulup istemci tarafından çok az işlemle görüntülendiği bir mekanizma ve konvansiyonlar kümesidir.

SSR ile, istemci JavaScript çalıştırmaz. Bunun yerine, istemci sunucu tarafından "oluşturulan" HTML/CSS'i görüntüler.

SSR'nin Faydaları Internal Link

SSR'in en büyük faydalarından biri JavaScript'in gerekli olmamasıdır. Bu nedenle, birçok kullanım durumunda uygulamalar daha "hafif" hissettirecek şekilde oluşturulabilir.

Ek olarak, kullanıcı JavaScript'i devre dışı bırakmışsa SSR bir yedek olarak kullanılabilir. Bu şekilde yorum dizileri yine de görüntülenebilir ve kullanıcı hala yorumlara cevap verebilir.

FastComments zaten iyi optimize edilmiştir, bu yüzden çoğu durumda SSR gerekli değildir. Ancak bazı çevrimiçi topluluklarda JavaScript kullanmayan kullanıcılar bulunmaktadır veya onu devre dışı bırakmak tercih edilen uygulamadır. İşte FastComments SSR'nin yararlı olabileceği durum burasıdır.

Ancak SSR'nin önemli bir dezavantajı, küçük durum değişiklikleri için sayfanın yeniden yüklenmesi zorunluluğudur.

FastComments SSR Desteklenen Özellikler Internal Link

FastComments, SSR ile aşağıdaki özellikleri destekler:

  • Özelleştirilebilir yorum widget'ı.
  • Anonim yorumlama.
  • Oturum açmışken yorumlama.
  • SSO.
  • Ana ve iç içe yanıtlar.
  • Yorum dizilerini görüntüleme ve sayfalama.
  • Oy verme, anonim oy vermeyi de içerir.
  • Varsayılan sıralama yönünü değiştirme.

Bir Örnek

FastComments SSR örneği burada mevcuttur.

FastComments SSR
External Link
Sunucu tarafı oluşturulmuş yorum dizisi, iç içe yanıtlar, oy butonları ve SSR örnek sayfasındaki yorum kutusu

Kullanım Senaryoları Internal Link

SSR için örnek kullanım durumları aşağıdaki gibidir:

  • JavaScript devre dışı bırakıldığında bir yedek.
  • JavaScript'in mevcut olmadığı veya istenmediği bir ortamda bir yorum arayüzünü render etmek için.
  • Daha fazla JavaScript eklenmesinin istenmediği siteler veya çevrimiçi topluluklar için.

FastComments'ın SSR Kullanım Alanları Internal Link

FastComments aşağıdaki yerlerde SSR kullanır:

  • WordPress eklentimiz varsayılan olarak bir yedek olarak SSR kullanır. JavaScript devre dışıysa, kullanıcılar yine de blogunuza yorum bırakabilir.
  • Kendi blogumuzda da bir yedek olarak kullanıyoruz! https://blog.fastcomments.com

SSR Kullanımı Internal Link

FastComments SSR'yi kullanmak için istemci, https://fastcomments.com/ssr/comments uç noktasından HTML alabilir.

Bu birkaç farklı şekilde yapılabilir.

WordPress ile

WordPress eklentisinde 3.10.2 sürümünden itibaren, JS'siz kullanıcılar için SSR varsayılan olarak yedek mekanizma (fallback) olarak etkindir.

Bir Web Sayfasında

Mevcut bir uygulama ile SSR, kullanılan dilin PHP olduğu varsayımıyla aşağıdaki örnekle eklenebilir:

PHP Tabanlı SSR Örneği
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

Ayrıca SSR arayüzünü yalnızca kullanıcının JS'i devre dışı olduğunda gösterebiliriz:

PHP Tabanlı SSR Yedek Örneği
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

SSO kullanan bir örnek için buraya bakın.

Ön İşlenmiş (Pre-Rendered) İçerikle

Blogumuz derleme zamanında oluşturulur ve Handlebars ile SSR'nin iyi bir örneğini sunar.

Temel Parametreler

Geçmeniz gereken temel parametreler şunlardır:

  • tenantId - Sizi müşteri olarak tanımlar.
  • urlId - Yorumların yükleneceği sayfayı veya makaleyi tanımlar ve nereye kaydedileceklerini belirler.
  • url - Bildirimler ve ilgili özellikler tarafından yorum dizisine geri bağlantı vermek için kullanılır.

Özel Stil

Yorum bileşeninin SSR sürümü, JavaScript sürümüyle aynı yapıyı ve işleme motorunu kullanır.

Bu nedenle, JavaScript yorumlama bileşeni için çalışan tüm özel stiller SSR için de çalışır.

Notlar

SSR ile birlikte, işlenen konteynerin yüksekliğini kontrol edecek bir JavaScript bulunmaz. Tarayıcılarda, uzun tartışmalar için dikey bir kaydırma çubuğu görünebilir.

Bu nedenle, bunu istediğiniz gibi ayarlamanız gerekir.

Bu rehbere katkıda bulunun