Kullanılmayan ekranın kodunu neden yükleyelim?
Bir ziyaretçi sadece blog yazısı okuyacakken gelişmiş bir editörün bütün kodunu indirmek zorunda kalabilir. Tek paket yaklaşımı geliştirmeyi kolaylaştırsa da ilk açılışa gereksiz iş ekleyebilir. Kod bölme, farklı parçaları ihtiyaç zamanına yaklaştırmayı amaçlar.
Benim için hızlı bir sayfa, kullanıcının henüz ihtiyaç duymadığı her şeyi başta yüklemeyen sayfa. Ancak kodu parçalara ayırmayı tek başına başarı saymam. İlk tıklamada yeni ve uzun bir bekleme oluşuyorsa yükü başka yere taşımış olabiliriz. Hangi bölümün ne zaman gerekli olduğunu tasarım akışıyla birlikte düşünmek isterim.
Temel fikir
web.dev rehberi React.lazy ve Suspense üzerinden, bir bileşenin kodunu ayrı yükleme yaklaşımını gösterir. Bu belirli araçlarla sınırlı bir fikir değildir; temel mesele başlangıçta hangi işlevin gerçekten gerekli olduğudur. Ancak her küçük parçayı ayırmak da ek istek ve bekleme karmaşası yaratabilir.
Bir örnek üzerinden
Örneğin blogdaki çizim editörü yalnızca bir düğmeye basıldığında açılıyorsa ayrı yüklenmesi mantıklı olabilir. Buna karşılık ana başlık ve yazı listesini gereksiz yükleme zincirlerinin arkasına koymak iyi bir başlangıç değildir. Parça yüklenirken anlamlı durum mesajı ve başarısızlıkta yeniden deneme sun.
Nereden başlamalı?
Kararı paket boyutuyla birlikte etkileşim üzerinden değerlendir. İlk açılış hızlandı ama editör her seferinde rahatsız edici biçimde bekletiyorsa dengeyi tekrar kur. En iyi bölme, kullanıcının yaptığı işin sınırlarına uyar.
Benim yaklaşımım
Bir blog yazısı açmak için bütün gelişmiş editör kodunu yüklemeyi tercih etmem. Editör ayrı bir ihtiyaçsa kendi akışında devreye girebilir. Buna karşılık en sık kullanılan menünün beklemeden çalışması önemli. Benim için karar, dosya sayısından çok ziyaretçinin adımlarına göre verilmelidir.
