SXG, bir kaynağın kaynağının, nasıl yayınlandığından bağımsız olarak kimlik doğrulamasını sağlayan bir yayınlama mekanizmasıdır.
İmzalı exchange'ler (SXG), bir kaynağın kaynağının nasıl yayınlandığından bağımsız olarak kimlik doğrulamasını sağlayan bir yayınlama mekanizmasıdır. SXG'yi uygulamak, gizliliği koruyan kaynak dışı önceden getirme özelliğini etkinleştirerek Largest Contentful Paint'i (LCP) iyileştirebilir. Ayrıca bu ayrıştırma, çevrimdışı internet deneyimleri ve üçüncü taraf önbelleklerinden içerik yayınlama gibi çeşitli kullanım alanlarını geliştirir.
Bu makalede, SXG'ye (işleyiş şekli, kullanım alanları ve araçlar) kapsamlı bir genel bakış sunulmaktadır.
Tarayıcı uyumluluğu
SXG, Chromium tabanlı tarayıcılar tarafından desteklenir (Chrome 73, Edge 79 ve Opera 64 sürümlerinden itibaren).
Genel Bakış
SXG, birincil kullanım alanı olarak kaynak tarafından kriptografik olarak imzalanmış içeriği önceden getirmek ve yayınlamak için bir önbelleğe sahiptir. Bu, yönlendiren sitelerden kaynak arası gezinme işlemlerini hızlandırmaya yardımcı olurken sayfaların değiştirilmemesini ve kaynaklarıyla doğru şekilde ilişkilendirilmesini sağlar. Kimliği tanımlayabilecek tüm bilgiler, kullanıcı bir siteye gidene kadar gizlenir. Böylece kullanıcının gizliliği korunur. Google Arama, SXG önceden getirme özelliklerini erken benimseyen bir platformdur. Trafiğinin büyük bir kısmını Google Arama'dan alan siteler için SXG, kullanıcılara daha hızlı sayfa yüklemeleri sunmak açısından önemli bir araç olabilir. Bu etkiyi zaman içinde daha fazla yönlendiren için sunmayı umuyoruz.
İşleyiş Şekli
Site, bir istek/yanıt çiftini ("HTTP takası") tarayıcının içeriğin dağıtılma şeklinden bağımsız olarak içeriğin kaynağını ve bütünlüğünü doğrulamasını sağlayacak şekilde imzalar. Sonuç olarak tarayıcı, içeriği yayınlayan sunucunun URL'si yerine adres çubuğunda kaynak sitenin URL'sini gösterebilir.
Geçmişte, bir sitenin ilişkilendirmeyi korurken içeriğini dağıtmak için üçüncü taraf kullanmasının tek yolu, SSL sertifikalarını distribütörle paylaşmasıydı. Bunun güvenlikle ilgili sakıncaları vardır. Ayrıca, içeriği gerçekten taşınabilir hale getirmek için çok daha fazlası gerekir.
SXG biçimi
SXG, iki temel bileşene sahip bir ikili kodlu dosyada kapsüllenir: HTTP değişimi ve değişimi kapsayan bir imza. HTTP değişimi, istek URL'sinden, içerik pazarlığı bilgilerinden ve bir HTTP yanıtından oluşur.
format version: 1b3
request:
method: GET
uri: https://example.org/
headers:
response:
status: 200
headers:
Cache-Control: max-age=604800
Digest: mi-sha256-03=kcwVP6aOwYmA/j9JbUU0GbuiZdnjaBVB/1ag6miNUMY=
Expires: Mon, 24 Aug 2020 16:08:24 GMT
Content-Type: text/html; charset=UTF-8
Content-Encoding: mi-sha256-03
Date: Mon, 17 Aug 2020 16:08:24 GMT
Vary: Accept-Encoding
signature:
label;cert-sha256=<em>ViFgi0WfQ+NotPJf8PBo2T5dEuZ13NdZefPybXq/HhE=</em>;
cert-url="https://test.web.app/ViFgi0WfQ-NotPJf8PBo2T5dEuZ13NdZefPybXq_HhE";
date=1597680503;expires=1598285303;integrity="digest/mi-sha256-03";sig=<em>MEUCIQD5VqojZ1ujXXQaBt1CPKgJxuJTvFlIGLgkyNkC6d7LdAIgQUQ8lC4eaoxBjcVNKLrbS9kRMoCHKG67MweqNXy6wJg=</em>;
validity-url="https://example.org/webpkg/validity"
header integrity: sha256-Gl9bFHnNvHppKsv+bFEZwlYbbJ4vyf4MnaMMvTitTGQ=</p>
<p>The exchange has a valid signature.
payload [1256 bytes]:</p>
<pre class="prettyprint"><code><title>SXG example</title>
<meta charset="utf-8">
<meta http-equiv="Content-type" content="text/html; charset=utf-8">
<style type="text/css">
body {
background-color: #f0f0f2;
margin: 0;
padding: 0;
}
</style>
</code></pre>
<div>
<h1>Hello</h1>
</div>
<p>
İmzadaki expires parametresi, SXG'nin geçerlilik bitiş tarihini belirtir. SXG en fazla 7 gün boyunca geçerli olabilir. İmza üstbilgisi hakkında daha fazla bilgiyi İmzalanmış HTTP Takasları spesifikasyonunda bulabilirsiniz.
Sunucu tarafı kişiselleştirme desteği
Vary: Cookie üstbilgisi içeren bir SXG yalnızca imzalı istek URL'si için çerezleri olmayan kullanıcılara gösterilir. Siteniz, giriş yapmış kullanıcılarına farklı HTML sunuyorsa bu deneyimi değiştirmeden SXG'lerden yararlanmak için bu özelliği kullanabilirsiniz. Dinamik SXG ile sunucu tarafı kişiselleştirme hakkında ayrıntılı bilgi edinin.
Web paketleme
SXG, daha geniş kapsamlı Web Paketleme özellik teklifi ailesinin bir parçasıdır. SXG'lere ek olarak, Web Paketleme spesifikasyonunun diğer önemli bileşeni Web Paketleri ("paketlenmiş HTTP takasları")dir. Web paketleri, HTTP kaynaklarının ve paketi yorumlamak için gerekli meta verilerin bir koleksiyonudur.
SXG'ler ile web paketleri arasındaki ilişki, sıklıkla karıştırılan bir konudur. SXG ve web paketleri birbirine bağlı olmayan iki farklı teknolojidir. Web paketleri hem imzalı hem de imzasız borsalarla kullanılabilir. Hem SXG'lerin hem de web paketlerinin ortak hedefi, sitelerin çevrimdışı tüketim için tamamıyla paylaşılmasına olanak tanıyan bir "web paketleme" biçimi oluşturmaktır.
İmzalı Takaslarla Sayfa Yüklemelerini Hızlandırma
İmzalı Değişimler'i etkinleştirmek, web sayfası performansını hızlandırabilir ve böylece sitenizin Önemli Web Verileri'ni, özellikle de Largest Contentful Paint (LCP)'yi etkileyebilir. SXG'yi erken benimseyen Google Arama, kullanıcılara arama sonuçları sayfasından yüklenen sayfalar için daha hızlı bir sayfa yükleme deneyimi sunmak amacıyla SXG'yi kullanır.
Google Arama, mevcut olduğunda SXG'leri tarar ve önbelleğe alır ve kullanıcının ziyaret etmesi muhtemel SXG'leri (ör. ilk arama sonucuna karşılık gelen sayfa) önceden getirir.
SXG, CDN kullanımı ve oluşturmayı engelleyen alt kaynakların azaltılması gibi diğer performans optimizasyonlarıyla birlikte kullanıldığında en iyi performansı gösterir. Uygulamadan sonra, SXG'leri önceden getirmenin LCP avantajını en üst düzeye çıkarmak için bu önerileri uygulayın. Bu tür optimizasyonlar birçok durumda Google Arama'dan gelen sayfaların neredeyse anında yüklenmesine neden olabilir:
İmzalı Takasların Etkisi
Geçmiş denemelerde, SXG özellikli ön getirme işlemlerinin LCP'de ortalama 300 ila 400 ms düşüş sağladığını gözlemledik. Bu, sitelerin kullanıcılarda daha iyi bir ilk izlenim bırakmasına yardımcı olur ve genellikle işletme metriklerini olumlu yönde etkiler.
Birkaç global marka ve site, imzalanan exchange'lerden yararlanmaya başladı. Örnek olay olarak, imzalanan exchange'lerin uygulanmasının tanınmış bir İçerik Yönetim Sistemi (İYS) olan RebelMouse'un müşterilerinin performansını ve işletme metriklerini iyileştirmesine nasıl yardımcı olduğunu inceleyelim:
- Narcity LCP'yi%41 artırdı
- Paper Magazine, kullanıcı başına oturum sayısında% 27 artış elde etti
- MLT Blog sayfa yükleme süresini%21 azalttı
Cloudflare, SXG'nin test ettiği sitelerin % 98'inde TTFB'yi iyileştirdiği ve sitelerin% 85'inde LCP'yi iyileştirdiği, SXG'ye uygun sayfa yüklemelerinde ortalama% 20'nin üzerinde bir iyileşme sağladığını tespit etti.
Dizine ekleme
Bir sayfanın SXG ve SXG olmayan temsilleri Google Arama tarafından farklı şekilde sıralanmaz veya dizine eklenmez. SXG temelde bir yayınlama mekanizmasıdır ve temel içeriği değiştirmez.
AMP
AMP içeriği SXG kullanılarak yayınlanabilir. SXG, AMP içeriğinin AMP URL'si yerine standart URL'si kullanılarak önceden getirilmesine ve görüntülenmesine olanak tanır.AMP'nin, SXG oluşturmak için ayrı araçları vardır.İmzalı takasları kullanarak AMP'yi nasıl yayınlayacağınızı amp.dev adresinden öğrenebilirsiniz.
Chrome Geliştirici Araçları ile SXG'lerde hata ayıklama
SXG'yi ilk elden görmek için bir Chromium tarayıcı kullanın, Geliştirici Araçları'nı ve Ağ panelini açın ve bu örnek arama sayfasını ziyaret edin. İmzalı Exchange'ler, Tür sütununda signed-exchange aranarak tanımlanabilir.
Önizleme sekmesi, SXG'nin içeriği hakkında daha fazla bilgi sağlar.
Araç
SXG'leri uygulamak, belirli bir URL'ye karşılık gelen SXG'yi oluşturmayı ve ardından bu SXG'yi istek sahiplerine (genellikle tarayıcılar) sunmayı içerir.
Sertifikalar
SXG oluşturmak için SXG'leri imzalayabilecek bir sertifikaya ihtiyacınız vardır. Bazı araçlar bu sertifikaları otomatik olarak edinir. Bu sayfada bu tür sertifika yayınlayabilen sertifika yetkilileri listelenir. Sertifikalar, herhangi bir ACME istemcisi kullanılarak Google sertifika yetkilisinden otomatik olarak alınabilir. Web Packager Server'da yerleşik bir ACME istemcisi bulunur. sxg-rs'de de yakında bu özellik eklenecektir.
Platforma özgü SXG araçları
Bu araçlar belirli teknoloji gruplarını destekler. Bu araçlardan biri tarafından desteklenen bir platform kullanıyorsanız bu aracın kurulumunu, genel amaçlı bir aracın kurulumundan daha kolay bulabilirsiniz.
sxg-rs/cloudflare_worker, Cloudflare Workers üzerinde çalışır.sxg-rs/fastly_compute, Fastly Compute@Edge üzerinde çalışır.Otomatik İmzalı Değişimler, sertifikaları otomatik olarak edinen ve İmzalı Değişimler oluşturan bir Cloudflare özelliğidir.
NGINX SXG modülü, nginx kullanan siteler için SXG'ler oluşturur ve sunar. Kurulum talimatlarını burada bulabilirsiniz.
Envoy SXG Filtresi, Envoy kullanan siteler için SXG'ler oluşturur ve sunar.
Genel amaçlı SXG araçları
sxg-rs HTTP sunucusu
sxg-rshttp_server, SXG'lerin sunulması için geri proxy görevi görür. SXG tarayıcılarından gelen istekler için http_server, arka uçtan gelen yanıtları imzalar ve SXG ile yanıt verir. Yükleme talimatları için README dosyasını inceleyin.
Web Paketleyici Sunucusu
webpkgserver adlı Web Paketleyici sunucusu, Go dilinde yazılmış sxg-rs http_server'a bir alternatiftir. Web Paketleyici sunucusunu ayarlamayla ilgili talimatlar için Web Paketleyici'yi kullanarak imzalı takasları ayarlama başlıklı makaleye göz atın.
Web Paketleyici CLI
Web Paketleyici CLI, belirli bir URL'ye karşılık gelen bir SXG oluşturur.
webpackager \
--private\_key=private.key \
--cert\_url=https://example.com/certificate.cbor \
--url=https://example.com
SXG dosyası oluşturulduktan sonra dosyayı sunucunuza yükleyin ve application/signed-exchange;v=b3 MIME türüyle sunun. Ayrıca SXG sertifikasını application/cert-chain+cbor olarak yayınlamanız gerekir.
SXG kitaplıkları
Aşağıdaki kitaplıklardan yararlanarak kendi SXG oluşturucunuzu oluşturabilirsiniz:
sxg_rs, SXG oluşturmak için kullanılan bir Rust kitaplığıdır. En çok özellikli SXG kitaplığıdır vecloudflare_workerilefastly_computearaçlarının temeli olarak kullanılır.libsxg, SXG oluşturmak için kullanılan minimum düzeyde bir C kitaplığıdır. NGINX SXG modülü ve Envoy SXG filtresi için temel olarak kullanılır.go/signed-exchange, webpackage spesifikasyonu tarafından SXG oluşturmanın referans uygulaması olarak sağlanan minimum bir Go kitaplığıdır. Referans CLI aracının ve daha fazla özellikli Web Paketleyici araçlarının temeli olarak kullanılır.gen-signedexchange
İçerik pazarlığı
Kabul üstbilgisi, application/signed-exchange için q değerinin text/html için q değerinden büyük veya bu değere eşit olduğunu belirttiğinde sunucular SXG yayınlamalıdır. Pratikte bu, bir kaynak sunucunun SXG'yi tarayıcılara değil, tarayıcılara yayınlayacağı anlamına gelir. Yukarıdaki araçların çoğu bunu varsayılan olarak yapar ancak diğer araçlarda, SXG olarak yayınlanması gereken isteklerin Accept başlığını eşleştirmek için aşağıdaki normal ifade kullanılabilir:
http
Accept: /(^|,)\s\*application\/signed-exchange\s\*;\s\*v=[[:alnum:]\_-]+\s\*(,|$)/
Bu öneri, Apache ve nginx örnekleri içerir.
Update cache API
Google SXG Önbelleği'nde, site sahiplerinin SXG'leri Cache-Control: max-age nedeniyle geçerlilik süreleri dolmadan önce önbellekten kaldırmak için kullanabileceği bir API vardır. Ayrıntılar için update cache API referansına bakın.
SXG'ye bağlama
Herhangi bir site, ve etiketlerini kullanarak bağlantı verdiği sayfaların SXG'lerini (varsa) önbelleğe alabilir, yayınlayabilir ve önceden getirebilir:
html
<a href="https://example.com/article.html.sxg">
<link rel="prefetch" as="document" href="https://example.com/article.html.sxg">
Bu makalede, SXG'leri dağıtmak için nginx'in nasıl kullanılacağı gösterilmektedir.
Benzersiz Avantajlar
SXG, kaynaktan bağımsız önceden getirmeyi etkinleştirebilecek birçok teknolojiden biridir. Hangi teknolojiyi kullanacağınıza karar verirken farklı yönleri optimize etmek arasında bir seçim yapmanız gerekebilir. Aşağıdaki bölümlerde, SXG'nin olası çözümler alanında sunduğu benzersiz değerlerden birkaçı gösterilmektedir. Bu faktörler, mevcut çözümlerin kapsamı değiştikçe zaman içinde değişebilir.
Yayınlanacak daha az istek
Siteler arası ön getirme özelliğinde sunucunuzun ek istek yayınlaması gerekebilir. Bu durum, bir sayfanın önceden getirildiği ancak kullanıcının sayfayı ziyaret etmediği veya önceden getirilen baytların kullanıcıya gösterilemediği durumlara karşılık gelir. SXG için bu kullanılmayan ek istekler önemli ölçüde azaltılabilir:
- SXG'ler önbelleğe alınır ve geçerlilik süreleri dolana kadar kullanıcılara gönderilebilir. Bu nedenle, birçok ön getirme işlemi yalnızca önbelleğe alma sunucusu tarafından işlenebilir.
- SXG'ler, sitenizde çerezleri olan ve olmayan kullanıcılara gösterilebilir. Bu nedenle, gezinme işleminden sonra sayfanın yeniden getirilmesi gerekmez.
Sayfa hızında iyileştirme
Şu anda desteklediği ön getirme yüzeyleri ve özellikleri nedeniyle ek sayfa hızı iyileştirmeleri görebilirsiniz:
- SXG'ler, siteniz için çerezleri olan kullanıcılara gösterilebilir.
- SXG,
Linkbaşlığı kullanılarak belirtildiğinde sayfalarınız için JavaScript, CSS, yazı tipleri ve resimler gibi alt kaynakları da önceden yükler. - Google Arama'dan SXG önceden getirme özelliği yakın gelecekte daha fazla arama sonucu türünde kullanılabilecek.
Sonuç
İmzalı Exchange'ler, bir kaynağın kaynağını ve geçerliliğini kaynağın nasıl yayınlandığından bağımsız olarak doğrulamayı sağlayan bir yayınlama mekanizmasıdır. Sonuç olarak SXG'ler, tam yayıncı ilişkilendirmesini korurken üçüncü taraflar tarafından dağıtılabilir.