Bir http istek içine birden çok javascript dosyaları için isteklerini birleştirmek nasıl?

4 Cevap php

Bu kavram benim için yeni bir - ilk YUI dependency configurator ile karşıya geldi. Yerine çok sayıda dosyalar için birden fazla isteği olan temelde, dosyaları sayfa yükleme süresini azaltmak için bir http isteği halinde zincirleme.

Herkes bir lamba yığını üzerinde, bu uygulamaya nasıl biliyor? (Benzer bir soru zaten sorulmuş gördüm, ama seems to be ASP specific.

Teşekkürler!

Güncelleme: Her iki cevap yararlı ... (benim temsilcisi yüzden burada bazı ayrılık düşüncelerini ekleyerek kulüpler henüz yorum yapmak için yeterince yüksek değildir). Ayrıca yararlı olabilir PHP spesifik örneklerle across another blog post geldi. David'in inşa cevabı olsa da, bana farklı bir yaklaşım yapıyor. Teşekkürler, David!

4 Cevap

Çeşitli yolları vardır, iki en belirgin olacaktır:

  1. Eğer hala statik dosyayı hizmet böylece gerektiği gibi işaretli bileşenlerine dayalı bir ısmarlama, benzersiz bir versiyonunu oluşturur YUI gibi bir aracı. Size mümkün olan en akıcı ve verimli kütüphane vermek için onların paketi yüklediğinizde MooTools ve jQuery UI tüm bu gibi paket-inşaatçılar sağlar. Ben bir genel amaçlı bir araç orada var eminim.
  2. Istek üzerine tabanlı JavaScript dosyaları bir demet hizmet veren basit bir Perl / PHP / Python / Ruby komut dosyası oluşturun. Yani "onerequest.js? Yük = ui & yük = etkiler" bu dosyaları yükler bir PHP komut dosyası gidin ve doğru içerik türü ile onlara hizmet ediyorum. Orada Bunun birçok örneği vardır ama şahsen ben bir hayranı değilim.

Ben komut herhangi bir tür aracılığıyla statik dosyalara hizmet için tercih, ama ben de 10 HTTP istekleri maliyet olmadan 10 kadar ayrı küçük sınıf dosyaları ile benim kod geliştirmek istiyorum. Yani en yaygın sınıfları ve fonksiyonları birleştirir ve sonra project.min.js gibi tek bir dosya içine minifies ve üretim bu dosyayı içeren tüm benim görüşlerim / şablonları bir durum var özel bir inşa süreci ile geldi.

Edit - "özel inşa süreci", aslında son derece basit bir perl script. Bu isteğe JSMIN (sevdiğiniz tüm dillerde mevcut) otomatik aracılığıyla tüm şey geçen, ben argüman olarak geçti ve yeni bir dosyaya yazar olduğunuz dosyaların her okur.

Neye benziyor komutta:

perl build-project-master.pl core.js class1.js etc.js /path/to/live/js/file.js

Ne istiyorum Minify. Ben sadece kurmak için walkthrough yazdı.

Capistrano oldukça popüler bir Ruby-tabanlı web dağıtım aracıdır. Bunu düşünüyorsanız ya da zaten kullanıyorsanız, CSS ve Javascript bağımlılıkları anlamaya birleştirme ve dosyaları küçültmek olacak büyük bir mücevher var.

gem install juicer

Dan Juicer GitHub page, birbirine bağlı hangi dosyaları anlamaya ve böylece performansını artırarak, sayfa görünümünde başına http isteklerinin sayısını azaltarak, onları bir araya birleştirme.