Juste une importante harmonisation des différents navigateurs et une gestion poussée des évènements. Pas grand chose en somme.;)
(et c'est aussi vrai avec les concurrents comme Mootools, qooxdoo ou encore prototype et extjs)
Version imprimable
Un petit exemple alors...Citation:
Envoyé par ernestrenan
Code jQuery
En vanilla JavaScript, tu serais obligé :Code:
1
2
3
4
5
6
7
8 $('.survol').hover( function(){ $(this).fadeTo('fast', 1); }, function(){ $(this).fadeTo('fast', 0.5); } );
- De créer la fonctionnalité cross-browser pour récupérer des éléments par un nom de classe.
- Créer une animation pour faire varier l'opacité.
- Faire une boucle sur tous les éléments possédant la classe voulue.
- Sur chacun de ces éléments, gérer le mouseover et le mouseout.
- Sur ces deux événements, vérifier qu'il s'applique bien à l'élément voulu puis appliquer l'animation.
Bien entendu, je ne te parle pas ici de toutes les complications à appréhender.
Alors, combien de lignes de code pour la même fonctionnalité ?
Bien que je me doute que Bovino n'ai dit cette phrase dans ce sens, c'est vraiment l'argument (très souvent le seul) des fans de JQuery qui me hérisse le poil.Citation:
Alors, combien de lignes de code pour la même fonctionnalité ?
En effet, au niveau du nombre de ligne à coder soi-même, on constate une différence flagrante, néanmoins, ce à quoi ces fans pensent moins, c'est au nombre de lignes contenues dans leur bibliothèque/framework, afin de leur permettre de faire ceci ou cela.
Faites la somme du code de la lib' + celles pour l'utilisation que l'on veut en faire et on arrive généralement à bien plus qu'en codant en pur.
Pareillement, en terme d'optimisation de ressources nécessaires pour l'exécution d'une fonctionnalité, la lib' va tester et instancier plein de choses dont on se passerait très bien.
L'autre chose qui me fait bondir, c'est le fameux "bah, 50Mo de cache, de nos jours, c'est rien du tout".
Pourquoi? Les connexions internet sont de plus en plus rapides et on a de plus en plus de volume (voire illimité), ok... Néanmoins, ce n'est pas la seule réalité!
Perso, j'accède à internet via une connexion mobile (down : ~80Ko/s et volume : 2Go/mois). De plus, la plupart des développeurs sont en hébergement mutualisé où la gestion du cache est, dans la plupart des cas, hors des possibilités de personnalisations et, du coup, on se retrouve avec une lib' qui est intégralement chargée à chaque page!!!
Heureusement que nous ne sommes pas encore aux connexions en To/s, sinon, on aurait des lib' en gigas et je ne verrais jamais une page complète, avec un seul forfait. :aie:
Autre point non-évoqué, bien que JQuery soit connu pour ses optimisations, je remarque presque chaque jour sa grande faiblesse au niveau de la gestion des connexions internet faibles/instables. "le script ne réponds plus..."
Enfin, une anecdote assez cocasse qui illustre ce que certains font de JQuery. J'ai visité les réalisations d'une boîte de dev, dans le cadre de mes recherches d'emploi et suis tombé sur une lightbox, en plein milieu de l'écran m'avertissant que l'auteur du site web n'a pas payé la licence du plugin JQuery utilisé et me demandant de le contacter afin qu'il paie pour que je n'aie plus à voir ce message.
La méconnaissance de ce que les gens utilisent, ajoutée au caractère ésotérique souvent retrouvé en JQuery fait que les gens ne savent même pas ce qu'ils importent et, donc, s'il est possible de se retrouver dans ce genre de situations, il l'est tout autant pour du code dangereux (servant à du vol d'informations, de comptes, etc.).
C'est pour ça que les développeurs de jQuery eux-mêmes suggèrent fortement de ne se servir de jQuery que si nécessaire (voir slides Proven performance tips de Addy Osmani)
Ton cas n'est pas rare en plus mais c'est pour ça que des frameworks comme jQuery Mobile ou Sencha Touch ou encore jQTouch existent, pour éviter ce rechargement systématique.
Jamais vu mais je veux bien un exemple.
Là le problème relève, et je suis tenté de dire "encore une fois", du bon sens. Et de la formation des mecs. On se retrouve avec des charrettes de développeurs incomplètement voire pas du tout formé concernant JS (mon parcours en ait la preuve, je n'ai jamais appris JS en cours) et d'une belle brochette d'utilisateurs encore plus boulets. Si les gens avaient un peu de bon sens, on en serait pas là. Mais bon, on refait pas le monde.
jquery c'est un truc d' usine en gros c'est fait pour de la productivité et je trouve que l'on en fait trop on a l'impression que sans jquery le web serait moche y qu'a voir sur le forum a chaque fois que quelqu'un cherche un truc il est automatiquement redirigé vers du jquery comme si les scripts en jquery etaient toujours parfaits je prend par exemplece sujet ou on voit dans le html des height et width en dure pour definir la taille de l'image et sans la balise style
et quandi je regade la source qui apparement utilise jquery je me dit tout ca pour si peut
et en plus c'est compressé et sans le cssCode:(function(g){var q={vertical:!1,rtl:!1,start:1,offset:1,size:null,scroll:3,visible:null,animation:"normal",easing:"swing",auto:0,wrap:null,initCallback:null,setupCallback:null,reloadCallback:null,itemLoadCallback:null,itemFirstInCallback:null,itemFirstOutCallback:null,itemLastInCallback:null,itemLastOutCallback:null,itemVisibleInCallback:null,itemVisibleOutCallback:null,animationStepCallback:null,buttonNextHTML:"<div></div>",buttonPrevHTML:"<div></div>",buttonNextEvent:"click",buttonPrevEvent:"click", buttonNextCallback:null,buttonPrevCallback:null,itemFallbackDimension:null},m=!1;g(window).bind("load.jcarousel",function(){m=!0});g.jcarousel=function(a,c){this.options=g.extend({},q,c||{});this.autoStopped=this.locked=!1;this.buttonPrevState=this.buttonNextState=this.buttonPrev=this.buttonNext=this.list=this.clip=this.container=null;if(!c||c.rtl===void 0)this.options.rtl=(g(a).attr("dir")||g("html").attr("dir")||"").toLowerCase()=="rtl";this.wh=!this.options.vertical?"width":"height";this.lt=!this.options.vertical? this.options.rtl?"right":"left":"top";for(var b="",d=a.className.split(" "),f=0;f<d.length;f++)if(d[f].indexOf("jcarousel-skin")!=-1){g(a).removeClass(d[f]);b=d[f];break}a.nodeName.toUpperCase()=="UL"||a.nodeName.toUpperCase()=="OL"?(this.list=g(a),this.clip=this.list.parents(".jcarousel-clip"),this.container=this.list.parents(".jcarousel-container")):(this.container=g(a),this.list=this.container.find("ul,ol").eq(0),this.clip=this.container.find(".jcarousel-clip"));if(this.clip.size()===0)this.clip= this.list.wrap("<div></div>").parent();if(this.container.size()===0)this.container=this.clip.wrap("<div></div>").parent();b!==""&&this.container.parent()[0].className.indexOf("jcarousel-skin")==-1&&this.container.wrap('<div class=" '+b+'"></div>');this.buttonPrev=g(".jcarousel-prev",this.container);if(this.buttonPrev.size()===0&&this.options.buttonPrevHTML!==null)this.buttonPrev=g(this.options.buttonPrevHTML).appendTo(this.container);this.buttonPrev.addClass(this.className("jcarousel-prev"));this.buttonNext= g(".jcarousel-next",this.container);if(this.buttonNext.size()===0&&this.options.buttonNextHTML!==null)this.buttonNext=g(this.options.buttonNextHTML).appendTo(this.container);this.buttonNext.addClass(this.className("jcarousel-next"));this.clip.addClass(this.className("jcarousel-clip")).css({position:"relative"});this.list.addClass(this.className("jcarousel-list")).css({overflow:"hidden",position:"relative",top:0,margin:0,padding:0}).css(this.options.rtl?"right":"left",0);this.container.addClass(this.className("jcarousel-container")).css({position:"relative"}); !this.options.vertical&&this.options.rtl&&this.container.addClass("jcarousel-direction-rtl").attr("dir","rtl");var j=this.options.visible!==null?Math.ceil(this.clipping()/this.options.visible):null,b=this.list.children("li"),e=this;if(b.size()>0){var h=0,i=this.options.offset;b.each(function(){e.format(this,i++);h+=e.dimension(this,j)});this.list.css(this.wh,h+100+"px");if(!c||c.size===void 0)this.options.size=b.size()}this.container.css("display","block");this.buttonNext.css("display","block");this.buttonPrev.css("display", "block");this.funcNext=function(){e.next()};this.funcPrev=function(){e.prev()};this.funcResize=function(){e.resizeTimer&&clearTimeout(e.resizeTimer);e.resizeTimer=setTimeout(function(){e.reload()},100)};this.options.initCallback!==null&&this.options.initCallback(this,"init");!m&&g.browser.safari?(this.buttons(!1,!1),g(window).bind("load.jcarousel",function(){e.setup()})):this.setup()};var f=g.jcarousel;f.fn=f.prototype={jcarousel:"0.2.8"};f.fn.extend=f.extend=g.extend;f.fn.extend({setup:function(){this.prevLast= this.prevFirst=this.last=this.first=null;this.animating=!1;this.tail=this.resizeTimer=this.timer=null;this.inTail=!1;if(!this.locked){this.list.css(this.lt,this.pos(this.options.offset)+"px");var a=this.pos(this.options.start,!0);this.prevFirst=this.prevLast=null;this.animate(a,!1);g(window).unbind("resize.jcarousel",this.funcResize).bind("resize.jcarousel",this.funcResize);this.options.setupCallback!==null&&this.options.setupCallback(this)}},reset:function(){this.list.empty();this.list.css(this.lt, "0px");this.list.css(this.wh,"10px");this.options.initCallback!==null&&this.options.initCallback(this,"reset");this.setup()},reload:function(){this.tail!==null&&this.inTail&&this.list.css(this.lt,f.intval(this.list.css(this.lt))+this.tail);this.tail=null;this.inTail=!1;this.options.reloadCallback!==null&&this.options.reloadCallback(this);if(this.options.visible!==null){var a=this,c=Math.ceil(this.clipping()/this.options.visible),b=0,d=0;this.list.children("li").each(function(f){b+=a.dimension(this, c);f+1<a.first&&(d=b)});this.list.css(this.wh,b+"px");this.list.css(this.lt,-d+"px")}this.scroll(this.first,!1)},lock:function(){this.locked=!0;this.buttons()},unlock:function(){this.locked=!1;this.buttons()},size:function(a){if(a!==void 0)this.options.size=a,this.locked||this.buttons();return this.options.size},has:function(a,c){if(c===void 0||!c)c=a;if(this.options.size!==null&&c>this.options.size)c=this.options.size;for(var b=a;b<=c;b++){var d=this.get(b);if(!d.length||d.hasClass("jcarousel-item-placeholder"))return!1}return!0}, get:function(a){return g(">.jcarousel-item-"+a,this.list)},add:function(a,c){var b=this.get(a),d=0,p=g(c);if(b.length===0)for(var j,e=f.intval(a),b=this.create(a);;){if(j=this.get(--e),e<=0||j.length){e<=0?this.list.prepend(b):j.after(b);break}}else d=this.dimension(b);p.get(0).nodeName.toUpperCase()=="LI"?(b.replaceWith(p),b=p):b.empty().append(c);this.format(b.removeClass(this.className("jcarousel-item-placeholder")),a);p=this.options.visible!==null?Math.ceil(this.clipping()/this.options.visible): null;d=this.dimension(b,p)-d;a>0&&a<this.first&&this.list.css(this.lt,f.intval(this.list.css(this.lt))-d+"px");this.list.css(this.wh,f.intval(this.list.css(this.wh))+d+"px");return b},remove:function(a){var c=this.get(a);if(c.length&&!(a>=this.first&&a<=this.last)){var b=this.dimension(c);a<this.first&&this.list.css(this.lt,f.intval(this.list.css(this.lt))+b+"px");c.remove();this.list.css(this.wh,f.intval(this.list.css(this.wh))-b+"px")}},next:function(){this.tail!==null&&!this.inTail?this.scrollTail(!1): this.scroll((this.options.wrap=="both"||this.options.wrap=="last")&&this.options.size!==null&&this.last==this.options.size?1:this.first+this.options.scroll)},prev:function(){this.tail!==null&&this.inTail?this.scrollTail(!0):this.scroll((this.options.wrap=="both"||this.options.wrap=="first")&&this.options.size!==null&&this.first==1?this.options.size:this.first-this.options.scroll)},scrollTail:function(a){if(!this.locked&&!this.animating&&this.tail){this.pauseAuto();var c=f.intval(this.list.css(this.lt)), c=!a?c-this.tail:c+this.tail;this.inTail=!a;this.prevFirst=this.first;this.prevLast=this.last;this.animate(c)}},scroll:function(a,c){!this.locked&&!this.animating&&(this.pauseAuto(),this.animate(this.pos(a),c))},pos:function(a,c){var b=f.intval(this.list.css(this.lt));if(this.locked||this.animating)return b;this.options.wrap!="circular"&&(a=a<1?1:this.options.size&&a>this.options.size?this.options.size:a);for(var d=this.first>a,g=this.options.wrap!="circular"&&this.first<=1?1:this.first,j=d?this.get(g): this.get(this.last),e=d?g:g-1,h=null,i=0,k=!1,l=0;d?--e>=a:++e<a;){h=this.get(e);k=!h.length;if(h.length===0&&(h=this.create(e).addClass(this.className("jcarousel-item-placeholder")),j[d?"before":"after"](h),this.first!==null&&this.options.wrap=="circular"&&this.options.size!==null&&(e<=0||e>this.options.size)))j=this.get(this.index(e)),j.length&&(h=this.add(e,j.clone(!0)));j=h;l=this.dimension(h);k&&(i+=l);if(this.first!==null&&(this.options.wrap=="circular"||e>=1&&(this.options.size===null||e<= this.options.size)))b=d?b+l:b-l}for(var g=this.clipping(),m=[],o=0,n=0,j=this.get(a-1),e=a;++o;){h=this.get(e);k=!h.length;if(h.length===0){h=this.create(e).addClass(this.className("jcarousel-item-placeholder"));if(j.length===0)this.list.prepend(h);else j[d?"before":"after"](h);if(this.first!==null&&this.options.wrap=="circular"&&this.options.size!==null&&(e<=0||e>this.options.size))j=this.get(this.index(e)),j.length&&(h=this.add(e,j.clone(!0)))}j=h;l=this.dimension(h);if(l===0)throw Error("jCarousel: No width/height set for items. This will cause an infinite loop. Aborting..."); this.options.wrap!="circular"&&this.options.size!==null&&e>this.options.size?m.push(h):k&&(i+=l);n+=l;if(n>=g)break;e++}for(h=0;h<m.length;h++)m[h].remove();i>0&&(this.list.css(this.wh,this.dimension(this.list)+i+"px"),d&&(b-=i,this.list.css(this.lt,f.intval(this.list.css(this.lt))-i+"px")));i=a+o-1;if(this.options.wrap!="circular"&&this.options.size&&i>this.options.size)i=this.options.size;if(e>i){o=0;e=i;for(n=0;++o;){h=this.get(e--);if(!h.length)break;n+=this.dimension(h);if(n>=g)break}}e=i-o+ 1;this.options.wrap!="circular"&&e<1&&(e=1);if(this.inTail&&d)b+=this.tail,this.inTail=!1;this.tail=null;if(this.options.wrap!="circular"&&i==this.options.size&&i-o+1>=1&&(d=f.intval(this.get(i).css(!this.options.vertical?"marginRight":"marginBottom")),n-d>g))this.tail=n-g-d;if(c&&a===this.options.size&&this.tail)b-=this.tail,this.inTail=!0;for(;a-- >e;)b+=this.dimension(this.get(a));this.prevFirst=this.first;this.prevLast=this.last;this.first=e;this.last=i;return b},animate:function(a,c){if(!this.locked&& !this.animating){this.animating=!0;var b=this,d=function(){b.animating=!1;a===0&&b.list.css(b.lt,0);!b.autoStopped&&(b.options.wrap=="circular"||b.options.wrap=="both"||b.options.wrap=="last"||b.options.size===null||b.last<b.options.size||b.last==b.options.size&&b.tail!==null&&!b.inTail)&&b.startAuto();b.buttons();b.notify("onAfterAnimation");if(b.options.wrap=="circular"&&b.options.size!==null)for(var c=b.prevFirst;c<=b.prevLast;c++)c!==null&&!(c>=b.first&&c<=b.last)&&(c<1||c>b.options.size)&&b.remove(c)}; this.notify("onBeforeAnimation");if(!this.options.animation||c===!1)this.list.css(this.lt,a+"px"),d();else{var f=!this.options.vertical?this.options.rtl?{right:a}:{left:a}:{top:a},d={duration:this.options.animation,easing:this.options.easing,complete:d};if(g.isFunction(this.options.animationStepCallback))d.step=this.options.animationStepCallback;this.list.animate(f,d)}}},startAuto:function(a){if(a!==void 0)this.options.auto=a;if(this.options.auto===0)return this.stopAuto();if(this.timer===null){this.autoStopped= !1;var c=this;this.timer=window.setTimeout(function(){c.next()},this.options.auto*1E3)}},stopAuto:function(){this.pauseAuto();this.autoStopped=!0},pauseAuto:function(){if(this.timer!==null)window.clearTimeout(this.timer),this.timer=null},buttons:function(a,c){if(a==null&&(a=!this.locked&&this.options.size!==0&&(this.options.wrap&&this.options.wrap!="first"||this.options.size===null||this.last<this.options.size),!this.locked&&(!this.options.wrap||this.options.wrap=="first")&&this.options.size!==null&& this.last>=this.options.size))a=this.tail!==null&&!this.inTail;if(c==null&&(c=!this.locked&&this.options.size!==0&&(this.options.wrap&&this.options.wrap!="last"||this.first>1),!this.locked&&(!this.options.wrap||this.options.wrap=="last")&&this.options.size!==null&&this.first==1))c=this.tail!==null&&this.inTail;var b=this;this.buttonNext.size()>0?(this.buttonNext.unbind(this.options.buttonNextEvent+".jcarousel",this.funcNext),a&&this.buttonNext.bind(this.options.buttonNextEvent+".jcarousel",this.funcNext), this.buttonNext[a?"removeClass":"addClass"](this.className("jcarousel-next-disabled")).attr("disabled",a?!1:!0),this.options.buttonNextCallback!==null&&this.buttonNext.data("jcarouselstate")!=a&&this.buttonNext.each(function(){b.options.buttonNextCallback(b,this,a)}).data("jcarouselstate",a)):this.options.buttonNextCallback!==null&&this.buttonNextState!=a&&this.options.buttonNextCallback(b,null,a);this.buttonPrev.size()>0?(this.buttonPrev.unbind(this.options.buttonPrevEvent+".jcarousel",this.funcPrev), c&&this.buttonPrev.bind(this.options.buttonPrevEvent+".jcarousel",this.funcPrev),this.buttonPrev[c?"removeClass":"addClass"](this.className("jcarousel-prev-disabled")).attr("disabled",c?!1:!0),this.options.buttonPrevCallback!==null&&this.buttonPrev.data("jcarouselstate")!=c&&this.buttonPrev.each(function(){b.options.buttonPrevCallback(b,this,c)}).data("jcarouselstate",c)):this.options.buttonPrevCallback!==null&&this.buttonPrevState!=c&&this.options.buttonPrevCallback(b,null,c);this.buttonNextState= a;this.buttonPrevState=c},notify:function(a){var c=this.prevFirst===null?"init":this.prevFirst<this.first?"next":"prev";this.callback("itemLoadCallback",a,c);this.prevFirst!==this.first&&(this.callback("itemFirstInCallback",a,c,this.first),this.callback("itemFirstOutCallback",a,c,this.prevFirst));this.prevLast!==this.last&&(this.callback("itemLastInCallback",a,c,this.last),this.callback("itemLastOutCallback",a,c,this.prevLast));this.callback("itemVisibleInCallback",a,c,this.first,this.last,this.prevFirst, this.prevLast);this.callback("itemVisibleOutCallback",a,c,this.prevFirst,this.prevLast,this.first,this.last)},callback:function(a,c,b,d,f,j,e){if(!(this.options[a]==null||typeof this.options[a]!="object"&&c!="onAfterAnimation")){var h=typeof this.options[a]=="object"?this.options[a][c]:this.options[a];if(g.isFunction(h)){var i=this;if(d===void 0)h(i,b,c);else if(f===void 0)this.get(d).each(function(){h(i,this,d,b,c)});else for(var a=function(a){i.get(a).each(function(){h(i,this,a,b,c)})},k=d;k<=f;k++)k!== null&&!(k>=j&&k<=e)&&a(k)}}},create:function(a){return this.format("<li></li>",a)},format:function(a,c){for(var a=g(a),b=a.get(0).className.split(" "),d=0;d<b.length;d++)b[d].indexOf("jcarousel-")!=-1&&a.removeClass(b[d]);a.addClass(this.className("jcarousel-item")).addClass(this.className("jcarousel-item-"+c)).css({"float":this.options.rtl?"right":"left","list-style":"none"}).attr("jcarouselindex",c);return a},className:function(a){return a+" "+a+(!this.options.vertical?"-horizontal":"-vertical")}, dimension:function(a,c){var b=g(a);if(c==null)return!this.options.vertical?b.outerWidth(!0)||f.intval(this.options.itemFallbackDimension):b.outerHeight(!0)||f.intval(this.options.itemFallbackDimension);else{var d=!this.options.vertical?c-f.intval(b.css("marginLeft"))-f.intval(b.css("marginRight")):c-f.intval(b.css("marginTop"))-f.intval(b.css("marginBottom"));g(b).css(this.wh,d+"px");return this.dimension(b)}},clipping:function(){return!this.options.vertical?this.clip[0].offsetWidth-f.intval(this.clip.css("borderLeftWidth"))- f.intval(this.clip.css("borderRightWidth")):this.clip[0].offsetHeight-f.intval(this.clip.css("borderTopWidth"))-f.intval(this.clip.css("borderBottomWidth"))},index:function(a,c){if(c==null)c=this.options.size;return Math.round(((a-1)/c-Math.floor((a-1)/c))*c)+1}});f.extend({defaults:function(a){return g.extend(q,a||{})},intval:function(a){a=parseInt(a,10);return isNaN(a)?0:a},windowLoaded:function(){m=!0}});g.fn.jcarousel=function(a){if(typeof a=="string"){var c=g(this).data("jcarousel"),b=Array.prototype.slice.call(arguments, 1);return c[a].apply(c,b)}else return this.each(function(){var b=g(this).data("jcarousel");b?(a&&g.extend(b.options,a),b.reload()):g(this).data("jcarousel",new f(this,a))})}})(jQuery);
le voici en live
il y a quand meme plus cour pour ce qui est demandé
et c'est inspiré d'une autre qui me fait me demandé si elle etait en jquery
Hum, je parlais de se connecter depuis son note/netbook via une connexion mobile, le navigateur n'étant pas détecté comme un navigateur mobile, les solutions que tu cites ne sont donc pas prises en compte, sauf erreur de ma part...
Des exemples? le chat de DVP, GMail et plein d'autres...
Et quand tu regardes d'où provient l'erreur -> le core AJAX de JQuery
Pourtant, c'est pas bien compliqué de faire un gestionnaire de requêtes AJAX stable, se mettant en pause en cas de perte de connexion et reprenant lorsque la connexion est rétablie...
Oui enfin c'est pas un problème de JS mais surtout de bon sens. Encore une fois
Bonsoir
Il y a longtemps que les feuilles de style (CSS) existent et que l'on prône la séparation des codes HTML, CSS, et JS. Comme souvent, ce n'est pas un problème jQuery, mais une méconnaissance des fondamentaux.
Pour le reste, je me suis déjà exprimé sur les désavantages et les avantages de jQuery : ici, dans la FAQ JQuery et ailleurs.
http://www.developpez.net/forums/d10...t/#post5635026
http://javascript.developpez.com/faq/jquery/
Que ce soit en Javascript ou dans un autre langage, avec ou sans framework, je penses que le problème est ailleurs... Et ce n'est pas un argument valable sur le "pour ou contre l'utilisation des framework Javascript"
Le problème est toujours le même, il n'y a pas de réponse "oui il faut" ou "non il ne faut pas", l'essentiel est de savoir que ça existe et de savoir dans quelles situations s'en servir ou s'en passer. Si c'est pour faire le site du boulanger du quartier, tu peux réussir à te débrouiller sans problème, par contre si c'est pour faire une application Web avec des effets bling bling de tous les côtés, de l'AJAX dans tous les sens, une compatibilité de malade sur tous les navigateurs, ça vaut peut-être le coup d'y réfléchir. Après avoir peser le pour et le contre tu pourras prendre ta décision de "oui ça va m'apporter des choses" ou "non ce n'est pas la peine j'ai déjà ce qu'il me faut".
Je serais curieux de voir une ligne de code de jQuery ou autre qui ne sert à rien.
C'est pour cela que les CDN existent et que la plupart des versions des frameworks sont hébergés par quelques petites sociétés telles que Google, Microsoft... Il me semble avoir lu quelque part il y a quelques temps que d'après une étude sur un nombre significatif de sites utilisant jQuery à partir du CDN Google, 80% des visiteurs avait déjà le fichier en cache. Si tous les développeurs faisait ce petit effort là on pourrait atteindre un nombre encore plus important et le poids du framework ne serait plus vraiment un problème (sauf la première fois ou lors d'une mise à jour, certes). Je ne parles pas des différents plugins qui peuvent être utilisés sur les sites car là effectivement cela peut poser des problèmes au niveau poids et temps de téléchargement. Après il y a toujours des bonnes pratiques d'obfuscation du code, de compression des contenus etc etc qui permettent de limiter quand même pas mal ce genre de problématiques (c'est pas résolu définitivement, mais c'est un bon début).
Jamais vu non plus... Tu peux rapporter ce bug sur le bugtracker de jQuery si tu veux, je penses qu'il serait accepter et ce serait bénéfique pour tout le monde :)
Hey au fait, je ne suis pas certain que GMail utilise un quelconque framework "publique", enfin affaire à suivre... :p
Comme je l'ai dis plus haut, ici le problème ne se situe pas au niveau de jQuery ou d'un quelconque framework, mais bien entre la chaise et le clavier...
Je ne dis pas que des choses ne servent à rien mais bien que JQuery initialise certaines choses, pour son propre environnement, alors que pour l'usage qu'on peut en faire, tout n'est pas nécessaire.
A moins d'avoir une connexion aussi pourrie que la mienne, pas étonnant que vous ne l'ayez jamais vue... ^^
Je ne l'invente pas, tout de même... je ne fais que relater le message que me renvoie Firefox
Je suis bien d'accord sur ce fait mais lorsqu'on regarde la source non-compressée, non-minifiée et non-obfusquée de certains plugins, même pour quelqu'un ayant une connaissance assez pointue du JS, le code n'en est pas forcément plus compréhensible, alors pour la majorité des utilisateurs de JQuery... :whistle:
D'autant plus que ce côté "ésotérique" est bien souvent volontaire.
juste pour ajouter mon grain de sel dans l'histoire..
Pour moi les deux principaux avantages de jquery sont :
- ne pas ré-écrire des fonctions existantes et probablement mieux écrites que ce que je pourrais faire moi même
- avoir un comportement très proche sur toutes les plateformes, y compris mobiles et tablettes tactiles (mis a part les soucis d'event click / touch, mais si j'ai bien compris ça devrait être pris en compte bientôt aussi)
Pour le coup du plugin payant, c'est une énorme arnaque déjà, car la majorité des plugins payants sont des plugins gratuits avec une couche de design en plus.. ou quelques fonctionnalités qu'on peut ajouter soi même quand on comprend ce qu'on utilise.. Payer pour un plugin jquery me semble absurde.. !
Pour la qualité du framework en lui même, je l'utilise depuis 6 ans environ et a chaque fois que j'ai cru a des bugs venant de jquery, c’était en fait moi qui l'avait commise, l'erreur.. Alors oui, on a plus de contrôle quand on fait du js "pur", mais qui peut se permettre de prendre 2 mois pour une application complexe en javascript qui serait faite en 1 semaine avec jQuery ? D'autant que ca n'a jamais empêché les bugs, voire même au contraire, vu qu'il faut vraiment tester chaque navigateur / système / plateforme
Enfin bon, il y a des avis assez tranchés ici.. En php par exemple, je ne suis pas fan de frameworks, même si je travaille en MVC et qu'en théorie, ils devraient me convenir.. Mais prenez le recul et constatez le magnifique travail de l’équipe de jquery.. En toute objectivité, c'est dur de prétendre que c'est nul !
Quant à l'optimisation.. Oui, on la maitrise plus en javascript classique.. Encore faut il suffisamment expert pour en tirer profit ! Et ca ne garantit rien du tout au niveau des performances et de la rapidité de l'application, que ce soit jquery ou javascript
En tout cas pour avoir pratiqué js depuis 1998, je peux vous affirmer que jquery c'est quand même une belle évolution pour les développeurs webs et un souffle d'air pour les graphistes ! c'est une dynamique intéressante, qu'on utilise ou pas l'outil !
Ah et comme je répondais aux messages ci dessus plutôt qu'au sujet lui même..
Avec html5 et les avancées du langage depuis quelques années, ca ne m’étonnerait pas tant que ca que js devienne un langage de plus en plus populaire.. le remplacement de flash est en cours, et ca ne s’arrêtera pas la.. !
Globalement je suis assez d'accord avec toi. Je te suggère de jeter un oeil à cette présentation d'Addy Osmani qui permet de travailler franchement sur l'aspect performances avec jQuery : http://addyosmani.com/jqprovenperformance/
Je pense que ça devrait t'intéresser
De toute façon, je n'ai jamais rencontré de vrai soucis de performances sur une application js.. Ou alors liés au navigateur..
Exemple sur le site sur lequel je travaille en ce moment, j'ai une page avec des chronomètres (suivi d'un match de foot, chrono global, chrono de possession des joueurs, chronos de temps de jeu, durée des mi-temps, etc..)
Le chrono est géré bien entendu avec la fonction setInterval, donc js pur, sans jquery
Au bout de 45 mn, chrome et firefox sont presque a 45 mn.. 44mn et quelques secondes.. Par contre IE n'est qu'a 41 ou 42 mn.. Le moteur d’exécution javascript me semble presque plus important que le script lui même, pour le coté perf !
C'est d'ailleurs pour ça que lorsque V8 sur le marché ils ont fait un massacre chez Google. Le gain en performances était si énorme...
Côté problème de performances, j'ai déjà travaillé sur l'élaboration d'applications web reposant sur un très gros socle JS et où tout passait par JS. Les ralentissements étaient fréquents, et le moindre gain possible était une bataille qui devait forcément être engagé.
De façon générale, la recherche de la performance ne doit pas être que pour une question de confort ou de fiabilité (genre l'appli trop lente à répondre qui fait rater des "rendez-vous") mais aussi pour une question d'écologie. Enfin c'est comme ça que je pense à titre perso. Une appli performante, même quand la performance atteinte n'était pas nécessaire, consommera moins en calculs et donc fera sûrement gagner aussi en consommation énergétique de la machine. Et la planète en a bien besoin.
Je savais que tu apprécierais ;)
Je crois que tu n'as jamais du coder de fichier de plus de 20 lignes de ta vie pour dire autant de *****.
Effectivement, pour les mini bout de code, tu peux t'amuser à faire du js pur et si tu utilises jquery tu auras autant voir plus de lignes en nombres.... sauf que tu n'auras du en écrire que quelques-unes toi-même et donc tu y auras passé 10 fois moins de temps pour un résultat aussi perfomant.
Tu parles de 50 mo puis de lib en giga .... jQuery fait 31 ko. Et non la lib n'est pas intégralement chargée sur chaque page, même sûr les smarphones, elle reste dans le cache, à mon que tu n'aies réglé le header expressement pour interdire le cache. Et si bien même tu avais un hebergeur mutualisé qui empeche le cache, tu peux lier la lib sur un lien externe comme le font beaucoup sur le site de google code par exemple.
Je n'ai non plus jamais vu jQuery faire planter une site, tout au mieux une mauvaise utilisation de jQuery faire planter le site, mais le gars incapable d'utiliser jQuery, fera encore plus d'erreurs en JS pur.
Enfin, ton anecdote n'a rien à voir avec jQuery, si tu vas sur des sites aux plugins douteux, merci de ne pas tout mélanger.
Bref, même si je reconnais que jQuery n'est pas l'outil indispensable, et d'ailleurs je ne l'utilise pas systèmatiquement, je n'ai vu aucun contre-argument valable dans ton paté. Dommage.
Bien entendu, on ne recode pas tout, à chaque fois... Quand on a un minimum de méthodologie et de généricité, on fait sa propre bibliothèque d'outils... ;)
Perso, en PHP, je développe mon propre modèle, le MVC ne me suffit plus.
Hum, je ne prétend pas être un expert en quoi que ce soit mais le JS est ma spécialité (surtout le DOM) et, oui, pour moi, la performance, c'est un point très important, je suis d'ailleurs totalement d'accord avec gwinyam.
Rien ne te permet de juger de mes réalisations alors que tu n'en as vu aucune, merci donc de t'abstenir de ce genre de réflexions.
Au pire, passe de temps en temps sur le chat...
Hé ben , ce sujet a vraiment enflammé la communauté ...
posté il y a presque un an , j'ai pu voir l'évolution des débats et des avis , je reviens donc un an après pour vous donner ( re ) mon opinion.
Je pense avoir pas mal d'expérience dans le monde du développement web et particulièrement en js ( plusieurs année en milieu pro et de modération sur DVP :ccool: ) après avoir commencé a développer sans aucunes librairie qui d'une part n'existaient pas à l'époque j'ai donc du apprendre et surtout COMPRENDRE les bases de ce langage qui je vous l'avoue m'est quelques fois sortit par les trous de nez ( surtout à la grande époque ie/firefox ( chrome n'était pas encore la ^^ )
puis les librairies sont arrivée ( jquery, scriptaculous ... ) et la ce fut le drame : "CHAMAIS HOOO GRAND CHAMAIS" je n'utiliserais ces choses qui ne me donne pas la main complètement sur ce que je développe !!!
Voila , ça c'était juqu'à il y a un an :oops: retour d'expérience :
J'ai commencé à m’intéresser vraiment à jquery et à son potentiel , non pas par effet de mode mais bien pour ses avantages plus nombreux que ses inconvénients
je n'épiloguerais pas ici car ce n'est pas le débat, mais je voudrais juste exprimer mon opinion sur le fait qu'il reste nécessaire pour un BON développeur de connaitre les bases du JS pour faire du développement performant et rapide ( ne serait-ce que pour débugger ;) ) et qu'un framework une fois maîtrisé sera un gain de temps plus que conséquent au final !
Bon courage à tous
Pour moi et au risque de paraitre intégriste : JQuery est absolument indispensable (ou Mootools si je ne l'utilisais pas, sinon Prototype par exemple).
Voici mes raisons :
Animations ? Ajax ? communication avec le serveur ? DragNDrop ? listes triables (sortables) ? JQuery fait tout ça
Composants UI pour des interfaces ? Jquery UI
(A noter que pour une vraie interface d'application je pars plutôt sur ExtJS ou du RIA via Silverlight ou Flex)
Validation de formulaire complexe ? les différents plugin en unobstructive sont vraiment bien. Il m'aurait fallut des heures pour faire ça à la main.. la tout est fait et manipulable facilement (perso j'utilise ValidationEngine systématiquement).
Une grille complexe ? JQgrid ... Pour les détracteurs, vous me direz combien de temps il vous faut pour refaire ça (sic).
Une table à présenter rapidement avec pagination et moteur de recherche ? DataTable
Utilisation sur téléphone portable ? Jquery Mobile
Je n'ai pas le temps d'ouvrir un de mes projets pour faire une énumération exhaustive de tout ce que j'ai utilisé en JQuery mais il est clair qu'un framework ou librairie js est pour moi indispensable dans un dév HTML.
[Edit]
En bref, tout est ici ou presque : http://plugins.jquery.com/
J'ai oublié de parler des Carousel aussi... des menus ... Enfin bon y aurait quasiment un bouquin à écrire sur les composants les plus intéressants de jquery !
@stailer : d'accord avec toi sur la richesse des fonctionnalités proposées par jQuery, mais ceci n'est pas acceptable :
L'absolu, ce n'est pas ça ;)
Cela voudrait dire qu'il n'existe aucune page dont la version jQuery serait moins souhaitable que la version "sans", quel que soit le contexte.
Pour le cas de pages soit très simples soit avec une nécessité de performance extrêmement élevée, il me semble qu'on ne choisira ni jQuery ni aucune autre librairie JS. Pour l'apprentissage, la mise au point de prototypes, certains intranet, etc., pareil.
Que tu dises "très souvent, pour des projets professionnels conséquents", d'accord. Mais pas "absolument" ^^
Enfin bon, ce n'est évidemment pas pour dénigrer jQuery, mais de nombreux débutants peuvent tomber sur ce topic et lire ton message, après quoi leur "page vide type" servant de point de départ d'un projet contiendra un appel à jQuery, ce qui est une absurdité sans nom à mon avis ^^
Je dirais même plus qu'il y a même bien des cas où jQuery n'est pas nécessaire. Même Addy Osmani, l'un des devs de jQuery, dans la présentation que j'ai proposé un peu avant, dit lui aussi qu'il existe bien des cas où jQuery n'est pas nécessaire (avec exemples).
On s'est compris les gars... Si on doit spécifier à chaque fois à qui s'adresse le message que l'on écrit, pour quoi et comment je crois qu'on ne va plus compter nos heures sur le forum et je pense qu'on a en parti tous mieux à faire ;)
Donc évidemment NON Jquery n'est pas utile partout et n'importe comment, ça semble une évidence..
Bah oui mais tu sais bien qu'il y a toujours un ou deux casse-c******* en embuscade sur ce genre de sujet :mrgreen: mais on est effectivement d'accord sur le principal ;)
Et d'ailleurs... fort heureusement on ne compte déjà pas nos heures sur le forum :aie: (entre autres Bovino/Spacefrog/vermine/NoSmoking/Watilin/Willpower/andry.aime*/etc. les acharnés c'est pas ça qui manque :mrgreen:)
* tiens andry ça fait longtemps j'espère qu'il va bien :)
Juste pour partager un screen qu'on m'a demandé (le plantage lié aux faibles connexions, voir pièce jointe)
Sinon,pour ce qui est des facilités de jquery (sortables, etc.), n'êtes-vous pas capables de les coder vous-mêmes?
SpaceFrog en a fait sa propre version, à laquelle j'ai d'ailleurs ajouté ma version natsortable (par exemple) ~15-20min de boulot...
Le sortable n'était qu'un petit exemple et en partant de 0 + enregistrement ajax à chaque changement je ne pense pas qu'il y en ait pour 20 minutes.Citation:
Sinon,pour ce qui est des facilités de jquery (sortables, etc.), n'êtes-vous pas capables de les coder vous-mêmes?
SpaceFrog en a fait sa propre version, à laquelle j'ai d'ailleurs ajouté ma version natsortable (par exemple) ~15-20min de boulot...
Perso, pour faire cette fonctionnalité je pense que j'en ai pour 4h environ (une demi journée).
Mais ceci n'était qu'un petit exemple... tu mettras 15 minutes aussi pour faire un JQGrid ? (composant que j'utilise le plus, en backoffice).
Et pour les animations ?
Et tout le reste dont j'ai abordé le sujet ?
Tu es sur que ton code fonctionne sur l'ensemble des navigateurs ?
Et ça aussi en 15 minutes :aie:
stailer>
Regarde par toi-même... j'ai pas testé partout mais si le coeur t'en dit...
http://www.developpez.net/forums/d10...e/#post6198067
Perso, je développe tout, moi-même, en JS, certaines choses peuvent prendre plus de temps que d'autres, à faire, mais on ne le fait qu'une fois.
Perso, j'fais bien des animations XHTML+SVG, en JS pur.
Là, j'viens de faire un générateur de classes dynamiques, avec propriétés et méthodes privileged, private et public.
Franchement, j'vois pas à quoi JQuery me servirait...
Question : je peux voir le code de ce générateur ? Je suis curieux de voir comment tu gères ton private. ça m'intéresse, je n'ai pas trouvé jusqu'à maintenant de solution viable.
gwinyam> :)
Je dois encore travailler sa récursivité, ensuite, je pense le proposer à la FAQ, si tu veux, je t'enverrai un MP ;)
Tu parles encore de ton composant simpliste pour trier une liste... Pas d'un truc à la JQgrid ni même des autres sujets abordés dans ma réponse.Citation:
Regarde par toi-même... j'ai pas testé partout mais si le coeur t'en dit...
Je suis allé voir ton code.
Tu plaisantes ? y a au moins 100 lignes avec des boucles illisibles !!
Ton code ne fonctionne pas sous IE7
De plus, nous ne parlons pas de la même chose concernant les "sortable".
Pour moi ce sont des liste simples, avec drag n drop pour déplacer les éléments.
Ton exemple s'apparente à un DataTable... Désolé mais DataTable fais beaucoup plus de choses avec une seule ligne de code.
Pagination... Moteur de recherche.. pleinement customisable... On peut même ajouter des plugins dessus.
bref, pour moi ton code sert à rien, désolé.
[EDIT]
Ca se passe la : http://datatables.net/examples/
Et y en a pas pour 15 minutes à le refaire autant te le dire
ça me fera toujours autant marrer, les réflexions du genre :
Une seule ligne de code??? et, tout ce qu'il y a derrière la simple ligne que TU codes? :aie:Citation:
Ton exemple s'apparente à un DataTable... Désolé mais DataTable fais beaucoup plus de choses avec une seule ligne de code.
Si on part de cette idée, mon script tourne avec une seule ligne de code aussi :
natsortTable(document.getElementById('matable'));:mouarf:
Sauf que ton truc ne sert à rien, fonctionne pas partout et quitte à prendre un "truc" ben je préfère JQuery , UI et DataTable plutôt que ton "truc" qui finalement ne m'apporte aucune garantie tant au niveau de la qualité du code que de la portabilité et de l'évolution.
Je me vois pas perdre du temps à lire ton code pour une fonctionnalité aussi minime alors que JQuery (et datatable dans l'exemple) m'apportent des mises à jours et des fonctionnalités avancées : gratuitement.
Réveille toi ! Et arrête surtout la mauvaise foi, s'il te plait !
Ok, j'aurais dû le tester partout, avant de le poster... je le reconnais et corrigerai à l'occasion...
L'idée était d'apporter un plus à la solution précédemment proposée, simplement.
En revanche, aucune mauvaise foi de ma part, j'ai simplement pour principe que si je suis capable de faire un truc par moi-même, je le fais, sinon, j'apprends à le faire.
Perso, la principale chose que je n'aime pas, avec JQuery ou d'autres bibliothèques/frameworks, c'est le fait, dans mes travaux, de devoir y inclure des licences qui ne sont pas miennes et, ça, même la meilleure lib' au monde ne pourrait résoudre ce facteur.
Moi aussi à l'époque je faisais pas mal de trucs tous seuls... Mais en 6 ans tout à beaucoup évolué.
Dans la même année j'étais sous prototype et un peu scriptaculous... Mais avec l'arrivée de JQuery et Mootools ça a explosé. Tout est devenu plus facile. Les versions se sont enchainées et les développements pros ont demandé de plus en plus de technicité et d'ergonomie, pour des temps de dev toujours plus restreints (et le temps, c'est de l'argent).
Voilà pourquoi ton idée de faire par toi même est très courageuse mais malheureusement je pense un peu utopique pour développer rapidement une interface puissante avec tout ce que cela comprend.
Effectivement, je pense qu'il faut vivre avec son temps et employer les nouvelles technologies (ayant fait leurs preuves) même si nous ne sommes pas entièrement d'accord avec elles. ;)
Ceci dit, pour soutenir un peu Lcf.vs, là où il marque un point est la question des licences.
Je ne sais pas pour vous mais le fait est que ExtJS est bien plus avancé et bien plus fonctionnel que jQuery UI (sans retirer les qualités de jQuery UI bien entendu). Sauf que si je veux l'utiliser pour un projet commercial, je l'ai dans l'os, faut payer. Et ça c'est pas forcément possible. Même si à un moment donné, il faut quand même passer à la caisse.
mes 2 cents :
autant je trouve que jQuery est dans bien des cas vraiment utile pour coder plus rapidement un site (par exemple la gestion du dom) sans qu'il n'y ai de réelle critiques à lui faire.
autant je vois jQuery UI totalement différemment, comme un option pour les sites vites faits.
Mouuuais... Mais si tu fais un projet commercial pour lequel une licence à 300€ maxi rend cette techno peu ou pas rentable pour toi c'est qu'il y a un souci.Citation:
Extjs : Sauf que si je veux l'utiliser pour un projet commercial, je l'ai dans l'os, faut payer.
Une fois la licence développeur acheté tu peux distribuer tes applis autant que tu veux.
Admettons que dans le pire des cas tu as vendu 1 appli 2000 € (incohérent avec l'utilisation d'Extjs mais bon...) , tu as déjà gagné 700 €.
Par la suite tu vas surement vendre d'autres applis (sinon la aussi c'est incohérent avec l'achat d'une licence) : ce sera alors tout bénef pour toi.
Enfin imagine : tu as un client dont le projet n'utilise pas extjs... mais il veut une évolution. Par exemple le besoin implique une grille, assez puissante avec de l'édition en temps réel.
Pourquoi ne pas profiter d'avoir une licence ExtJS et intégrer dans son appli une Grid.
Tu n'es pas obligé de faire une appli full ExtJS.
Bref, à 300 € et si tu es un professionnel je vois pas à quel moment tu perds de l'argent avec un framework/composants qui va aussi loin.