Share
Le 14 janvier 2009, la communauté du développement Web a été extrêmement enthousiasmée par la publication officielle de la version 1.3.0 de jQuery. jQuery 1.3 apporte des améliorations significatives, notamment en termes de rapidité. En outre, les développeurs ont pu garder jQuery aussi petit que jamais tout en ajoutant des fonctionnalités intéressantes et souvent demandées. Aujourd'hui, nous allons examiner de manière approfondie les nouvelles fonctionnalités et voir comment en tirer le meilleur parti..
Si vous êtes nouveau sur jQuery et que vous devez télécharger la dernière version, visitez la page d'accueil de jQuery et cliquez sur le lien de téléchargement pour commencer. Si vous effectuez une mise à niveau à partir d'une version antérieure, vous serez heureux de noter que l'API est restée cohérente et compatible avec les versions antérieures. Pour effectuer la mise à niveau, il suffit de mettre à jour la version de jQuery sur votre serveur et d’y associer correctement. Plus tard dans cet article, nous aborderons toutes les modifications qui pourraient causer des problèmes avec votre code actuel..
Les développeurs de jQuery ont fait un pas de géant avec leur moteur de sélection css et ont lancé un projet autonome appelé "Sizzle". Sizzle est maintenant le moteur de sélection css pour jQuery et est géré par la Fondation Dojo. Sizzle semble déjà prometteur pour davantage de frameworks que jQuery, car il est ouvert et disponible pour tous les développeurs souhaitant l’utiliser dans leurs projets. Vous pouvez en apprendre davantage sur sizzle sur la page de publication de jQuery et sur la page d'accueil de Sizzle. jQuery collabore actuellement avec Prototype, Dojo, l'interface utilisateur Yahoo, MochiKit, TinyMCE et de nombreuses autres bibliothèques pour rendre ce moteur encore plus puissant..
Avec la sortie d'un nouveau moteur, les performances sont bien plus rapides. dans certains cas, plus de 400% plus rapide, selon le navigateur utilisé. jQuery a publié ses résultats de test à l'aide de sélecteurs utilisés par les utilisateurs (ce que nous avons présenté dans la section suivante). Voir le graphique ci-dessous pour les résultats de performance du nouveau sélecteur.
Comme mentionné ci-dessus, les tests de performance du sélecteur étaient basés sur les sélecteurs réellement utilisés. J'ai trouvé ces données intéressantes en elles-mêmes et vous pouvez les trouver ici. Cependant, il est dans un format texte seulement et j'aime les graphiques et les tableaux. L’une des choses qui me tenait à l’esprit était de savoir comment un si petit pourcentage de personnes profitait du sélecteur: visible. Vous trouverez ci-dessous les sélecteurs que les développeurs utilisent le plus souvent dans les scripts jQuery actuels..
Une autre chose vraiment intéressante à propos de la sortie de jQuery 1.3 est la sortie d'un nouveau navigateur API jQuery, créé par Remy Sharp. Vous pouvez y accéder via Internet pour rechercher une méthode ou une fonction jQuery de votre choix. Mieux encore, vous pouvez le télécharger en tant que navigateur hors ligne à l'aide du programme d'installation Adobe Air Flash. En gros, l’API jQuery rend accessible toute information ou documentation en quelques clics, avec ou sans connexion Internet..
Au dessus de:navigateur hors ligne opérationnel.
Jusqu’à présent, jQuery exécutait un processus appelé sniffing de navigateur afin de déterminer l’action que le code devait entreprendre. L'inconvénient est de supposer qu'un bogue ou une fonctionnalité existera toujours. jQuery résout ce problème en utilisant un seul objet, appelé jQuery.support, et ne distingue plus un agent utilisateur chanteur. John explique comment jQuery.support fonctionne mieux lui-même:
Nous utilisons une technique appelée détection de fonctionnalité dans laquelle nous simulons une fonctionnalité ou un bogue de navigateur particulier pour vérifier son existence. Nous avons encapsulé toutes les vérifications que nous utilisons dans jQuery dans un seul objet: jQuery.support. Vous trouverez plus d'informations à ce sujet, sur la détection de fonctionnalités et sur ce que cette fonctionnalité fournit dans la documentation jQuery.support..
Alors qu'est-ce que cela signifie à la fin? Cela signifie que les plugins jQuery et jQuery deviendront avec le temps beaucoup plus fiables, car nous n’avons plus besoin de dépendre du sniffing de navigateur pour déterminer un agent de navigateur / utilisateur spécifique. John note également que jQuery.browser reste toujours dans jQuery et le restera pendant un bon bout de temps. Il est déconseillé et vous êtes encouragé à utiliser la détection de fonctionnalités à la place..
Une fonctionnalité intéressante et certainement utile publiée avec la version 1.3 est la nouvelle fonctionnalité "événements en direct". La délégation d'événements en direct signifie que si un élément est associé à un gestionnaire d'événements, tous les autres éléments créés le seront également. Prenez le code ci-dessous qui se trouve dans la documentation de live ().
Accentsconagua
$ ("p"). live ("clic", function () $ (this) .after ("Un autre paragraphe!
");); À première vue, vous vous demanderez peut-être pourquoi je n’attacherais pas un gestionnaire d’événements clic à la balise p? Avec une inspection plus poussée, nous réalisons que tous les éléments p insérés après le paragraphe actuel auront également un gestionnaire d’événements attaché, ce qui donne à l’utilisation un usage illimité. Vous pouvez en savoir plus sur les événements en direct et consulter la démo sur la documentation de jQuery..
Pile sur une autre fonctionnalité intéressante de la 1.3, les développeurs nous ont donné le plus proche (), qui fait exactement ce que vous pensez qu'il ferait. La fonction la plus proche () peut être utilisée pour trouver l'élément le plus proche avec un ensemble de paramètres donné. Encore une fois, jetons un coup d'oeil à la démo.
$ (document) .bind ("clic", fonction (e) $ (e.target) .closest ("li"). toggleClass ("surbrillance");); Dans le code ci-dessus, nous lions une fonction de clic au document actuel et ajoutons / supprimons la classe 'highlight' à l'élément li le plus proche lors du clic de l'utilisateur. Si aucun élément n'est trouvé, il continue à parcourir le document jusqu'à ce qu'il trouve une correspondance. Si aucune correspondance n'est trouvée, rien n'est exécuté. En savoir plus sur la traversée en utilisant la plus proche ().
jQuery a constaté une nette amélioration de la rapidité en matière de manipulation DOM et d'insertion / création de nouveaux éléments HTML. Ceci s’appliquerait à l’utilisation de méthodes telles que .insertBefore () et append (), etc. Pour avoir une meilleure idée des changements de vitesse, nous allons examiner un autre gra.
Il est logique que les développeurs aient mis du temps à se concentrer sur l'augmentation de la vitesse des effets de masquage / exposition. Ce sont deux des effets jQuery les plus fréquemment utilisés. Résultats de vitesse vus ci-dessous.
Si vous utilisez fréquemment offset () dans vos scripts jQuery, vous serez ravi d'apprendre que la vitesse de décalage s'est également considérablement améliorée. Si vous vous le demandez, offset () obtient simplement le décalage actuel de l'élément mis en correspondance par rapport au document. Résultats vus ci-dessous.
Votre premier arrêt pour découvrir tout et tout ce qui était inclus dans cette version. Et si vous avez encore besoin de plus de graphiques, vous pouvez les trouver là aussi.
Visiter le site web
N'oubliez pas de consulter la nouvelle API / navigateur hors ligne de jQuery, cela vous fera gagner beaucoup de temps et de questions lorsque vous êtes bloqué..
Visiter le site web
Jeffrey a réalisé une excellente série de 15 articles sur le blog ThemeForest, couvrant une vaste quantité de conseils, d’astuces et de techniques jQuery. Ne le manque pas!
Visiter le site web
