Optimizations
Next.js, uygulamanızın hızını ve Core Web Vitals iyileştirmek için tasarlanmış çeşitli yerleşik optimizasyonlarla birlikte gelir. Bu kılavuz, kullanıcı deneyiminizi geliştirmek için yararlanabileceğiniz optimizasyonları kapsayacaktır.
Built-in Components
Yerleşik bileşenler, yaygın UI optimizasyonlarını uygulamanın karmaşıklığını ortadan kaldırır. Bu bileşenler şunlardır:
- Görüntüler: Yerel
<img>öğesi üzerine inşa edilmiştir. Görüntü Bileşeni, tembel yükleme ve görüntüleri cihaz boyutuna göre otomatik olarak yeniden boyutlandırma yoluyla görüntüleri performans için optimize eder. - Bağlantı: Yerel
<a>etiketleri üzerine inşa edilmiştir. Link Bileşeni, daha hızlı ve sorunsuz sayfa geçişleri için sayfaları arka planda önceden hazırlar. - Betikler: Yerel
<script>etiketleri üzerine inşa edilmiştir. Komut Dosyası Bileşeni, üçüncü taraf komut dosyalarının yüklenmesi ve yürütülmesi üzerinde kontrol sahibi olmanızı sağlar.
Metadata
Meta veriler, arama motorlarının içeriğinizi daha iyi anlamasına yardımcı olur (bu da daha iyi SEO ile sonuçlanabilir) ve içeriğinizin sosyal medyada nasıl sunulduğunu özelleştirmenize olanak tanıyarak çeşitli platformlarda daha ilgi çekici ve tutarlı bir kullanıcı deneyimi oluşturmanıza yardımcı olur.
Next.js'deki Head Bileşeni, bir sayfanın <head> adresini değiştirmenize olanak tanır. Head Bileş eni belgelerinde daha fazla bilgi edinin.
Static Assets
Next.js /public klasörü görüntüler, yazı tipleri ve diğer dosyalar gibi statik varlıkları sunmak için kullanılabilir. /public içindeki dosyalar da CDN sağlayıcıları tarafından önbelleğe alınabilir, böylece verimli bir şekilde teslim edilirler.
Analytics and Monitoring
Büyük uygulamalar için Next.js, uygulamanızın nasıl performans gösterdiğini anlamanıza yardımcı olmak için popüler analiz ve izleme araçlarıyla entegre olur. Analytics, OpenTelemetry, ve Instrumentation kılavuzlarında daha fazla bilgi edinin.