Bonnes Pratiques Web & Cloud

« Alors que l'enquête est toujours en cours, nous avons décidé que le maintien de notre propre infrastructure git est un risque de sécurité inutile, et que nous arrêterons le serveur git.php.net. Au lieu de cela, les référentiels sur GitHub, qui n'étaient auparavant que des miroirs, deviendront canoniques. Cela signifie que les modifications doivent être transmises directement à GitHub plutôt qu'à git.php.net.

Stylesheets are often a major pain when merging versions as they tend to grow very large and have to be changed often by different people. Instead of putting your entire style definition in one file, consider splitting your stylesheet into many smaller files. A good strategy is to put your global style elements in a global stylesheet (e.g. ‘global.css’ or ‘common.css’) and your page-specific style elements into separate files (e.g. ‘customerview.css’ or ‘logoff.css’). In the head of your HTML file, you can do something like:

This approach will require you to consider which styles are global and which are page-specific, but it seems to me like this is a good thing to be aware of anyways. There are further advantages:

• Less bandwith used by visitors: By splitting up your stylesheets, visitors don’t have to download all the style definitions. Instead, they only download what they need. The browser will cache further calls, but the initial download will be quite a bit faster if a combined stylesheet is very large;
• Easier to maintain: Smaller stylesheets are a lot easier to maintain, as long as they are carefully grouped and split. It’s good to think about how to split up your stylesheets, because it gives you a more abstract understanding of which styles are needed where;
• Easier to comprehend: Whenever I run into a very big stylesheet, I often feel inclined to just add my style element somewhere at the bottom of the stylesheet (you’re probably doing this as well ;). It takes a lot of time to comprehend the entire stylesheet and find the best place to insert my own style. But this is a bad practice. Smaller stylesheets make it a lot easier to comprehend what’s going on. If you are adding a page-specific style, put it in the page-specific stylesheet. Put your global style elements into your global stylesheet;

If you are using MVC4, make sure to check out the cool new bundling and minification features. You can use this feature to create bundles of stylesheets and script files and also minify them while you’re at it. If you are using WebForms or another framework, you can consider Cassette. But it’s not hard to build your own framework. You can make a common handler like ‘stylesheet.aspx’ that takes the pagename as a parameter. Within the handler, you can load the global css and the page-specific stylesheet(s) and combine them into one file. You can even add your own minification logic. It’s not very hard to do something similar with a StyleController in MVC1, MVC2 or MVC3 or even with HTTP modules.

Javascript files will often give you headaches comparable to those induced by merging stylesheets. In sticking to the principle of keeping your files small, also consider splitting up your javascript files. Javascript files tend to bloat even more than stylesheets. Instead, put global javascripts in a global.js and page-specific scripts or handlers in page-specific scripts. You can do something like this:

The same advantages apply as splitting up your stylesheets. You can also use the MVC4 bundling and minification feature for this or Cassette.