SORU
6 ŞUBAT 2011, Pazar


Neden DOM sadece <script> bir öğe oluşturmak yerine Require.JS gibi bir şey kullanmak?

Avantajları require.js DOM sadece bir öğe oluşturmak için karşılaştırıldığında, ne sunuyor? Require.JS benim anlayış bağımlılıkları yüklemek için yeteneği sunar. Ama bu sadece yükler gerekli harici JS dosyası bir öğe oluşturarak yapılabilir?

İşlev needMe gerektiren, örneğin, lets function doStuff var varsayalım (), (). doStuff harici bir dosya needMe süre do_stuff.js, () harici bir dosya need_me.js.

Bu require.js şekilde yapıyor:

do_stuff.js

define(['need_me'],function(){
    function doStuff(){
        //do some stuff
        needMe();
        //do some more stuff
    }
});

Sadece bir komut dosyası öğesi oluşturarak bu işi yapmaya

do_stuff.js

function doStuff(){
    var scriptElement  = document.createElement('script');
    scriptElement.src = 'need_me.js';
    scriptElement.type = 'text/javascript';
    document.getElementsByTagName('head')[0].appendChild(scriptElement);

    //do some stuff
    needMe();
    //do some more stuff
}

Bunların her ikisi de çalışır. Ancak, ikinci versiyonu bana require.js tüm kütüphane yüklemek için gerektirmez. Bu yüzden ikinci bir yapmam gereken ne için daha iyi? Eğer öyleyse, hangi şartlar altında require.js avantajlı olurdu?

CEVAP
1 Temmuz 2013, PAZARTESİ


Avantajları require.js DOM sadece bir öğe oluşturmak için karşılaştırıldığında, ne sunuyor?

Örnek, needMe() fonksiyon çağrılması demek oluyor ki script etiketi uyumsuz, yaratıyorsunöncebu need_me.js dosya yükleme tamamlanır. Bu fonksiyon tanımlı olmadığı yakalanmamış istisna olur.

Bunun yerine, gerçekten işe önerdiğin şey yapmak için, böyle bir şey yapmak için ihtiyacınız olacak:

function doStuff(){
    var scriptElement  = document.createElement('script');
    scriptElement.src = 'need_me.js';
    scriptElement.type = 'text/javascript';

    scriptElement.addEventListener("load", 
        function() { 
            console.log("script loaded - now it's safe to use it!");

            // do some stuff
            needMe();
            //do some more stuff

        }, false);

    document.getElementsByTagName('head')[0].appendChild(scriptElement);

}

Belki, olabilir veya en iyi RequireJS gibi bir Paket Yöneticisi kullanmak veya yukarıda gösterildiği gibi saf JavaScript stratejisi kullanmak olmayabilir. Web uygulamanızın daha hızlı yük olsa da, sitede çağırma işlevi ve özellikleri kaynaklar için bu eylem yapılmadan önce yük bekleyen kapsıyor bu yana daha yavaş olur.

Eğer bir Web uygulaması tek sayfa bir uygulama olarak inşa edilmiş ise, o zaman insanlar aslında çok sık sayfayı yeniden olmayacağını düşünün. Bu durumda, önyükleme her deneyim aslında daha hızlı görünüyor yapmak yardımcı olacaktırkullanarakapp. Bu durumda, haklısın, sadece tüm kaynakları sadece sayfa başı veya vücudun script etiketlerini ekleyerek yükleyin.

Ancak, eğer bina bir web sitesi veya Web uygulama aşağıdaki daha geleneksel model bir geçişler, sayfadan sayfaya, neden kaynakları için yeniden, bir tembel yükleme yaklaşabilir yardım hızlandırmak bu geçişler.

Bunu Paylaş:
  • Google+
  • E-Posta
Etiketler:

YORUMLAR

SPONSOR VİDEO

Rastgele Yazarlar

  • How Things Are Made

    How Things A

    17 HAZİRAN 2008
  • SuicideSheeep

    SuicideSheee

    8 Ocak 2012
  • Tube Time

    Tube Time

    14 Mayıs 2013