Avec Visual Studio 2010 et le framework .net 4, Microsoft va fournir une nouvelle version d’ASP.NET qui apportera des nouveautés intéressantes pour les développeurs web.
1 WebForms
1.1 Optimisation du ViewState.
Le ViewState est un champ caché qui est ajoutée dans le code source HTML des pages générées par ASP.NET. Chaque contrôle présent dans la page lui ajoutant ses propres informations, le ViewState peut vite devenir imposant.
Jusqu'à présent, pour diminuer la taille du ViewState, nous avions très peu de possibilités : soit le désactiver sur toute la page, ce qui pouvait empêcher certains contrôles de fonctionner correctement lorsqu'ils en ont besoin, soit le désactiver uniquement sur les contrôles qui n'en ont pas besoin, ce qui est fastidieux si un seul contrôle l'utilise.
Dans cette nouvelle version, on pourra activer le ViewState sur un seul contrôle sans avoir besoin de l’activer sur toute la page. Prenons un exemple simple :
Sur une page, nous avons un label, un bouton qui modifie le texte du Label par un postback, et un autre bouton qui fait un simple postback.
<form id="form1" runat="server">
<div>
<asp:Label ID="lbExample" runat="server"
Text="Texte original"></asp:Label>
<asp:Button ID="btUpdate" runat="server"
Text="Changer le texte" onclick="btUpdate_Click" />
<asp:Button ID="btRefresh" runat="server"
Text="Raffraichir la page" onclick="btRefresh_Click"/>
</div>
</form>
Cet exemple a besoin du ViewState pour fonctionner : si on clique sur btUpdate, le texte du label est changé. Si on clique sur btRefresh, le texte du label est récupéré du ViewState. S’il n’est pas présent, la valeur par défaut sera affichée. On a donc notre ViewState activé sur tous nos contrôles alors qu’un seul en a besoin. Pour l’alléger, on devait ajouter EnableViewState="false" sur chacun de nos contrôles qui n’en avait pas besoin ; avec cette version 4 on peut utiliser le ViewStateMode : au niveau de la page on le désactive, ce qui va le désactiver sur tous les contrôles présents dans la page. Ensuite, il suffit de l’activer uniquement sur le contrôle qui en a besoin (le label) :
Code behind :
protected void Page_Load(object sender, EventArgs e)
{
ViewStateMode = ViewStateMode.Disabled;
}
Page aspx :
<form id="form1" runat="server">
<div>
<asp:Label ID="lbExample" runat="server"
Text="Texte original" ViewStateMode="Enabled"></asp:Label>
<asp:Button ID="btUpdate" runat="server"
Text="Changer le texte" onclick="btUpdate_Click" />
<asp:Button ID="btRefresh" runat="server"
Text="Raffraichir la page" onclick="btRefresh_Click"/>
</div>
</form>
1.2 Web.config allégé
Tout comme pour le ViewState, l’idée est d’alléger le code (coté serveur cette fois). Au fur et à mesure des versions d’ASP.NET, de nouvelles options s’ajoutaient, qui ont fini par rendre le fichier web.config très long et difficile à lire. Toutes ces options seront intégrées dans le machine.config de .NET 4, et n’auront donc plus à être présentes dans le web.config tant que vous laissez les valeurs par défaut. Lorsque vous créerez vos applications ASP.NET, le web.config devrait donc ressembler à ça :
<?xml version="1.0"?>
<configuration>
<system.web>
<compilation debug="true" targetFramework="4" />
</system.web>
<system.webServer>
<modules runAllManagedModulesForAllRequests="true" />
</system.webServer>
</configuration>
1.3 Réécriture d’url avec le Routing MVC
Avec ASP.NET MVC, un module de routing a été créé afin de pouvoir associer les url à des actions : une url ne pointe pas vers un fichier, mais est interprété comme une liste de paramètres à passer à une méthode.
Ce système va être intégré à ASP.NET et ne sera plus réservé à MVC ; l’objectif est de pouvoir se baser dessus afin de faire de la réécriture d’url. Au lieu d’avoir une page avec une url de type
http://monsite.com/mapage.aspx?categorie=news&id=42
le visiteur verra une adresse qui pourra ressembler à :
http://monsite.com/news/42
Ceci a plusieurs avantages, dont une meilleure indexation par les moteurs de recherche, et une structure du site plus compréhensible pour les visiteurs.
1.4 Client ID personnalisables
Cette nouveauté ne paye pas de mine, mais elle montre une fois de plus la volonté de Microsoft, avec cette nouvelle version d'ASP.NET, de pousser les développeurs web vers le JavaScript.
En effet, pour pouvoir faire interagir les contrôles serveur avec du code javascript, il faut connaitre l'identifiant client du contrôle.
Le soucis, c'est que l'identifiant est généré par ASP.NET est souvent compliqué, ce qui nous oblige à faire passer l'id client au script par du code serveur.
Dans ASP.NET 4, on pourra choisir comment l'identifiant client sera généré, grâce à une nouvelle propriété ClientIDMode, qui pourra prendre 3 valeurs :
- Legacy : mode par défaut, qui garde le fonctionnement actuel
- Static : l'identifiant client sera le même que l'id serveur. On pourra directement utiliser l'identifiant dans les scripts JavaScript
- Predictable : pour les contrôles contenus dans un ITemplate, l’id sera généré en fonction du nom du conteneur, de la propriété ClientIDRowSuffix, et de l’index de la ligne. Cette fois encore, le but est d’avoir un identifiant facile à utiliser en JavaScript.
Exemple :
On utilise une page avec une Master Page, qui contient un Label :
<asp:Content ID="Content2"
ContentPlaceHolderID="ContentPlaceHolder1" runat="server">
<asp:Label ID="lbTestId" runat="server">
TestId</asp:Label>
</asp:Content>
Voici le code généré :
<span id="ctl00_ContentPlaceHolder1_lbTestId">TestId</span>
Si on veut pouvoir accéder au span en JavaScript, on préfèrera avoir un identifiant plus simple. Pour cela, on va donc mettre le ClientIDMode à Static :
<asp:Label ID="lbTestId" runat="server"
ClientIDMode="Static">TestId</asp:Label>
Et on obtiendra un code html plus propre :
<span id="lbTestId">TestId</span>
1.5 Support des langages dynamiques
Visual Studio 2010 va apporter le support de langages dynamiques, tels que IronPython et IronRuby. Certaines opérations qui seraient faites à la compilation par un langage statique ne seront faites qu’à l’exécution lorsqu’on utilise un langage dynamique. Par exemple, en C# les types de nos objets sont déterminés à la compilation, alors qu’avec un langage dynamique il sera déterminé à la compilation ; ce qui apporte une certaine souplesse.
Si jusqu’à présent les langages dynamiques n’étaient pas supportés par ASP.NET, ça sera enfin le cas dans sa version 4. Le langage IronPython est déjà supporté en version beta, et IronRuby sera bientôt disponible.
2 ASP.NET Ajax
Avec ASP.NET Ajax 4.0, on sent une réelle volonté de Microsoft de pousser l'usage du JavaScript.
Alors que la première version d'ASP.NET Ajax, avec son UpdatePanel, permettait aux développeurs de faire de l'Ajax sans avoir à écrire de code javascript, cette fois les nouveautés sont coté client, avec pour but de simplifier le codage javascript.
Les nouveautés d’asp.net Ajax 4 ne sont donc pas des contrôles serveurs comme on en a l’habitude, mais des fichiers javascript à référencer dans nos pages web.
2.1 Client Template Rendering
Avec les client templates, Microsoft nous propose un équivalent en JavaScript des Repeaters. Pour définir un template, il suffira de donner la classe « sys-template » à un élément HTML, et son contenu sera alors considéré comme un template, qu’on pourra binder à une source de données.
On peut tout simplement définir un tableau JavaScript :
<script type="text/javascript">
var animaux = [
{ Name: "Lapin", Description: "Il est mignon comme tout" },
{ Name: "Chien", Description: "Il aboie sur les facteurs" },
{ Name: "Dragon", Description: "Il vole et crache du feu" }
];
</script>
Et ensuite binder ce tableau sur notre template :
<body xmlns:sys="javascript:Sys"
xmlns:dataview="javascript:Sys.UI.DataView">
<ul id="list" class="sys-template" sys:attach="dataview"
dataview:data="{{ animaux }}">
<li>{{ Name }} - {{ Description }}</li>
</ul>
</body>
Ceci nous créera dynamiquement un <li> pour chaque élément du tableau :
Si ici nous attachons nos données directement au chargement de la page, il est tout à fait possible de le faire en JavaScript à l’aide de la fonction set_data :
$find("list").set_data(data);
Ceci nous permet de créer dynamiquement un tableau avant de faire le binding, ou bien de faire un appel Ajax pour récupérer des données à afficher depuis le serveur.
2.2 Ajax Content Delivery Network
Microsoft a annoncé la disponibilité de son Ajax Content Delivery Network : un CDN est un ensemble de serveurs qui servent à fournir du contenu. Ces serveurs proposent des librairies JavaScript, que vous n’aurez donc plus besoin d’inclure dans votre site web.
Utiliser le CDN au lieu d’héberger soi même ces librairies va permettre d’avoir de meilleurs temps de réponse chez les utilisateurs. En effet, en allant chercher ces fichiers sur les serveurs de Microsoft, la bande passante de votre serveur est économisée ; et si l’utilisateur est déjà précédemment passé sur un site référençant le même fichier, il n’aura même pas besoin de le télécharger.
Les librairies proposées à l’heure actuelle sont les dernières versions d’ASP.NET Ajax, de jQuery et du plugin de validation jQuery ; d’autres viendront peut-être s’ajouter avec le temps. La liste des fichiers disponibles est disponible à l’adresse suivante :
http://www.asp.net/ajax/cdn/
Pour utiliser ce CDN, c’est totalement gratuit et sans besoin de s’enregistrer préalablement. Il suffit de référencer directement le fichier JavaScript que l’on souhaite comme on référence n’importe quel JavaScript :
<script src="http://ajax.Microsoft.com/ajax/jQuery/jquery-1.3.2.min.js"
type="text/javascript"></script>
Le ScriptManager d’ASP.NET 4 permettra aussi d’utiliser le CDN au lieu d’utiliser ses propres scripts, grâce à une nouvelle propriété « EnableCDN ».
3 Conclusion
Nous avons fait un tour rapide des nouvelles fonctionnalités qui devraient arriver avec la nouvelle version d’ASP.NET. Les WebForms sont maintenant considérées comme une technologie mûre, ce qui explique le peu de grands changements, mais elle ne laissait que peu de place au JavaScript. Ce n’est plus le cas dans cette nouvelle version, avec une nouvelle librairie Ajax et l’intégration de jQuery, il sera beaucoup plus simple de créer des sites dynamiques coté client, avec ou sans Ajax.
Nous pouvons aussi noter qu’à coté d’ASP.NET 4 Microsoft développe ASP.NET MVC, une nouvelle technologie de développement de sites web basée sur le pattern Modèle-Vue-Contrôleur, ainsi que Dynamic Data, un modèle de site web destiné à créer un back-office très simplement.