Kod Küçültücü

JavaScript, CSS, HTML ve JSON kodunu küçültün

Tam kılavuzu okuyun

Dil:

Girdi Kodu0 bayt

Küçültülmüş Çıktı

Kod Küçültme Hakkında:

JavaScript: Terser kullanır - ölü kodu kaldırır, değişkenleri gizler
CSS: CSSO kullanır - seçicileri yeniden yapılandırır, tekrarları kaldırır
HTML: Yorumları kaldırır, boşlukları daraltır
JSON: Veri yapısını koruyarak tüm biçimlendirmeyi kaldırır

Tüm işlemler tarayıcınızda gerçekleşir. Kütüphaneler talep üzerine yüklenir.

JavaScript, CSS, HTML ve JSON kodunuzu profesyonel araçlarla küçültün. Dosya boyutunu %40-70 azaltarak web sitenizi hızlandırın. Google PageSpeed, Lighthouse ve Core Web Vitals puanlarınızı yükseltin. Terser (JavaScript), CSSO (CSS) ve optimize edilmiş algoritmalarla endüstri standardı minification. Production deployment öncesi kodunuzu optimize edin. Türkiye'deki e-ticaret siteleri, kurumsal web projeleri ve SaaS uygulamaları için performans optimizasyonu. Tüm işlemler tarayıcınızda—kaynak kodunuz gizli ve güvende kalır.

Kod küçültme (minification), kaynak koddan gereksiz karakterleri (boşluk, yorum, satır sonu) kaldırarak ve kodun işlevselliğini bozmadan yeniden yazarak dosya boyutunu azaltma işlemidir. JavaScript'te değişken isimleri kısaltılır (mangling), ölü kod kaldırılır (dead code elimination), sabitler inline edilir. CSS'te seçiciler birleştirilir, tekrarlayan değerler optimize edilir. HTML'de boşluklar daraltılır, yorumlar silinir. JSON'da tüm formatlama kaldırılır. Küçültme, web performansının kritik bileşenidir: daha küçük dosya = daha hızlı indirme = daha iyi kullanıcı deneyimi. Google, sayfa hızını SEO sıralamasında önemli faktör olarak kullanır. Türkiye'de mobil internet kullanımının yaygınlığı nedeniyle küçültme özellikle önemlidir—3G/4G bağlantılarda her KB önemli.

Production Deployment

Geliştirme ortamında okunabilir kod, production'da minified kod kullanın. CI/CD pipeline'ında build aşamasında otomatik küçültme. Webpack, Rollup, Vite gibi bundler'larla entegrasyon. Source map ile hata ayıklamayı koruyun.

Web Sitesi Hız Optimizasyonu

Google PageSpeed Insights, GTmetrix ve Lighthouse puanlarını artırın. Core Web Vitals metriklerini (LCP, FID, CLS) iyileştirin. Trendyol, Hepsiburada gibi e-ticaret sitelerinde sayfa yükleme süresini azaltın. Bounce rate'i düşürün, conversion'ı artırın.

Mobil Uygulama ve PWA

Progressive Web App (PWA) bundle boyutunu küçültün. React Native, Ionic ve Capacitor projelerinde JavaScript boyutunu azaltın. Mobil kullanıcılar için veri tasarrufu. Offline-first uygulamalarda cache boyutunu optimize edin.

CDN ve Bant Genişliği Tasarrufu

Cloudflare, AWS CloudFront, Akamai üzerinden sunulan içeriği küçültün. Hosting maliyetlerini düşürün (veri aktarımı başına ücret). Yoğun trafikli sitelerde aylık GB tasarrufu. SSL/TLS overhead'ini dengelemek için dosya boyutu kritik.

API Yanıt Optimizasyonu

JSON API yanıtlarını küçülterek yanıt süresini azaltın. GraphQL ve REST endpoint'lerinde veri aktarım maliyetini düşürün. Microservice iletişiminde bant genişliği tasarrufu. Real-time uygulamalarda (WebSocket) mesaj boyutunu optimize edin.

Inline Script ve Style

HTML içine gömülü <script> ve <style> bloklarını küçültün. Critical CSS için inline stil boyutunu azaltın. Above-the-fold içerik için hız kazanın. Email şablonlarındaki inline CSS'i optimize edin.

Her dil için özel algoritmalar kullanılır: JavaScript (Terser): AST (Abstract Syntax Tree) analizi ile değişken isimlerini kısaltır (mangling: myVariable → a), kullanılmayan kodu kaldırır (tree shaking), sabitleri inline eder, IIFE ve arrow function'ları optimize eder. CSS (CSSO): Seçici birleştirme (merging), kısaltma (shorthand), tekrar kaldırma, renk optimizasyonu (#ffffff → #fff). HTML: Boşluk daraltma, yorum kaldırma, boolean attribute kısaltma (disabled='disabled' → disabled), optional tag kaldırma. JSON: Tüm whitespace kaldırma (JSON.stringify sonrası). Aracımız bu kütüphaneleri tarayıcıda Web Worker ile çalıştırır—ana thread bloklanmaz, büyük dosyalar güvenle işlenir.

Dil	Ortalama Küçültme	Teknikler	Araç
JavaScript	%50-70	Mangling, dead code, inlining	Terser
CSS	%30-50	Merging, shorthand, dedup	CSSO
HTML	%10-30	Whitespace, comments	Custom
JSON	%20-40	Whitespace removal	Native

Kod küçültme araçları (Terser, CSSO) WebAssembly ve JavaScript modülleri olarak tarayıcıda çalışır. İlk kullanımda kütüphaneler (~500KB) indirilir ve önbelleğe alınır. Chrome, Firefox, Safari ve Edge'in güncel sürümlerinde sorunsuz çalışır. Büyük dosyalar (1MB+) birkaç saniye sürebilir. İşlem tamamen istemci tarafında—kaynak kodunuz sunucuya gönderilmez, IP ve şirket gizliliği korunur.

Sıkça Sorulan Sorular

Kod küçültme ne işe yarar?

Kod küçültme, dosya boyutunu azaltarak web sitesi hızını artırır. Daha küçük dosya = daha hızlı indirme = daha iyi kullanıcı deneyimi + daha yüksek SEO puanı. Google PageSpeed Insights 'Minify JavaScript/CSS' önerisini bu şekilde karşılarsınız. E-ticaret sitelerinde her 100ms hız artışı conversion'ı %1 artırabilir.

Küçültme kodumu bozar mı?

Hayır, doğru yapılan küçültme kodun işlevselliğini etkilemez. Ancak eval(), Function constructor veya dinamik property erişimi kullanan kodlarda dikkatli olun—mangling sorun yaratabilir. Test: Production'a deploy etmeden önce minified kodu staging ortamında test edin. Source map kullanarak hata ayıklamayı koruyabilirsiniz.

JavaScript ve CSS hangi araçlarla küçültülüyor?

JavaScript: Terser (UglifyJS'in modern halefi)—ES6+ desteği, tree shaking, mangling. Google ve Facebook bu aracı kullanır. CSS: CSSO (CSS Optimizer)—Yandex tarafından geliştirildi, seçici birleştirme ve kısaltma yapıyor. Her iki araç da bu web aracında WebAssembly olarak çalışır.

Source map nedir ve neden önemli?

Source map, minified kod ile orijinal kaynak kod arasında eşleştirme sağlayan bir dosyadır (.map). Tarayıcı DevTools'ta hata ayıklarken minified 'a' değişkeni yerine orijinal 'myVariable' ismini görürsünüz. Production'da source map'i ayrı tutun veya internal olarak saklayın—halka açık olması güvenlik riski oluşturabilir.

Gzip/Brotli ile küçültme farkı nedir?

Küçültme: Gereksiz karakterleri kaldırarak KAYNAK dosya boyutunu azaltır. Gzip/Brotli: Sunucu tarafında sıkıştırma ile AKTARIM boyutunu azaltır. İkisi birlikte kullanılmalı! Önce küçült, sonra sıkıştır. Örnek: 100KB JS → Minify → 40KB → Gzip → 12KB. Cloudflare ve nginx otomatik Gzip/Brotli yapabilir.

Minified kodu tekrar okunabilir yapabilir miyim?

Kısmen. 'Beautify' veya 'prettify' araçları formatlamayı geri getirir ama değişken isimleri kısaltılmışsa (a, b, c) orijinal isimler kaybolur. Bu yüzden sadece minified versiyon değil, orijinal kaynak kodu da saklayın. Obfuscation (karartma) yapılmışsa geri dönüşüm daha da zordur.