Zend FR

Consultez la FAQ sur le ZF avant de poster une question

Vous n'êtes pas identifié.

#1 02-07-2007 11:19:21

philippe
Administrateur
Lieu: Grenoble
Date d'inscription: 01-03-2007
Messages: 1624

MVC client en javascript

Ce message fait suite à une discussion parallèle sur le MVC client :
http://www.z-f.fr/forum/viewtopic.php?pid=1113

Contexte :
On parlait d'architecture d'application Ajax avec le ZF, j'ai indiqué ma solution pour faire de l'ajax, basé sur un framework MVC client en javascript. Fred Wolf me demandait ce que c'était que le modèle dans le MVC client.

Voilà ma conception du MVC client en javascript. Imaginons que l'objet que l'on manipule soit un formulaire (mise à jour de données client et l'évènement déclencheur soit le submit).
Vue
Le code HTML qui permet d'afficher les éléments

Modèle
Contient un tableau associatif "content" avec les données du formulaire et 4 fonctions :
- fromService : récupère les données depuis le serveur et les mets dans "content"
- toService : envoie les données de content vers le serveur (pour sauvegarde,...)
- fromUI : parcours le DOM du formulaire et construit la variable "content"
- toUI : prend le contenu de "content" et mets à jour le HTML

Controlleur
Le code javascript
- qui intercepte les évènements HTML (onclick, onchange,...)
- intercepte les évènements du modèle (onToService, onFromService...)
et en fonction de ces évènements fait les actions javascript qui vont bien (rafraichir une zone, faire une redirection vers la page suivante, renvoyer un message d'erreur, appeler une fonction du modèle,...).

Tout ce petit monde, c'est codé en javascript. La relation avec le serveur se fait avec les fonctions toService et fromService du modèle. La communication se fait en JSON entre des requêtes ajax et un controlleur particulier que j'ai décrit dans le message précédent.

A+, Philippe


twitter : @plv ; kitpages.fr : Création de sites internet à Grenoble et Paris

Hors ligne

 

#2 03-07-2007 11:11:30

fred wolf
Administrateur
Lieu: Bordeaux
Date d'inscription: 09-04-2007
Messages: 96

Re: MVC client en javascript

Ton approche est est super intéressante. Dans une version ultérieure, je voudrais déporter le plus possible de traitements vers le client. Ton architecture me semble trés solide.

Penses-tu qu'il est envisageable de ne renvoyer au client que des données codées en JSON et que le javascript se charge de mettre à jour la page ?

Quand je fais un profile de mon appli, la majeur partie du temps consommé est consacrée au rendu des templates par Smarty. En plus ça permettrait d'alléger la charge serveur.

J'imagine donc d'afficher une première fois ma page en html, puis les requêtes suivantes ne retourneraient que données, charge au Javascript de les dispatcher. Mais il ya tellement de cas différents que j'ai préféré dans un premier temps m'en remettre entièrement à retourner du HTML. Toutefois, j'ai bien séparé les traitements, ce qui me permettrait de basculer en douceur vers une délégation des traitements les plus lourds vers le côté client.

Ca te parait faisable de manière assez générique ?

Fred

Dernière modification par fred wolf (03-07-2007 11:18:45)

Hors ligne

 

#3 03-07-2007 11:17:34

philippe
Administrateur
Lieu: Grenoble
Date d'inscription: 01-03-2007
Messages: 1624

Re: MVC client en javascript

En fait la plupart des requêtes Ajax ne renvoient que des données en JSON. Le javascript fait ensuite ce qu'il veut de ces données (rafraichir un tableau, rediriger vers une autre page, rafraichir des données quelconques...).

Parfois j'ai quand même besoin de recevoir un code HTML, dans ce cas uniquement ça passe effectivement par smarty coté serveur, ensuite le code HTML est encodé en JSON aussi et renvoyé vers le navigateur (là encore le Javascript fait ce qu'il veut de la réponse...).

A+, Philippe


twitter : @plv ; kitpages.fr : Création de sites internet à Grenoble et Paris

Hors ligne

 

#4 03-07-2007 11:28:02

fred wolf
Administrateur
Lieu: Bordeaux
Date d'inscription: 09-04-2007
Messages: 96

Re: MVC client en javascript

Hombre, tu dégaines plus vite que ton ombre ! Déjà une réponse avant la fin de ma question...J'ai fait une erreur de manip j'ai posté avant d'avoir terminé.

Comment envisager le traitement javascript ? Une fois je renvoie des data à mettre dans des td, une autre fois dans des input (text, select, textarea) ou encore dans le href d'un lien. Le serveur doit-il détailler au client le container de chaque donnée ou le client peut-il s'appuyer par exemple sur le fichier js que tu mentionnais lors du premier chargement ?

Si j'ai bien compris ton principe, la partie vue de ton mvc, produit du html ? Un peu comme un moteur de templates côté client qui se chargerait de créer à la volée du html en le nourrissant avec les data retournée par le serveur ?


Fred

Hors ligne

 

#5 03-07-2007 17:47:20

capharnaeum
Membre
Date d'inscription: 03-07-2007
Messages: 14

Re: MVC client en javascript

Bonjour

je viens de lire cette discussion et mes félicitations pour cette vision ou version du MVC, je m'intéresse à beaucoup de patterns, le MVC étant le plus "frameworkisé", je ne comprends pas pourquoi il ne l'a pas été pour javascript, un début de réponse est que ce framework doit gérer complètement la page html, la librairie YAHOO UI pourrait être une très bonne base grace à son module de CSS GRID, EXT serait le must mais pas open source, dojo aussi pourrait être une bonne base avec ses widgets.

Bref je vois bien la création d'un framework javascript avec une vraie partie Vue que à partir d'une librairie très avancée sinon trop de code à retaper pour rien. Ce que je veux dire par là c'est que plus de template php ou cote serveur mais un systeme de template javascript, le serveur ne servirait qu'à réaliser des traitement "métier" ou "dao" et pour ajouter des fonctions avancées à javascript grace au serveur.

En tout cas c'est une très chouette idée, ça intéresse qui ?

Dernière modification par capharnaeum (03-07-2007 18:03:23)


Hacker vaillant, rien d'impossible !

Hors ligne

 

#6 04-07-2007 09:40:17

philippe
Administrateur
Lieu: Grenoble
Date d'inscription: 01-03-2007
Messages: 1624

Re: MVC client en javascript

Bonjour capharnaeum,

En fait ajax revient à faire des interfaces lourdes (du client-serveur). Donc on a des exemples complets et très propres de ce qu'on pourrait faire avec swing en java par exemple. Le problème est que javascript a des performances catastrophiques et une couche objet très pauvre. J'ai tendance à penser qu'il ne faut pas pousser le purisme trop loin.
Moi j'ai choisi une "micro-couche" MVC client de 2ko qui répond à mes besoins, mais sans aucun widget de base. Si tu veux des frameworks plus évolués, il y a effectivement Yahoo UI, les API Google, Dojo et Backbase qui proposent des frameworks en plus de leurs widget (il y en a sans doute d'autres...)

Fred,

Pour répondre à ta question :
- quand le serveur renvoie des données au modèle (au modèle javascript), le "content" du modèle est mis à jour. Ensuite on appelle la fonction toUI() qui injecte les données dans le code HTML. (On peut sous-classer ce modèle pour changer le contenu de toUI())
- Le toUI() met à jour le modèle en modifiant directement le DOM. Soit en changeant des values dans un formulaire soit en générant réellement de l'HTML (ajout d'un node dans un arbre par exemple...).

Ca ne pose aucun problème que le même service soit appelé par 2 modèles différents. Donc si tu veux afficher tes données différemment, tu peux créer un autre modèle et changer le toUI().

A+, Philippe


twitter : @plv ; kitpages.fr : Création de sites internet à Grenoble et Paris

Hors ligne

 

#7 04-07-2007 10:03:38

fred wolf
Administrateur
Lieu: Bordeaux
Date d'inscription: 09-04-2007
Messages: 96

Re: MVC client en javascript

Merci pour ces précisions, Philippe, ca m'a vraimpent l'air bien cette approche, en plus comme tu l'utilises déjà, j'imagine que c'est du solide.

Je m'y pencherai sérieusement dessus dès que possible.
.
A+,

fred

Hors ligne

 

#8 04-07-2007 10:11:31

fred wolf
Administrateur
Lieu: Bordeaux
Date d'inscription: 09-04-2007
Messages: 96

Re: MVC client en javascript

Tiens pour ceux qui veulent en savoir plus sur Javascript (je ne sais pas sis vous avez remarqué, mais ma spécialité c'est de parler une fois sur deux d'un truc qui n'a rien à voir avec le Framework....), c'est un site qui regroupe des videos comment dirais-je, éducatives, sur pleins de thèmes et notamment sur la programmation.
C'est un peu comme si vous étiez en formation :
Programming Video Education Lectures

fred

Hors ligne

 

Pied de page des forums

Propulsé par PunBB
© Copyright 2002–2005 Rickard Andersson
Traduction par punbb.fr

Graphisme réalisé par l'agence Rodolphe Eveilleau
Développement par Kitpages