Fichiers css et js : garder un minimum d'octets ou utiliser beaucoup d'espaces, de tabulations et de nouvelles lignes ?

Question

Quelle est la meilleure solution ?

1)

div#main {
    width: 100%;
    text-align: left;
}

2)

div#main{ //no whitespace before { sign
    width: 100%;
    text-align: left;
}

3)

div#main
{
    width: 100%;
    text-align: left;
}

4)

div#main {width: 100%; text-align: left;}

5)

div#main {
width: 100%; //no tab or whitespaces before width: 100%;
text-align: left; //no tab or whitespaces before text-align: left;
}

?

La même question se pose pour les fichiers .js. La raison pour laquelle je pose cette question est que moins il y a d'espaces (1 octet), de tabulations (1 octet) et de nouvelles lignes (2 octets), moins il faut de temps pour le télécharger sur l'ordinateur de l'utilisateur. Par conséquent, le site web se charge plus rapidement. Bien sûr, 200 octets ne sont pas si importants, mais qui se soucie de ce qui se trouve dans un fichier javascript ? Je veux dire que l'utilisateur préfère la vitesse, et non la conception correcte des fichiers javascript qu'il ne voit pas...

En tant que professionnel, que recommanderiez-vous à un débutant à propos des fichiers css et js ? Les fichiers php sont plus clairs, écrivez les fichiers php de manière à ce que n'importe quel programmeur puisse les lire et les modifier si nécessaire - avec des commentaires, etc.

Answer 1

Vous devez utiliser un Compresseur CSS et un JS Compressor et combinez vos fichiers.

Lorsque vous écrivez, faites ce qui est le plus facile pour vous, mais restez cohérent avec les principes suivants Normes de codage .

Answer 2

Je recommanderais d'écrire ce qui est le plus lisible, et d'utiliser ensuite une sorte de compresseur. J'utilise Compresseur YUI pour CSS et Compilateur de fermeture Google pour JavaScript. Si vous tenez vraiment à minifier votre page, vous pouvez également pngcrush tous vos PNG et minifier votre HTML/XML. (Je n'ai pas utilisé d'outil pour la minification HTML/XML, mais bien rangé peut le faire).

Answer 3

Choisissez ce qui sera le plus facile à mettre à jour à l'avenir, c'est-à-dire ce que vous trouverez le plus simple à déchiffrer.

Si vous travaillez avec d'autres personnes, tenez compte de la facilité de lecture et de compréhension qu'elles auront.

Si nécessaire, vous pouvez toujours minifier les fichiers avec quelque chose comme ceci : http://code.google.com/p/minify/

Answer 4

C'est à vous de choisir le type de style, mais vous devriez opter pour ce qui est le plus lisible au cas où d'autres personnes auraient besoin de lire votre travail. Dans un environnement de développement, vous ne devez pas vous préoccuper des espaces. Une fois que le fichier est prêt pour la production, vous devez utiliser un minificateur pour supprimer tous les espaces blancs.

Personnellement, je préfère.

div#main {
    width : 100%;
    text-align : left;
}

Answer 5

Bien évidemment le n°3 (jk... c'est une question de préférence). Si vous voulez vraiment minimiser votre empreinte, mettez vos js et css à travers un fichier minificateur