Requirejs domReady plugin vs Jquery $(document).ready() ?

Question

Je suis l'aide d' requirejs et besoin d'initialiser quelque chose sur les dom prêt.

Maintenant,

Requirejs fournit :

domReady plugin : http://requirejs.org/docs/api.html#pageload

Mais, nous avons déjà jquery's $(document).ready() qui est disponible pour moi, depuis que j'ai exigé jquery.

Maintenant, j'ai 2 options :

require(['domReady'], function (domReady) {
  domReady(function () {
    // Do my stuff here.
  });
});

OU

$(document).ready(function() {
  // Do my stuff here.
});

Que dois-je choisir et pourquoi ?

• Les deux options semble fonctionner comme prévu.
• Je ne suis pas confiant dans de jquery dom prêt parce que requirejs est en train de faire sa magie -- qui est, depuis requirejs dynamiquement ajouter des scripts, j'ai peur que DOM prêt peut se produire avant que l'ensemble de la dynamique demandé scripts sont chargés.
• Alors que, requirejs va ajouter un fardeau supplémentaire js juste pour domReady quand j'ai déjà jQuery nécessaire.

Mise à jour

• Pourquoi est - requirejs fournit un domReady plugin où nous pouvons avoir de jquery $(document).ready(); ?
• Je ne vois pas l'avantage d'inclure une autre dépendance.
• Si c'est juste pour nourrir un besoin, alors pourquoi ne pas en fournir un Cross Browser ajax ?

Mise à jour 2 [ autant que je sache ]

• Un module qui exige domReady ne seront pas récupérés ou exécutés après le document est prêt.
• Depuis, il fournit :

(1) domReady

require(['domReady'], function (domReady) {
  domReady(function () {
    //This function is called once the DOM is ready.
    //It will be safe to query the DOM and manipulate
    //DOM nodes in this function.
  });
});

• Requirejs ne fonctionne pas différemment domReady. [ via @Gert Sønderby ]
• On pourrait faire la même avec JQuery :

(2) $(document).prêt()

require(['jQuery'], function ($) {
  $(document).ready(function () {
    //This function is called once the DOM is ready.
    //It will be safe to query the DOM and manipulate
    //DOM nodes in this function.
  });
});

Afin d'être plus clair sur ma question :

• Prière de faire la distinction (1) vs (2)

Answer 1

Il semble que tous les principaux points qui ont été déjà frappé, mais quelques détails tombe à travers les mailles du filet. Principalement:

domReady

Il est à la fois une extension et un module. Si vous l'inclure dans les exigences de la matrice de w/ final ! votre module ne sera pas exécuté jusqu'à ce qu'il est "sûr" pour interagir w/ DOM:

define(['domReady!'], function () {
    console.info('The DOM is ready before I happen');
});

Notez que le chargement et l'exécution sont différentes; vous voulez que tous vos fichiers à charger dès que possible, de l'exécution du contenu qui est sensible au temps.

Si vous omettez l' !, puis c'est un module qui se trouve être une fonction, ce qui peut prendre un rappel qui ne sera pas exécuté avant que le DOM est sûr d'avoir une interaction avec:

define(['domReady'], function (domReady) {
    domReady(function () {
        console.info('The DOM is ready before I happen');
    });
    console.info('The DOM might not be ready before I happen');        
});

Avantage lors de l'utilisation de domReady comme un plugin

Le Code qui dépend d'un module qui à son tour dépend domReady! a un très grand avantage: Il n'a pas besoin d'attendre que le DOM soit prêt!

Dire que nous avons un bloc de code, Une, qui dépend d'un module, B, qui dépend domReady!. Module B ne sera pas la fin du chargement avant le DOM est prêt. À son tour, ne sera pas exécuté avant B a chargé.

Si vous utilisez domReady comme un module normal dans B, il serait également nécessaire pour Une dépendre domReady, ainsi que l'habillage de son code à l'intérieur d'un domReady() appel de fonction.

En outre, cela signifie que l' domReady! bénéficie du même avantage sur $(document).ready().

Re les différences entre domReady et $(document).prêt()

À la fois de détecter si/lorsque le DOM est prêt essentiellement de la même manière.

Re peur de jQuery tir au mauvais moment

jQuery fera feu de tout prêt de rappel, même si le DOM avant de jQuery (votre code ne doit pas les soins qui arrive en premier.).

Answer 2

Une tentative de répondre à votre question principale:

Pourquoi est - requirejs fournit un domReady plugin où nous pouvons avoir de jquery $(document).ready();?

Ils font deux choses différentes, vraiment. RequireJS' domReady dépendance signifie que ce module nécessite le DOM d'être complètement chargé avant de pouvoir être exécuté (et peuvent donc être trouvés dans un certain nombre de modules dans votre demande si vous le désirez), tandis que d' $(document).ready() , au lieu des feux de ses fonctions de rappel lorsque le DOM est fini de se charger.

La différence peut sembler subtile, mais pensez à ceci: j'ai un module qui doit être couplée à la DOM, d'une certaine façon, donc je peux soit dépendent domReady et le coupler à de définition de module de temps, ou de mettre bas un $(document).ready() à la fin de celui-ci avec un rappel à une fonction init pour le module. Je dirais la première approche de nettoyage.

En attendant, si j'ai un événement qui doit se produire à droite que le DOM est prêt, l' $(document).ready() événement serait l'aller-vers, puisque cela n'dépend en particulier de RequireJS fait le chargement des modules, à condition que les dépendances de code que vous appelez de sont remplies.

Il est également intéressant de noter que vous ne devez pas nécessairement utiliser RequireJS avec jQuery. Tout module de la bibliothèque qui doit DOM accès (mais ne comptez pas sur jQuery) serait alors encore être utiles en utilisant domReady.

Answer 3

Répondre à vos balles dans l'ordre d'apparition:

• Ils font tous les deux faire la même chose
• Si vous avez des réserves à propos de jquery pour quelque raison que ce soit, puis utiliser domReady
• Corriger, si juste utiliser jQuery
• Parce que pas tout le monde utilise jQuery
• Je suis d'accord, il suffit d'utiliser jQuery
• Les Plugins, par définition, "nourrir un besoin".
• Croix-Navigateur ajax n'est pas une chose. Croix De Domaine? Il y a sans doute, et si il n'y en a pas, alors il n'est pas nécessaire pour se nourrir.
• , -, -, - Ok

Quand il descend à lui, vous avoir à y penser. C'est un mécanisme à exécuter javascript sur domReady. Si vous n'avez pas de jQuery, je serais partisan d'domReady plugin. Puisque vous avez jQuery, ne pas charger plus de scripts pour faire quelque chose qui est déjà disponible.

La Clarté De Mise À Jour

Le domReady plugin recueille des fonctions à appeler lorsque le document est "prêt". Si il est déjà chargé, puis ils exécutent immédiatement.

JQuery recueille des fonctions et lie un objet reporté au dom d'être "prêt". Lorsque le dom est prêt différé objet sera résolu et les fonctions de l'incendie. Si le dom est déjà "prêt" puis le différé sera déjà résolu de sorte que la fonction ne s'exécute immédiatement.

Cela signifie qu'effectivement ils font exactement la même chose.

Answer 4

Après quelques expériences avec requirejs avec plusieurs modules, je vous suggérons d’utiliser domReady.

J’ai remarqué que fonction associée à $(document).ready(...) n’est pas appelée lorsque plusieurs modules sont chargés par requirejs. Je soupçonne que dom se prépare avant tout requirejs le code est exécuté et gestionnaire de rappel prêt de jquery est appelée avant il obtient lié avec la fonction définie par l’utilisateur soit dans le code du module principal.