Compte-rendu de la session GSS

The GWT Open Source projet CSS3 meets GWT with GSS – Daniel Kurka & Julien Dramaix

Une belle session sur un petit nouveau chez ClientBundle : GSS Resources. Son nom vous fait penser à CSS Resource ? C’est normal, c’est son petit frère.

GSS Resource est là pour combler les manques et corriger les critiques faite à son prédécesseur. Cependant il ne le remplace pas, ils cohabiteront, même si cette nouvelle façon de gérer les CSS sera préférée à l’ancienne.

Mais pourquoi une nouvelle façon de gérer les styles?

Avouez que sur un projet important, avec une interface soignée, on se retrouve vite avec des feuilles de styles immaintenables. Les déclarations de couleurs sont répétées dans beaucoup de classes, les styles se ressemblent, ils sont souvent dupliqués, on ne sait jamais si on peut réutiliser un style créé par un autre ou s’il est préférable de refaire le sien.
Pour cela, GSS Resource apporte une première réponse. Il permet, dans la même idée que SASS ou LESS, d’organiser ses styles en créant des variables, fonctions et bien d’autres. Il est donc aisé de déclarer des variables représentant les couleurs dominantes, les polices pour les réutiliser.
Il est également possible de créer des méthodes qui généreront des CSS en fonction de paramètres fournis…

D’autre part, une critique souvent faite aux CSS Bundle de GWT est de ne pas être compatible avec la norme CSS3.
Ce sera chose faite avec GSS Resources qui s’appuie sur l’outil Google Closure Stylesheet. Une très belle démo nous a permis de nous rendre compte avec une implémentation full CSS d’un cube en 3D avec rotation et zoom. Une autre démo n’a laissé personne indifférent: donner un effet sur le chargement à la demande de données d’une liste lorsque l’on atteint le bas en scrollant. Des effet de rotation, fading et autres grace aux CSS3.

Il ne faut pas oublier que l’on parle bien là de la gestion de ressources via ClientBundle ! Sa syntaxe est donc aussi simple que CSS Resource.
Il profite donc également de la puissance du compilateur pour toutes les optimisations (pruning et autres…).
En parlant de compilateur… Et pourquoi ne pas aller plus loin et lui demander de nous vérifier notre code CSS ? C’est chose faite !
Oui oui, on n’aura plus à attendre l’executiuon et le débugage dans notre navigateur pour se rendre compte de nos fautes de frappes et autres erreurs de syntaxes ! Le compilateur analysera notre CSS et nous informera de toutes nos erreurs avec un message clair comme cela est fait pour le reste de notre code java.

Un dernier point, lorsque GSS Resources sera disponible dans GWT, Julien nous proposera un outil qui nous permettra de migrer nos CSS Resources. Un grand merci pour le gain de temps !

Auteur : Romain Hochedez (DNG Consulting)