Simple IT : le blog

Aller au contenu | Aller au menu | Aller à la recherche

jeudi 18 février 2010

En route vers le SdZv4

Le Site du Zéro a maintenant 10 ans. Les choses ont beaucoup évolué depuis 1999 sur le Web : on ne conçoit plus du tout des sites web de la même manière. J'ai eu la chance d'observer cette évolution au fil des années et d'en faire profiter progressivement le Site du Zéro.

Route

Que de changements entre la toute première version en HTML 4 lancée un après-midi alors au collège, et l'actuelle version 3 qui sert de base à un site fréquenté par 2 millions de visiteurs uniques par mois ! L'évolution majeure du site, comme certains d'entre vous le savent sûrement, est arrivée avec cette fameuse "v3" qui a été développée en grande partie par Pierre Dubuc (karamilo) aujourd'hui mon associé, ainsi que d'autres personnes qui y ont participé de près ou de loin et qu'on n'oublie pas : winzou, Duael, IAN, Venom, zaz et bien d'autres.

Depuis le lancement de la version 3 en novembre 2005 (lors d'un après-midi pluvieux depuis un appartement miteux à Londres), le site n'a jamais cessé d'évoluer bien au contraire. Les modules du site se sont sans cesse développés, ont été améliorés, transformés, et il en est allé de même pour le design du site. Ce sont pour la plupart des évolutions réalisées par une poignée de bénévoles courageux (que nous ne remercierons jamais assez) mais aussi depuis 2 ans par les développeurs en stage chez Simple IT ainsi que par Romain qui est notre premier développeur salarié depuis fin novembre 2009.

Bref, comme vous le voyez, tout ceci a une longue histoire et les choses se sont accélérées pour nous récemment. A tel point qu'il y a généralement 2 à 3 développeurs en continu sur le site (ce qui reste très inférieur à nos besoins, mais cela va évoluer). Or, le travail en commun avec différentes façons de développer finit par montrer progressivement ses limites.

Le SdZ-framework de la v3

C'est Pierre qui a posé les bases du framework actuel dès 2003 (le lancement de la v3 ayant pris 2 ans à l'époque). Sa structure MVC et sa conception intelligente qui se focalise sur les performances ont permis au site de supporter l'évolution fulgurante du site ces dernières années. Nous sommes en effet passés de 3-4000 visiteurs / jour à 70 000 visiteurs / jour, toujours avec le même framework de base. Parvenir à supporter 2 millions de visiteurs par mois avec seulement 2 serveurs en pratique (un frontal web et un sql) tient parfois du miracle, mais c'est pourtant ce que nous faisons.

Or, le monde du Web a évolué rapidement et on entend parler notamment des framework RAD (Rapid Application Development) que sont :

  • Ruby on Rails (un des pionniers)
  • Django
  • Symfony
  • CakePHP
  • etc.

Ces frameworks font la même chose que notre framework actuel : ils gèrent toute la base du site et délèguent les tâches spécifiques à des modules. Ils ont comme particularité d'être plus lourds et plus lents en général car ils rajoutent plusieurs couches d'abstraction, ce qui fait qu'on peut dire sans prendre trop de risques que le sdzframework est pour nous le plus rapide. Normal, il est spécifiquement adapté au SdZ.

Cependant, tous ces frameworks ont aussi de nombreux points forts pour lesquels le sdz-framework a clairement un train de retard. Parmi eux, les bonnes pratiques de développement tels que les tests unitaires et fonctionnels, des outils avancés de débuggage, des systèmes relationnel-objet (ORM), des systèmes de migration de données, de tâches, l'intégration native d'outils Javascript et AJAX, etc.

Si nous avons implémenté progressivement une partie de ces choses-là au fil du temps, le tout manque de cohérence par rapport aux frameworks connus. Il faut aussi compter le temps de formation des nouveaux stagiaires et employés à notre framework qui n'est pas toujours évident à comprendre au début. Et, bien que ce ne soit pas un prérequis, notre framework actuel n'est pas orienté objet et ne peut pas bénéficier de fonctionnalités telle que l'héritage (je rappelle que la v3 a été développée à l'époque de PHP 4, donc toute POO était exclue).

Evoluer vers une v4 pour plus de clarté

Nous ne fonçons pas forcément dans un mur avec la v3 maintenant, mais il est clair que si un jour nous arrivons à une dizaine de développeurs dans nos locaux voire plus (ce qui est probable), il risque d'être un peu tard pour se rendre compte que nos outils deviennent trop limités ou trop délicats à maintenir.

Nous avons donc entamé il y a quelques mois un début de réflexion autour de la possibilité de faire évoluer le site et de le porter sous un framework connu. Les intérêts de passer à ce type de framework open-source sont nombreux :

  • Il ne sera plus nécessaire de maintenir les fonctionnalités de base du site (système de sessions, de comptes, de cache, de requêtes ajax) et on pourra se concentrer sur ce qui est spécifique au site et donc faire évoluer plus rapidement le site.
  • Le framework étant connu et particulièrement documenté, nous n'aurons pas à maintenir de documentation propre au framework.
  • Par conséquent, la durée de formation des nouveaux développeurs sera réduite et nous pourrons annoncer dans nos offres de stage / emploi qu'il est nécessaire de connaître Symfony.
  • On disposera d'outils puissants pour retracer les erreurs et même les anticiper, ce qui limitera considérablement les risques de régression.

L'idée centrale est de se concentrer sur ce qu'on appelle le métier, c'est-à-dire sur ce qui est propre au site, tout en se reposant sur une architecture solide en laquelle nous avons confiance.

Quand vous décorez l'intérieur de votre maison, vous n'avez pas besoin de penser à la charge que doivent supporter les murs porteurs ou à la meilleure façon de plâtrer du béton ? Eh bien avec un site web, c'est exactement la même chose. On préfère passer du temps à aménager l'intérieur plutôt qu'à se préoccuper de choses qui ne sont pas notre métier. ;o)

Pourquoi Symfony ?

Symfony

Les frameworks de qualité sont nombreux, j'en ai cité quelques-uns plus haut. Il fallait faire un choix là-dedans, en considérant :

  • La "facilité" de migration (toute relative car ça reste complexe)
  • La communauté et la pérennité du projet
  • Son caractère open-source, un élément indispensable à nos yeux pour pouvoir "hacker" le framework au besoin et probablement proposer des retours pour l'améliorer.

Les frameworks tels que Ruby on Rails et Django ont donc été exclus d'office, car ils sont basés sur d'autres langages (Ruby et Python) ce qui aurait demandé une charge de travail beaucoup trop importante.

Parmi les frameworks PHP, c'est Symfony que nous avons retenu pour la qualité de sa documentation, son tutoriel Jobeet (et nous on aime ça les bons tutos !), sa pérennité (le projet est activement développé et maintenu) et ses références (Dailymotion est en train de passer à Symfony, forcément ça motive et ça encourage !).

La (très) délicate migration

Il ne suffit pas d'avoir la volonté, il faut encore s'organiser. A ce titre, j'ai eu la chance de rencontrer le génial vincent1870 (pardon pour tes chevilles vincent) qui est un des principaux développeurs du site des zCorrecteurs. Il se trouve qu'il s'intéresse beaucoup à Symfony et qu'il a depuis quelques temps une bonne vue d'ensemble du sdzframework. Il a ces derniers temps fait un travail remarquable pour adapter Symfony à nos besoins, trouver une méthode de migration réaliste et progressive et documenter cette méthode. Depuis peu, Romain l'a rejoint pour l'aider à adapter certaines sections spécifiques tels que les crons.

Beaucoup de choses ont déjà été faites sur une branche Git de développement du site. A l'heure actuelle, nous arrivons à poser les premières bases de Symfony et à le coupler au sdzframework. En effet, il est inconcevable de geler le développement du site pendant qu'on le porte vers Symfony (ce qui représente beaucoup de travail). Nous allons donc le faire module par module, progressivement, en gelant les modules un à un.

La migration vers Symfony prendra forcément du temps, on l'estime entre 8 et 12 mois, ce qui est conséquent. Nous pensons mettre en production les premières bases vers la fin de ce mois-ci. Le SdZ semblera être exactement le même, si ce n'est que c'est Symfony qui traitera la requête et qui la routera soit vers l'ancien framework si le module n'a pas été porté, soit vers Symfony lui-même si celui-ci a été porté. Un des premiers modules à être porté devrait être le livre d'or (choisi en raison de son extrême simplicité :-° ).

Quels changements ?

Pour les visiteurs, il n'y aura aucun changement au début (à part peut-être quelques curieux bugs de temps en temps, on ne pourra pas y échapper ^^ ). A terme, ils verront de nouvelles fonctionnalités plus régulièrement, le tout sera plus cohérent et il y aura moins de bugs.

Pour les développeurs, le changement sera énorme au niveau de la structure du code. A terme, le développement du site devrait être beaucoup plus rapide, beaucoup plus facile et beaucoup plus sûr. Mais nous n'en sommes pas encore là. ;o)

mardi 3 mars 2009

[Spoiler] Aperçu du futur design "New Wave"

Le bug tracker a été mis à jour cet après-midi avec 2 maquettes du projet New Wave. Vous pouvez les trouver à l'adresse suivante : http://bugs.siteduzero.com/versions/show/2

A cette adresse vous pouvez voir l'avancement du projet New Wave en temps réel, ainsi que le nombre de bugs et améliorations qui restent à effectuer avant la mise en ligne au public du projet. Cette mise en ligne est d'ailleurs prévue pour le 20 mars comme indiqué (sauf les retards, mais on va éviter :o).

Attention : il s'agit uniquement de maquettes. Le travail de développement XHTML / CSS de ces maquettes est en cours et n'est pas terminé (mais il est assez bien avancé). Notez que ces maquettes ne sont pas définitives, il y aura quelques changements dans la version finale que tout le monde pourra consulter. En particulier, le logo n'est pas du tout définitif (nous travaillons dessus) et certaines icônes (comme celles du menu) non plus. Dans l'ensemble vous avez néanmoins l'idée générale de ce que sera New Wave.

Les forums avec New Wave, version déconnecté :

Les forums avec New Wave, version connecté (pour les membres) :

Quelques infos en vrac (un peu comme la rubrique Trivia d'imdb.com ;o) :

  • Vous n'avez que les maquettes des forums pour avoir une idée du design global. Nous gardons pour nous les maquettes de l'accueil qui change d'ailleurs beaucoup. Allez quoi, vous saurez bien patienter encore un peu. ;o)
  • A l'origine, nous souhaitions faire un Bluzaz 3, c'est-à-dire un rafraîchissement du design par défaut actuel. Nous avions d'ailleurs proposé aux membres de brainstormer à ce sujet sur le forum graphisme, mais il nous est apparu évident que nous n'allions pas dans la bonne direction. Finalement, le projet Bluzaz 3 a été abandonné, et c'est de ses cendres qu'est né "New Wave", un projet plus ambitieux qui ne se contente pas de changer l'aspect graphique mais qui revoit aussi la disposition de l'ensemble des liens pour améliorer l'ergonomie du site.
  • Le projet New Wave trouve son origine en octobre 2008 mais ne démarrera réellement qu'à partir de décembre / janvier suite à quelques petits calages au démarrage.
  • C'est à Cam (ex-newser devenu développeur) que l'on doit la plupart du travail de ce design.
  • L'équipe du site ainsi qu'une équipe de designers ont également beaucoup participé à la critique du design au fur et à mesure de son évolution.
  • Le tout premier jet de Cam était TRES loin de ressembler à ce que vous voyez actuellement. En fait, il est resté longtemps abandonné jusqu'à ce que quelqu'un fasse remonter le sujet et me motive à demander à Cam d'effectuer la première d'une (longue) série de modifications.
  • Les maquettes du design New Wave ont été modifiées un très grand nombre de fois (plusieurs centaines probablement). Jamais auparavant nous n'avions autant brainstormé sur l'apparence et l'ergonomie du Site du Zéro. Chaque lien a été repensé, analysé, pesé, afin de déterminer son utilité et sa position adaptée.
  • En fait, le design du Site du Zéro n'avait pas autant changé depuis le passage de la v1 à la v2. C'est dire si nous avons mis du temps à remettre en question notre organisation et certains éléments discutables (comme le message aléatoire du livre d'or...).
  • New Wave conserve autant que possible l'accessibilité de Bluzaz 3, mais apporte un certain nombre d'améliorations que nous avions rechigné à mettre en place à l'époque du lancement de la v3 (comme le menu déroulant "Mon compte").
  • New Wave fait appel à la bibliothèque jQuery pour avoir une surcouche potable au Javascript de base. Cela facilite grandement nos développements.
  • Le code XHTML ayant grandement évolué, les anciens designs ne seront plus compatibles. Tous les visiteurs seront basculés vers New Wave lors de sa sortie.
  • Il sera toujours possible de réaliser des designs externes personnalisés et nous vous en donnerons les moyens. En revanche, nous ne souhaitons officiellement plus gérer qu'un seul design (New Wave) car cela demande trop de travail sinon. Nous avons fait les frais de la gestion de 20 designs simultanés et ne souhaitons plus recommencer ^^
  • L'onglet "Bientôt..." que vous voyez tout en haut à droite fait référence à un futur "sous-site" du SdZ, ayant trait à un autre domaine que l'informatique. Votre compte membre fonctionnera toujours mais ce sous-site aura ses propres forums, ses propres news, ses propres tutoriels. Plus d'informations à ce sujet... bientôt :p
  • La publicité fait son retour au format bannière (comme sur la v2). A ceci plusieurs raisons : le format skyscraper, très peu visible, a très peu d'efficacité (contrairement au pavé par exemple). Mais paradoxalement, on a réellement besoin de l'argent de la publicité. On préfèrerait qu'il n'y en ait pas, mais ça reste un pilier très important des revenus de l'entreprise dont on ne peut se passer. D'autre part, les annonceurs sont plus nombreux sur le format plus classique de la bannière, ce qui nous permettra d'en trouver plus facilement. A noter que ce n'est pas définitif, c'est un test, mais il est important pour nous de le faire.
  • New Wave doit marquer l'arrivée de la section "Articles" demandée par plusieurs membres depuis un moment. On considère désormais que la catégorie "Cours" est séparé en 2 sous-catégories "Articles" et "Tutoriels". Plus de détails prochainement.
  • Le design ne sera en fait pas totalement fini lorsqu'il sera présenté au public. Un certain nombre d'améliorations concernant l'ergonomie continueront à être effectuées lors de futures itérations (New Wave 1.1, etc). Nous projetons notamment de mettre en place une navigation bien plus agréable entre les catégories de cours.
  • L'icône des MP est la toute toute dernière modification effectuée sur la maquette. C'est une (bonne) idée de dernière minute de Sh4rk.
  • Sur New Wave, chaque couleur a été étudiée et a du sens. La couleur orange par exemple apparaît au survol des éléments (liens / speedbarre...).
  • La boîte en haut à droite où apparaît votre avatar est appelée la "logbox" entre les développeurs.
  • New Wave devrait diminuer grandement le nombre de fichiers CSS et d'images à charger sur chaque page. Une optimisation du cache sera notamment effectuée côté client pour éviter que vous ayez à effectuer trop de requêtes HTTP à chaque fois. Cela devrait diminuer notre usage de la bande passante.
  • Euh... on va arrêter là ^^

On y retourne, y'a du boulot ! ;o)