Belgeler · CDN

Neden CDN?

Panelin tasarım dosyaları kendi sunucundan değil, dünyanın her yerine dağılmış kenar sunuculardan gelir. Bu hem hız hem de sunucu yükü demektir.

01CDN ne kazandırır?

Kazanç	Açıklama
Yakınlık	Dosya kullanıcıya en yakın kenar sunucudan gelir; İstanbul’daki kullanıcı Frankfurt’taki sunucuyu beklemez
Değişmez önbellek	`/v2.4.1/` dosyaları bir yıl `immutable` önbelleklenir; ikinci ziyarette ağ isteği hiç yapılmaz
Sunucu yükü	CSS, JS ve ikonların trafiği senin sunucunu yormaz; PHP ve veritabanı yalnızca kendi işine bakar
Sıkıştırma ve HTTP/3	Brotli ile ~%80 küçülme, modern protokollerle daha az gecikme
Tek yerden güncelleme	Yeni bir fkdev UI sürümünde yalnızca adresteki numarayı değiştirirsin

Paylaşılan önbellek efsanesiModern tarayıcılar önbelleği siteye göre ayırır; yani başka bir site aynı dosyayı yüklemiş olsa da senin sitende yeniden indirilir. CDN’in asıl kazancı yakınlık, sıkıştırma ve uzun süreli önbellektir.

02fkdev Admin hangi dosyaları kullanır?

Dosya	Boyut (brotli)	Görev
`fkdev-ui.min.css`	10,4 KB	Tasarım sistemi
`fkdev-icons.css`	0,8 KB	İkon servisi (95 ikon)
`fkdev-ui.min.js`	6,0 KB	Tema, menü, bildirim, form, sekme
DataTables + jQuery	~45 KB	Yalnızca Siparişler sayfasında

03SRI: CDN’e körü körüne güvenme

CDN başkasının sunucusudur. Biri dosyayı değiştirirse senin panelinde onun kodu çalışır. integrity imzası bunu engeller: dosya bir bayt bile farklıysa tarayıcı yüklemez.

HTML

<link rel="stylesheet" href="https://ui.fkdev.sbs/v2.4.1/fkdev-ui.min.css" integrity="sha384-ywbvrnvLBhspdz061sb4+HVmL4bAnbhyuwKyDq0qCBVdEeLw2Le+aT+M0XhiumnM" crossorigin="anonymous">
<script src="https://ui.fkdev.sbs/v2.4.1/fkdev-ui.min.js" integrity="sha384-M00Zh34vyulzgDN4UvQcDJteSAYjql+zh1KP3B8lMfPikmAoJLDzbKnjWiFHPsvT" crossorigin="anonymous" defer></script>

Terminalİmzayı kendin doğrula

curl -s https://ui.fkdev.sbs/v2.4.1/fkdev-ui.min.js | openssl dgst -sha384 -binary | openssl base64 -A

04CSP ile birlikte

İçerik Güvenlik Politikası (CSP), tarayıcıya hangi adreslerden dosya yüklenebileceğini söyler. CDN’leri açıkça listele:

.htaccess

Header always set Content-Security-Policy "default-src 'self'; script-src 'self' https://ui.fkdev.sbs https://code.jquery.com https://cdn.datatables.net 'sha256-CGGEJHfqC7+LiSARylTxPdCMaADvzU9UYiv/dnwTiYU='; style-src 'self' 'unsafe-inline' https://ui.fkdev.sbs https://fonts.googleapis.com https://cdn.datatables.net; img-src 'self' data: https://ui.fkdev.sbs; font-src https://fonts.gstatic.com; connect-src 'self'; frame-ancestors 'none'; base-uri 'self'; form-action 'self'"

05CORS: en sık görülen hata

SRI imzalı (crossorigin="anonymous") dosyalar ve CSS maskesiyle çizilen ikonlar, CDN yanıtında Access-Control-Allow-Origin başlığı ister. Başlık yoksa tarayıcı dosyayı engeller ve panel stilsiz görünür. Konsolda şu yazar: blocked by CORS policy.

CDN nerede?	Başlığı nereye yazarsın?
Apache (paylaşımlı hosting)	`.htaccess` → `Header set Access-Control-Allow-Origin "*"`
Cloudflare Pages / Workers	Kök klasörde `_headers` dosyası (ui.fkdev.sbs paketinde hazır)
Nginx	`add_header Access-Control-Allow-Origin "*" always;`

Metin_headers (Cloudflare Pages)

/v2.4.1/*
  Access-Control-Allow-Origin: *
  Timing-Allow-Origin: *
  Cache-Control: public, max-age=31536000, immutable

06Otomatik yedek ve kendin barındırma

fkdev Admin bunu kendisi yapar: assets/fkdev-yedek.js, CDN’deki CSS, ikon ya da JS dosyası yüklenemezse (ağ hatası, CORS, imza uyuşmazlığı) aynı sürümün assets/fkdev/ içindeki kopyasına geçer. Panel her durumda açılır; konsola bir uyarı düşer.

CDN’e erişilemezse kendi kopyana düş. Ya da hiç CDN kullanmak istemiyorsan ZIP paketini indirip /assets/fkdev/ altına koy ve adresleri değiştir.

HTML

<link rel="stylesheet" href="https://ui.fkdev.sbs/v2.4.1/fkdev-ui.min.css"
      integrity="sha384-ywbvrnvLBhspdz061sb4+HVmL4bAnbhyuwKyDq0qCBVdEeLw2Le+aT+M0XhiumnM" crossorigin="anonymous"
      onerror="this.onerror=null;this.removeAttribute('integrity');this.href='/assets/fkdev/fkdev-ui.min.css'">

Yazı tipleri ve KVKKGoogle Fonts isteği kullanıcının IP adresini Google’a iletir. Hassas bir panelde yazı tiplerini de kendi sunucunda barındırmayı düşün.