JQuery est disponible en téléchargement en deux versions, l’une en Production (19 Ko, Minified et Gzipped) et l’autre en Développement (120 Ko, Code non compressé) .
Maintenant, la version compacte de 19 Ko, si vous la téléchargez, reste un code javascript exécutable. Comment l'ont-ils compacté? Et comment puis-je 'minifier' mon code comme ça aussi?
Il existe une comparaison intéressante des compresseurs JavaScript que vous devriez jeter un coup d'œil.
BRICOLAGE Minification
Pas de minifier peut compresser correctement un mauvais code.
Dans cet exemple, je veux juste montrer combien une minifier.
Ce que vous devriez faire avant de vous rapetisser
Et concernant jQuery... je n'utilise pas jQuery.jQuery est pour les vieux navigateurs,il a été fait pour des raisons de compatibilité .. vérifier caniuse.com presque tout fonctionne sur tous les navigateurs (également ie10 est normalisé maintenant) , je pense que maintenant, c'est juste ici pour ralentir votre application web...si vous aimez l' $() vous devez créer votre propre fonction simple.Et pourquoi s'embêter à compresser votre code si vous avez besoin de télécharger le 100kb script jquery everythime?quelle est la taille de votre non compressé code? 5-6kb..? Sans parler des tonnes de plugins-vous ajouter pour le rendre plus facile.
Code D'Origine
Lorsque vous écrivez une fonction que vous avez une idée, commencer à écrire des trucs, et parfois vous vous retrouvez avec quelque chose comme le code suivant.Le code fonctionne.Maintenant la plupart des gens arrêtent de penser et les ajouter à un minifier et de le publier.
function myFunction(myNumber){
var myArray = new Array(myNumber);
var myObject = new Object();
var myArray2 = new Array();
for(var myCounter = 0 ; myCounter < myArray.length ; myCounter++){
myArray2.push(myCounter);
var myString = myCounter.toString()
myObject[ myString ] = ( myCounter + 1 ).toString();
}
var myContainer = new Array();
myContainer[0] = myArray2;
myContainer[1] = myObject;
return myContainer;
}
Ici iss le minifiés code (j'ai ajouté les nouvelles lignes)
Compacte à l'aide de (http://javascript-minifier.com/)
function myFunction(r){
for(var n=new Array(r),t=new Object,e=new Array,a=0;a<n.length;a++){
e.push(a);
var o=a.toString();
t[o]=(a+1).toString()
}
var i=new Array;
return i[0]=e,i[1]=t,i
}
Mais qui sont tous ces revendeurs à valeur ajoutée , les fi, les boucles et les définitions nécessaires?
La plupart du temps PAS de !
En OPTION (augmente la performance et la plus courte de code)
Math)while,for... pas forEach)"{}","()",";",spaces,newlines
Maintenant, si un minifier peut compresser le code votre de faire le mal.
Pas de minifier peut compresser correctement un mauvais code.
BRICOLAGE
function myFunction(a,b,c){
for(b=[],c={};a--;)b[a]=a,c[a]=a+1+'';
return[b,c]
}
Il fait exactement la même chose que les codes ci-dessus.
Performance
Vous avez toujours besoin de penser à ce que vous avez besoin de:
Avant de vous dire "Personne ne ferait d'écrire un code comme celui-ci, allez vérifier les 10 premières questions ici ...
Voici quelques exemples courants, je vois toutes les dix minutes.
Voulez réutilisables condition
if(condition=='true'){
var isTrue=true;
}else{
var isTrue=false;
}
//same as
var isTrue=!!condition
Alerte oui seulement si il existe
if(condition==true){
var isTrue=true;
}else{
var isTrue=false;
}
if(isTrue){
alert('yes');
}
//same as
!condition||alert('yes')
//if the condition is not true alert yes
Alerte oui ou non
if(condition==true){
var isTrue=true;
}else{
var isTrue=false;
}
if(isTrue){
alert('yes');
}else{
alert('no');
}
//same as
alert(condition?'yes':'no')
//if the condition is true alert yes else no
Convertir un nombre en chaîne ou vice-versa
var a=10;
var b=a.toString();
var c=parseFloat(b)
//same as
var a=10,b,c;
b=a+'';
c=b*1
//shorter
var a=10;
a+='';//String
a*=1;//Number
Arrondir un nombre
var a=10.3899845
var b=Math.round(a);
//same as
var b=(a+.5)|0;//numbers up to 10 decimal digits (32bit)
Étage d'un certain nombre
var a=10.3899845
var b=Math.floor(a);
//same as
var b=a|0;//numbers up to 10 decimal digits (32bit)
commutateur cas
switch(n)
{
case 1:
alert('1');
break;
case 2:
alert('2');
break;
default:
alert('3');
}
//same as
var a=[1,2];
alert(a[n-1]||3);
//same as
var a={'1':1,'2':2};
alert(a[n]||3);
try catch
if(a&&a[b]&&a[b][c]&&a[b][c][d]&&a[b][c][d][e]){
console.log(a[b][c][d][e]);
}
//this is probably the onle time you should use try catch
var x;
try{x=a.b.c.d.e}catch(e){}
!x||conole.log(x);
de plus si
if(a==1||a==3||a==5||a==8||a==9){
console.log('yes')
}else{
console.log('no');
}
console.log([1,3,5,8,9].indexOf(a)!=-1?'yes':'no');
les numéros de
1000000000000
//same as
1e12
var oneDayInMS=1000*60*60*24;
//same as
var oneDayInMS=864e5;
var a=10;
a=1+a;
a=a*2;
//same as
a=++a*2;
Quelques bons articles/sites que j'ai trouvé sur bit-à-bit/abrégée:
http://mudcu.be/journal/2011/11/bitwise-gems-and-other-optimizations/
http://www.jquery4u.com/javascript/shorthand-javascript-techniques/
Il y a aussi beaucoup de jsperf sites montrant les performances de la sténographie et bitwsie si vous recherchez avec votre favori searchengine.
Je pourrais aller pendant des heures.. mais je pense que c'est assez pour l'instant.
si vous avez des questions n'hésitez pas.
Et n'oubliez pas
Pas de minifier peut compresser correctement un mauvais code.
Prograide est une communauté de développeurs qui cherche à élargir la connaissance de la programmation au-delà de l'anglais.
Pour cela nous avons les plus grands doutes résolus en français et vous pouvez aussi poser vos propres questions ou résoudre celles des autres.
