Preload, Prefetch ve Preconnect Arasındaki Fark Nedir?
Preload mevcut sayfa için kritik kaynakları, prefetch gelecekteki sayfa gezinmeleri için varlıkları yükler. Preconnect ise dış sunucularla ağ bağlantısını erken kurar.
İÇİNDEKİLER
%0 okundu
- Kaynak İpuçları (Resource Hints) Nedir ve Neden Önemlidir?
- Preload: Mevcut Sayfa İçin Kritik Kaynakların Yönetimi
- Prefetch: Gelecekteki Sayfa Gezinmeleri İçin Stratejik Ön Yükleme
- Preconnect: Dış Sunucularla Erken Ağ Bağlantısı Kurmak
- Karşılaştırmalı Analiz: Preload, Prefetch ve Preconnect Farkları
- Kurumsal Web Siteleri İçin Kaynak İpucu Optimizasyon Stratejileri
Web projelerinde hız, doğrudan dönüşüm oranlarını ve arama motoru görünürlüğünü etkileyen kritik bir parametredir. Sayfa yükleme sürelerini optimize etmek isteyen teknik ekipler, tarayıcıların kaynak yükleme davranışlarına müdahale etmek için çeşitli tarayıcı ipuçlarından yararlanır. Bu rehber, Preload, Prefetch ve Preconnect Arasındaki Fark Nedir? sorusunun teknik yanıtını, bu üç mekanizmanın çalışma prensiplerini ve modern tarayıcıların kaynak önceliklendirme hiyerarşisini ele almaktadır. Doğru yapılandırılmamış kaynak ipuçları tarayıcıyı gereksiz iş yükü altına sokarken, doğru bir mimari tasarım sitenizin kullanıcı deneyimini ve performans metriklerini doğrudan yukarı taşır.
Kaynak İpuçları (Resource Hints) Nedir ve Neden Önemlidir?
Modern web tarayıcıları, bir web sayfasını oluştururken HTML belgesini yukarıdan aşağıya doğru doğrusal bir şekilde ayrıştırır (parsing). Bu işlem sırasında karşılaşılan CSS, JavaScript, görsel ve yazı tipi gibi varlıklar sırayla kuyruğa alınarak indirilir. Ancak tarayıcının yerleşik mekanizmaları, sayfanın görsel olarak tamamlanması için hangi kaynağın ne kadar acil olduğunu her zaman doğru tahmin edemeyebilir. İşte bu noktada W3C standartları tarafından tanımlanan "Kaynak İpuçları" (Resource Hints) devreye girer. Geliştiriciler, HTML kodunun <head> bölümüne ekledikleri özel etiketlerle tarayıcıya kaynakların yüklenme sırası, önceliği ve bağlantı gereksinimleri hakkında stratejik direktifler verirler.
Kaynak ipuçları, web sayfalarının kullanıcı ekranında ilk kez belirmesi ile tamamen etkileşimli hale gelmesi arasında geçen süreyi en aza indirmeyi hedefler. Tarayıcının yerleşik "Preload Scanner" (Ön Yükleme Tarayıcısı) altyapısı, ana HTML ayrıştırılmaya devam ederken arka planda kaynakları keşfetmeye çalışır. Ancak harici bir CSS dosyasının içinden çağrılan web yazı tipleri (web fonts) veya arka plan görselleri, tarayıcı tarafından ancak o CSS dosyası indirilip işlendikten sonra keşfedilebilir. Bu durum, kaynakların geç indirilmesine ve dolayısıyla sayfa tasarımında kaymalara ya da boş ekran sürelerinin uzamasına yol açar. Kaynak ipuçları kullanılarak bu keşif süreci manuel olarak erkene çekilir ve ağ kaynakları çok daha verimli kullanılır.
Ağ performans bütçesini doğru yönetmek, özellikle mobil cihaz kullanan ve sınırlı bant genişliğine sahip kullanıcılar için kritik bir gereksinimdir. Kaynak ipuçlarının stratejik kullanımı, gereksiz HTTP isteklerini ve gecikmelerini önleyerek sunucu üzerindeki yükü de optimize eder. Doğru yapılandırılmış bir ağ katmanı mimarisi, sunucu bağlantısı kurulması sırasında harcanan süreyi ve veri iletimindeki kayıpları azaltarak web sitenizin ölçeklenebilirliğine doğrudan katkı sunar.
Preload: Mevcut Sayfa İçin Kritik Kaynakların Yönetimi
Preload, mevcut sayfanın yüklenmesi ve görsel olarak oluşturulması için hemen ihtiyaç duyulan, ancak tarayıcının doğal akışta geç keşfedeceği kritik kaynakları erkene almak için kullanılan bildirimsel bir yükleme komutudur. Tarayıcıya "Bu kaynağı mevcut sayfa için yüksek bir öncelikle hemen indir, çünkü birazdan buna kesinlikle ihtiyacım olacak" talimatı verir. Preload komutu @@CODE0@@ sözdizimi ile tanımlanır. Burada kullanılan @@CODE1@@ niteliği, tarayıcının kaynağı doğru öncelik sırasına koyması, içerik güvenlik politikasını (CSP) uygulaması ve doğru HTTP başlıklarını göndermesi için zorunludur.
Preload Kullanımının Core Web Vitals Üzerindeki Etkisi
Preload mekanizmasının doğrudan etki ettiği en önemli performans metriği, Core Web Vitals kapsamında yer alan LCP (Largest Contentful Paint - En Büyük Zengin İçerikli Boyama) değeridir. Bir web sayfasının ilk ekranında (above-the-fold) yer alan devasa bir kahraman görseli (hero image) veya markaya ait özel bir yazı tipi, LCP skorunun ana belirleyicisidir. Bu kaynaklar genellikle harici stil dosyalarının içine gömülü olduğundan, tarayıcı CSS dosyasını indirip satır satır okumadan bu görselin veya fontun varlığından haberdar olamaz. İlgili LCP görseli preload edildiğinde, tarayıcı HTML'i okur okumaz görseli yüksek öncelikle indirmeye başlar ve sayfa oluşturma sürecinde görselin ekrana gelme süresi kritik seviyede kısalır.
Yazı tiplerinin preload edilmesi ise doğrudan CLS (Cumulative Layout Shift - Kümülatif Düzen Kayması) metriğini iyileştirir. Web fontları yüklenirken tarayıcılar genellikle ya metni font yüklenene kadar gizler (FOIT - Flash of Invisible Text) ya da geçici bir sistem fontu ile gösterip font yüklendiğinde değiştirir (FOUT - Flash of Unstyled Text). Bu geçiş anında sayfa düzeninde ani kaymalar meydana gelir. Font dosyalarının crossorigin niteliğiyle birlikte preload edilmesi, yazı tipinin sayfa ilk kez çizilmeden önce hazır olmasını sağlayarak bu kaymaları tamamen engeller veya en aza indirir.
Doğru Bilinen Yanlışlar: Aşırı Preload Kullanımının Riskleri
Geliştiricilerin düştüğü en büyük hata, sayfadaki tüm görselleri, script'leri ve font dosyalarını daha hızlı yükleneceği düşüncesiyle preload etmektir. Preload, tarayıcının varsayılan önceliklendirme kuyruğunu devre dışı bırakan sert bir emirdir. Eğer sayfadaki 15-20 farklı kaynağa preload tanımlanırsa, tarayıcı ağ bant genişliğini bu kaynakların tamamına bölüştürür. Sonuç olarak, sayfanın yüklenmesi için asıl kritik olan ana stil dosyaları ve JavaScript mimarisi (render-blocking/oluşturmayı engelleyen kaynaklar) gecikir. Bu durum, sitenin ilk boyama (First Paint) süresinin uzamasına neden olur.
Diğer bir kritik risk ise "iki kez yükleme" (double fetch) hatasıdır. Preload tanımlanırken @@CODE0@@ niteliğinin yanlış yazılması ya da font dosyalarında @@CODE1@@ parametresinin unutulması durumunda, tarayıcı preload edilen kaynakla sayfada kullanılan kaynağın aynı olduğunu anlayamaz. Bu hata, aynı dosyanın ağ üzerinden iki kez indirilmesine yol açarak hem kullanıcının veri kotasını tüketir hem de tarayıcıyı kilitler. Ayrıca, preload edilen bir kaynak sayfa yükleme sürecinin ilk birkaç saniyesinde kullanılmazsa, tarayıcı konsolunda performans kaybına işaret eden kırmızı uyarılar belirecektir.
Prefetch: Gelecekteki Sayfa Gezinmeleri İçin Stratejik Ön Yükleme
Prefetch, kullanıcının mevcut sayfadan sonra ziyaret etme olasılığı yüksek olan sonraki sayfaların kaynaklarını önceden indirmek için tasarlanmış, düşük öncelikli bir kaynak ipucudur. Preload'un aksine, prefetch mevcut sayfanın oluşturulma sürecini hızlandırmayı hedeflemez; tamamen bir sonraki sayfa geçişinin anlık (instant) hissedilmesini amaçlar. Tarayıcı, mevcut sayfanın yüklenmesi tamamlandıktan ve işlemci ile ağ kaynakları tamamen boşta (idle) kaldıktan sonra prefetch isteklerini yerine getirmeye başlar. <link rel="prefetch" href="/sonraki-sayfa-detay.js"> biçimindeki yapılandırmayla, hedef kaynak arka planda indirilerek tarayıcı önbelleğine (browser cache) yazılır.
Kullanıcı Deneyimini Artıran Prefetch Senaryoları
Prefetch mekanizmasının en başarılı uygulandığı alanların başında e-ticaret sitelerinin çok adımlı ödeme (checkout) süreçleri ve üyelik formları gelir. Kullanıcı sepet sayfasındayken, bir sonraki adım olan adres ve ödeme bilgilerinin yer aldığı sayfaya ait ağır JavaScript paketleri ve CSS dosyaları prefetch edilebilir. Kullanıcı "Alışverişi Tamamla" butonuna tıkladığı anda, bir sonraki sayfanın tüm yapı taşları halihazırda yerel önbellekte saklandığı için sayfa hiçbir ağ gecikmesi yaşanmadan anında yüklenir.
Ayrıca, modern Single Page Application (SPA) framework'leri (React, Next.js, Vue vb.) ve statik site oluşturucuları, kullanıcının ekranına gelen (viewport) bağlantıları analiz ederek otomatik prefetch uygular. Örneğin, bir blog listeleme sayfasında kullanıcı aşağı doğru kaydırdıkça, ekranda beliren makale linklerinin detay sayfaları arka planda otomatik olarak prefetch edilir. Bu sayede web sitesi, sanki tamamen yerel bir uygulama gibi kesintisiz ve ultra hızlı bir geçiş deneyimi sunar.
Bant Genişliği ve Veri Tüketimi Konusunda Kritik Uyarılar
Prefetch, spekülatif (tahmine dayalı) bir teknoloji olduğu için beraberinde ciddi veri israfı riskleri getirir. Kullanıcının tıklayacağı tahmin edilen 5 farklı bağlantının kaynakları indirildikten sonra, kullanıcı web sitesinden ayrılırsa bu verilerin tamamı boşa indirilmiş olur. Bu durum, özellikle mobil cihazlar üzerinden hücresel veri (3G/4G/5G) kullanan ve kotalı internet paketine sahip kullanıcılar için ciddi bir maliyet ve bant genişliği kaybı yaratır.
Bu olumsuz etkileri önlemek için teknik ekiplerin "Save-Data" (Veri Tasarrufu) HTTP başlığını denetlemesi gerekir. Kullanıcının cihazında veri tasarrufu modu aktifse, prefetch istekleri kod seviyesinde engellenmelidir. Ayrıca, veri gizliliği standartları (GDPR ve KVKK) bağlamında, kullanıcının henüz tıklamadığı bir üçüncü taraf bağlantısının prefetch edilmesi, kullanıcının IP adresi gibi verilerin rızası dışında harici sunucularla paylaşılmasına neden olabilir. Bu nedenle harici kaynaklar için prefetch planlanırken gizlilik politikaları göz önünde bulundurulmalıdır.
Preconnect: Dış Sunucularla Erken Ağ Bağlantısı Kurmak
Preconnect, web sitenizin ihtiyaç duyduğu üçüncü taraf (third-party) harici alan adları ile tarayıcı arasında kurulacak ağ bağlantısını erkene alan stratejik bir optimizasyon aracıdır. Normal şartlarda tarayıcı, harici bir sunucudan (örneğin Google Fonts, analiz araçları veya bir CDN adresi) bir kaynak indirmek istediğinde sırasıyla şu üç aşamalı ağ sürecini tamamlamak zorundadır: DNS Çözünürlüğü (DNS Resolution), TCP El Sıkışması (TCP Handshake) ve TLS Güvenlik Doğrulaması (TLS Negotiation). Bu üç adım, ağın gecikme süresine (latency) bağlı olarak yüzlerce milisaniye sürebilir. <link rel="preconnect" href="https://harici-kaynak.com"> komutu, tarayıcıya henüz ilgili dosyaya ihtiyaç duyulmadan bu ağ bağlantısını arka planda kurdurarak zaman kazandırır.
Preconnect ve DNS-Prefetch Arasındaki Teknik Farklar
Ağ optimizasyonunda sıklıkla karıştırılan iki kavram Preconnect ve DNS-Prefetch'tir. DNS-Prefetch (<link rel="dns-prefetch" href="https://harici-kaynak.com">), ağ el sıkışmasının sadece ilk adımı olan alan adının IP adresine dönüştürülmesi (DNS lookup) işlemini yapar. İstemci cihazın işlemci ve bellek kaynaklarını neredeyse hiç tüketmeyen, son derece hafif bir işlemdir. Preconnect ise DNS çözümlemesinin üzerine ek olarak TCP ve TLS bağlantılarını da kurarak sunucuyla tam bir veri aktarım köprüsü inşa eder.
Eğer bir harici kaynaktan dosya çekileceği kesinse ve bu işlem sayfa yüklenirken hemen gerçekleşecekse Preconnect kullanılması en doğru yaklaşımdır. Ancak, sayfanın daha alt kısımlarında yer alan veya kullanıcının etkileşimine göre belki de hiç yüklenmeyecek olan harici alan adları için DNS-Prefetch tercih edilmelidir. Eski tarayıcıların Preconnect desteği olmaması ihtimaline karşı, endüstri standardı olarak her iki ipucu birlikte tanımlanır:
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link rel="dns-prefetch" href="https://fonts.gstatic.com">Preconnect Seçiminde Kaynak İsrafını Önleme Yöntemleri
Preconnect, tarayıcıda açık soketler (socket) tuttuğu için sistem kaynakları açısından maliyetli bir operasyondur. Modern tarayıcılar (özellikle Chromium tabanlı olanlar), açılan bir preconnect bağlantısı üzerinden yaklaşık 10 saniye boyunca herhangi bir veri akışı gerçekleşmezse, sistem kaynaklarını korumak adına bu bağlantıyı otomatik olarak kapatır. Eğer bağlantı kapatıldıktan sonra ilgili kaynağa ihtiyaç duyulursa, tarayıcı tüm DNS, TCP ve TLS süreçlerini sıfırdan başlatmak zorunda kalır. Bu durum, sitenin yüklenme hızına katkı sağlamak yerine çift bağlantı maliyeti oluşturarak performansı geriye götürür.
Bu israfın önüne geçmek için preconnect tanımlanan alan adlarının sayısı strictly (kesin olarak) sınırlandırılmalıdır. Bir web sayfasında 4'ten fazla preconnect kullanılması genellikle anti-pattern (kötü uygulama) kabul edilir. Preconnect sadece sayfa açılışında ilk 1-2 saniye içinde mutlaka çağrılan harici kritik kaynak sağlayıcıları (yazı tipi sunucuları, ana CDN'ler) için ayrılmalıdır. Analitik takip kodları veya canlı destek (chat) pencereleri gibi sayfa açılışını geciktirmemesi gereken dinamik script'lerin sunucu bağlantıları için preconnect yerine asenkron yükleme modelleri tercih edilmelidir.
Karşılaştırmalı Analiz: Preload, Prefetch ve Preconnect Farkları
Web projelerinde doğru performans stratejisini kurgulamak, hangi aracı hangi senaryoda kullanacağınızı bilmekle başlar. Preload, prefetch ve preconnect, tarayıcının ağ katmanı üzerinde farklı öncelik derecelerine ve zamanlama dilimlerine müdahale eder. Yanlış bir eşleştirme, sitenizin yüklenme hızını artırmak yerine tarayıcıyı darboğaza sokarak kullanıcı kaybına neden olabilir.
Hedef Zamanlamaya Göre Tercih Tablosu
Bu üç teknolojinin tarayıcı gözündeki öncelik sıralaması ve hedef zamanlaması keskin çizgilerle ayrılmıştır. Preload, mevcut sayfa oluşturulurken gecikmeye tahammülü olmayan ve oluşturmayı bloke eden (render-blocking) kaynakları kurtarmak için en yüksek öncelikle çalıştırılır. Prefetch ise tamamen geleceğe yatırım yapan, mevcut sayfanın yüklenmesini asla bölmeyen en düşük öncelikli arka plan görevidir. Preconnect ise dosyanın kendisini indirmeden sadece ağ yolculuğunu kısaltmak için harici sunucularla önceden köprü kurma işini üstlenir.
Preload, Prefetch ve Preconnect teknik özelliklerini, çalışma önceliklerini ve en uygun kullanım durumlarını analiz edin. Avantaj Preload mevcut aktif sayfadaki kritik kaynaklara odaklanır. Dezavantaj Prefetch ve Preconnect ise gelecekteki sayfalara veya harici sunuculara yöneliktir. Avantaj Preload yüksek veya en yüksek öncelikle kaynakları derhal çeker. Dezavantaj Prefetch tarayıcının tamamen boşta kalmasını bekleyerek en düşük öncelikle çalışır. Avantaj Preconnect yalnızca harici alan adları için soket bağlantısı kurar ve dosya indirmez. Dezavantaj Preload ve Prefetch doğrudan dosya içeriğini indirip bellekte ya da diskte saklar. Avantaj Doğru yapılandırıldığında Core Web Vitals metriklerini optimize eder. Dezavantaj Aşırı kullanımda bant genişliğini tıkar, sunucu maliyetini artırır ve yükleme sürelerini uzatır.Kaynak İpuçları Karşılaştırma Matrisi
Uygulama Sayfası
Ağ Önceliği (Priority)
Kaynak Yönetimi ve CPU
Yanlış Kullanım Riski
Hangi Durumda Hangisi Kesinlikle Kullanılmamalıdır?
Kaynak ipuçlarının kullanımında yapılan hatalar sitenizin performans bütçesini tüketebilir. Örneğin, sayfa yüklenirken hemen ihtiyaç duyulmayan ve ekranın altında kalan (below-the-fold) görseller veya script dosyaları için preload kullanılmamalıdır. Bu durum tarayıcının öncelik kuyruğunu sabote eder. Benzer şekilde, kullanıcının bir sonraki adımda ziyaret etme ihtimalinin çok düşük olduğu, dinamik veriler içeren kişiselleştirilmiş sayfalar (örneğin kullanıcı profil sayfası veya dinamik sepet detayları) için prefetch tetiklenmemelidir; aksi takdirde sunucuya gereksiz yük bindirilmiş ve mobil veri israf edilmiş olur.
Preconnect tarafında ise, sayfada sadece bir kez ve çok geç çağrılacak olan ya da hiç çağrılmama ihtimali bulunan harici reklam script'leri veya widget sunucuları için bağlantı açılmamalıdır. 10 saniye boyunca veri aktarımı olmayan preconnect bağlantılarının kapatılması, tarayıcının boş yere el sıkışma döngüsüne girmesine neden olarak işlemciyi yorar.
Kurumsal Web Siteleri İçin Kaynak İpucu Optimizasyon Stratejileri
Büyük ölçekli kurumsal web siteleri, e-ticaret platformları ve küresel SaaS ürünleri, karmaşık mimarileri ve çok sayıda üçüncü taraf entegrasyonu (analitik araçlar, müşteri yönetim sistemleri, ödeme geçitleri vb.) nedeniyle ciddi performans zorluklarıyla karşılaşır. Bu tür organizasyonlarda web performansını korumak ve iyileştirmek, sadece teknik bir detay değil, doğrudan dönüşüm oranlarını ve marka değerini etkileyen stratejik bir karardır. Kurumsal altyapılarda kaynak ipuçlarının yönetimi dinamik, denetlenebilir ve performans bütçelerine (performance budgets) bağlı olmalıdır.
Kurumsal web sitelerinde teknik borçların (technical debt) birikmesini önlemek amacıyla, kaynak ipucu optimizasyonları manuel kod eklemeleri yerine otomasyon araçları ve CI/CD süreçleriyle yönetilmelidir. WebPageTest, Lighthouse ve Chrome User Experience Report (CrUX) gibi araçların sağladığı veriler düzenli olarak analiz edilmeli, kritik yükleme yolunu tıkayan varlıklar otomatik olarak tespit edilerek preload veya preconnect havuzuna dahil edilmelidir.
Ayrıca global ölçekteki kurumsal firmaların uymakla yükümlü olduğu veri gizliliği regülasyonları (GDPR, KVKK, CCPA vb.), harici sunucu bağlantılarının yönetimini yasal bir boyuta taşır. Kullanıcıların tarayıcılarından harici sunuculara yapılan preconnect veya prefetch bağlantıları, kişisel veri aktarımı kapsamında değerlendirilebileceğinden, bu işlemler ancak kullanıcının çerez politikası ve veri izni onaylarından sonra dinamik olarak tetiklenecek şekilde programlanmalıdır.
Sıkça Sorulan Sorular
Bütün fontları preload etmek siteyi hızlandırır mı?
Hayır, aksine yavaşlatır. Preload yüksek öncelikli bir komut olduğu için tüm fontları preload etmek, tarayıcının ilk boyama (First Paint) için ihtiyaç duyduğu kritik CSS ve JavaScript dosyalarının indirilmesini geciktirerek bant genişliğini tıkar. Sadece sayfa açılışında ilk ekranda hemen görünen en kritik 1 veya 2 font ailesi preload edilmelidir.
Preconnect limitleri nelerdir ve kaç domain ile sınırlandırılmalıdır?
Preconnect işlemi tarayıcıda aktif soketler açtığı için işlemci ve ağ kaynağı tüketir. Tarayıcılar genellikle bu açık TCP bağlantılarını 10 saniye sonra kapatır. Bu nedenle, preconnect kullanımı sadece en kritik ve kesinlikle kullanılacak 3 ila 4 harici alan adı (CDN, Google Fonts vb.) ile sınırlandırılmalıdır; fazlası kaynak israfına yol açar.
Prefetch edilen bir dosya tarayıcıda nasıl saklanır?
Prefetch edilen kaynaklar, tarayıcının HTTP önbelleğinde veya duruma göre bellek önbelleğinde saklanır. Kullanıcı bir sonraki sayfaya geçip o kaynağı talep ettiğinde, tarayıcı dosyayı uzak sunucudan indirmek yerine doğrudan yerel önbellekten saniyeler içinde okuyarak anında yükler.
Preload kullanırken crossorigin niteliği neden zorunludur?
Fontlar ve CORS gerektiren bazı kaynaklar tarayıcı tarafından varsayılan olarak kimlik bilgisiz istenir. Eğer preload komutuna crossorigin niteliği eklenmezse, tarayıcı preload isteği ile gerçek istek arasındaki farkı ayırt edemez ve aynı dosyayı sunucudan iki kez indirerek bant genişliğini ikiye katlar.
DNS-prefetch ile Preconnect arasındaki temel fark nedir?
DNS-prefetch yalnızca alan adının IP adresini çözümler. Preconnect ise DNS çözümlemesinin üzerine ek olarak TCP el sıkışmasını ve TLS güvenlik doğrulamalarını da tamamlayarak sunucuyla tam bir ağ köprüsü kurar. Preconnect daha hızlıdır ancak DNS-prefetch'e göre çok daha az sistem kaynağı tüketir.
Mobil ağlarda Prefetch kullanımı KVKK veya GDPR açısından risk taşır mı?
Evet, taşır. Kullanıcı henüz bir linke tıklamadan arka planda üçüncü taraf bir sunucudan veri çekilmesi, kullanıcının IP adresinin ve cihaz verilerinin rızası dışında karşı sunucuya iletilmesine neden olur. Bu durum, KVKK ve GDPR uyumluluğu açısından açık rıza mekanizmaları entegre edilene kadar bir veri ihlali riski barındırır.
Tarayıcının bir preload komutunu görmezden gelme olasılığı var mıdır?
Hayır, preload tarayıcıya yönelik isteğe bağlı bir ipucu değil, zorunlu bir emir niteliğindedir. Tarayıcı, belirtilen kaynağı mevcut sayfa için yüksek öncelikle indirmek zorundadır. Ancak kaynak birkaç saniye içinde sayfa tarafından tüketilmezse, tarayıcı konsolunda geliştiriciyi uyaran bir uyarı basılır.
Google Fonts optimizasyonu için en ideal kaynak ipucu kombinasyonu hangisidir?
En ideal kombinasyon, yazı tipi stil dosyasının bulunduğu alan adı için preconnect kullanmaktır. HTML başlık alanına @@CODE 0@@ ve @@CODE 1@@ adresleri için preconnect tanımlanmalı, ek olarak gstatic için crossorigin niteliği eklenmelidir. Bu sayede yazı tipi dosyalarının indirilme süresi 300-400 milisaniyeye kadar kısaltılabilir.