Un petit exemple alors...Envoy� par ernestrenan
Code jQuery
En vanilla JavaScript, tu serais oblig� :
Code : S�lectionner tout - Visualiser dans une fen�tre � part
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� ?
Pas de question technique par MP !
Tout le monde peut participer � developpez.com, vous avez une id�e, contactez-moi !
Mes formations video2brain : La formation compl�te sur JavaScript � JavaScript et le DOM par la pratique � PHP 5 et MySQL : les fondamentaux
Mon livre sur jQuery
Module Firefox / Chrome d'int�gration de JSFiddle et CodePen sur le forum
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.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.
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 css
Code : S�lectionner tout - Visualiser dans une fen�tre � part (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
Derni�re modification par Invit� ; 17/10/2011 � 22h45.
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/
Blog
Sans l'analyse et la conception, la programmation est l'art d'ajouter des bogues � un fichier texte vide.
(Louis Srygley : Without requirements or design, programming is the art of adding bugs to an empty text file.)
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...
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.
Blog
Sans l'analyse et la conception, la programmation est l'art d'ajouter des bogues � un fichier texte vide.
(Louis Srygley : Without requirements or design, programming is the art of adding bugs to an empty text file.)
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) 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 anretour 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
Partager