Vous recherchez des conseils généraux et / ou des pensées ...
Je crée ce que je pense être plus d'une application Web, puis une page Web, car je l'intention d'être comme une application Gmail où vous quitteriez la page ouverte toute la journée pendant que vous obtenez des mises à jour "poussées" à la page. (Pour l'intéressé, j'utilise la technique de programmation Comet). Je n'ai jamais créé de page Web avant c'était si riche en Ajax et JavaScript (je suis maintenant un grand fan de JQuery). En raison de cette heure et de temps lorsque je mettez en œuvre une nouvelle fonctionnalité nécessitant une modification dynamique de l'interface utilisateur que le serveur doit savoir, je suis confronté à la même question:
1) Dois-je faire tout le traitement sur le client en JavaScript et poster le plus petit possible via AJAX ou 2) Devrais-je publier une demande au serveur via Ajax, faites-le faire tout le traitement, puis renvoyer le nouveau HTML. Ensuite, sur la réponse AJAX, je fais une simple affectation avec le nouveau HTML
J'ai été enclin à toujours suivre n ° 1. Cette application Web que j'imagine peut être assez bavarde avec toutes les demandes Ajax. Ma pensée est de minimiser autant que possible la taille des demandes et des réponses et s'appuie sur l'amélioration continue des moteurs JavaScript pour faire autant que possible les mises à jour de la transformation et de l'interface utilisateur. J'ai découvert avec JQuery, je peux faire tellement de choses sur le côté du client que je n'aurais pas pu faire très facilement auparavant. Mon code JavaScript est vraiment beaucoup plus grand et plus complexe que mon code serveride. Il existe également de simples calulcations que je dois jouer et j'ai également poussé que le côté du client aussi.
Je suppose que la principale question que j'ai est, devrions-nous toujours efforcer le traitement du côté client sur le traitement latéral du serveur dans la mesure du possible? J'ai toujours senti que moins le serveur doit gérer le meilleur pour l'évolutivité / la performance. Laissez la puissance du processeur du client faire tout le travail acharné (si possible).
pensées?
9 Réponses :
Bien sûr, cela dépend des données, mais une majorité du temps si vous pouvez pousser le côté client, faire. Rendre le client faire plus de traitement et utiliser moins de bande passante. (Encore une fois, cela dépend des données, vous pouvez entrer dans des cas que vous devez envoyer plus de données sur le côté de la clientèle informatique).
Dans mon cas, les données envoyées Accross ne seront plus jamais plus pour le faire du côté client. Dans la plupart des cas, tout ce que je dois faire, c'est d'envoyer quelques centaines d'octets au maximum, et sur la base de ces données, le client peut reconstruire la pièce d'interface utilisateur nécessaire. Bien sûr, cela complique considérablement le Javascript considérablement (JQuery le rend raisonnable), mais si je l'ai fait du côté serveur, la réponse Ajax pourrait être des milliers d'octets ..
Le site sera plus réactif et améliorera mieux plus vous pouvez pousser au client. Le code côté client présente ses propres problèmes, avec des choses comme des tests d'unités, de la sécurité, etc., mais c'est définitivement la voie à suivre si possible.
Je suis d'accord avec vous. Pousser autant que possible aux utilisateurs, mais pas trop. Si votre application ralentit ou même pire bloque leur navigateur, vous perdez.
Mon conseil est de tester en réalité les actes de votre application lorsqu'ils sont allumés pour toute la journée. Vérifiez qu'il n'y a pas de fuite de mémoire. Vérifiez qu'il n'y a pas de demande AJAX créée toutes les demi-seconde après avoir travaillé avec demande pendant un moment (les minuteries de JS peuvent être une douleur de temps en temps).
En dehors de cela, n'effectuez jamais la validation d'entrée utilisateur avec JavaScript. Toujours le dupliquer sur le serveur.
Utilisez jQuery Liaison en direct . Il vous fera économiser beaucoup de temps lorsque la réduction du contenu généré et rendra votre architecture plus claire. Malheureusement, quand je développais avec jQuery, ce n'était pas encore disponible; Nous avons utilisé d'autres outils avec le même effet.
Dans le passé, j'ai également eu un problème lorsqu'une première génération de pièces à l'aide d'Ajax dépend d'une autre génération de pièces. La génération d'une première partie première et deuxième partie secondaire rendra votre page plus lente comme prévu. Planifiez ceci devant. Développez des pages afin qu'elles aient déjà tout le contenu lorsqu'ils sont ouverts.
Aussi (concernant des pages simples aussi), conservez le nombre de fichiers référencés sur un serveur bas. Rejoignez JavaScript et des bibliothèques CSS dans un fichier sur le côté serveur. Gardez des images sur l'hôte distincte, de meilleurs hôtes distincts (créant un seul domaine de troisième niveau fera trop). Bien que cela vaut la peine de la production; Il rendra le processus de développement plus difficile.
La grande chose est qu'il n'y a pas de minuterie JS utilisé. Aucun interrogation du tout. Il est intéressant de voir à quel point le moteur JS de Chrome de Fast est comparé à d'autres navigateurs ... Les choses semblent se produire instantanément sur chrome, mais vous pouvez réellement regarder les choses se produire parfois dans Firefox (en fait pas une mauvaise caractéristique)
Certaines choses comme des contrôles de sécurité doivent toujours être effectuées sur le serveur. Si vous avez un calcul qui prend beaucoup de données et produit moins de données, mettez-le également sur le serveur.
Incidemment, saviez-vous que vous pouviez exécuter JavaScript sur le côté serveur, rendu des modèles et frapper des bases de données? Découvrez le JOINJS écosystème.
Il pourrait également y avoir des problèmes de support croisée croisée. Si vous utilisez un navigateur croisé, une bibliothèque latérale client (p. Ex. JQuery) et vous pouvez gérer tout le traitement dont vous avez besoin, vous pouvez laisser la bibliothèque en prendre soin. La génération de navigateur inter-navigateur HTML Server peut être plus difficile (tendance à être plus manuelle), en fonction de la complexité du balisage.
Il existe plusieurs considérations lorsque vous décidez si de nouveaux fragments HTML créés par une demande AJAX doivent être construits sur le côté serveur ou client. Certaines choses à considérer:
performance. Le travail que votre serveur doit faire est de ce que vous devriez vous préoccuper. En faisant plus du traitement du côté du client, vous réduisez la quantité de travail que le serveur effectue et accélère les choses. Si le serveur peut envoyer un petit morceau de JSON au lieu de fragment géant HTML, par exemple, il serait beaucoup plus efficace de laisser le client le faire. Dans des situations où il s'agit d'une petite quantité de données envoyées de toute façon, la différence est probablement négligeable.
lisibilité. L'inconvénient de générer un balisage dans votre JavaScript est qu'il est beaucoup plus difficile de lire et de maintenir le code. L'intégration HTML dans les chaînes citées est désagréable de regarder dans un éditeur de texte avec la coloration de la syntaxe définie sur JavaScript et effectue une modification plus difficile.
séparation des données, présentation et comportement. Dans le sens de la lisibilité, la présence de fragments HTML dans votre JavaScript n'a pas beaucoup de sens pour l'organisation du code. Les modèles HTML doivent gérer le balisage et JavaScript doivent être laissés seuls pour gérer le comportement de votre application. Le contenu d'un fragment HTML étant inséré dans une page n'est pas pertinent pour votre code JavaScript, juste le fait qu'il est inséré, où, et quand.
J'ai tendance à se pencher davantage pour renvoyer des fragments HTML du serveur lors de la gestion des réponses AJAX, pour les raisons d'organisation de la lisibilité et de code que je mentionne ci-dessus. Bien sûr, tout dépend de la manière dont votre application fonctionne, comment le traitement intensive des réponses AJAX est et la quantité de trafic que l'application reçoit. Si le serveur doit faire des travaux importants pour générer ces réponses et causer un goulot d'étranglement, il peut être plus important de pousser le travail au client et de renoncer à d'autres considérations.
bons points sur la lisibilité et la séparation. J'ai commencé à vous inquiéter parce que mon JavaScript cherche assez moche avec des fragments HTML et évanouis des citations sur le lieu.
Vous pouvez maintenir la lisibilité de votre code à l'aide de XSLT pour transformer XML en HTML sur les clients. Étant donné que les documents XSL deviennent mis en cache, il ajoute vraiment peu sur la tête. Bien sûr, vous pouvez uniquement transformer XML à l'aide d'un document XSL. Tous les grands navigateurs (y compris IE6) prennent en charge XSLT au client (bien que pas nécessairement via JavaScript pour les réponses AJAX). De toute évidence, il y a des moyens autour de cela, mais abriez les tests de compatibilité ajoutés.
Je travaille actuellement sur une jolie application de calcul de la situation actuelle et je rends presque tout cela sur le côté client. Je ne sais pas exactement ce que votre application va faire (plus de détails serait génial), mais je dirais que votre application pourrait probablement faire la même chose. Assurez-vous simplement que tout votre code associé à la sécurité et à votre base de données se situe sur le côté serveur, car ne pas le faire, vous ouvrirez des trous de sécurité dans votre application. Voici quelques directives générales que je suis:
Merci pour les conseils. Vous n'êtes pas étendu sur le commentaire "Cache Everythrihng"? Je n'ai pas d'expérience en utilisant la mise en cache du côté du client. Vous parlez de possibles plugins ou de variables globales simples?
Ce que je dis, c'est ne rien jeter. Si vous faites un tas de calcul, ne jetez pas les résultats des résultats ultérieurement; Gardez-les en mémoire pour la prochaine fois. Je ne parle pas d'utiliser des plugins, des variables simples ou autre chose, bien que vous puissiez utiliser le stockage côté client disponible dans les engrenages et la plupart des navigateurs.
Je n'utiliserais pas d'engrenages. Même s'il avait du battage médiatique parmi les développeurs. Ce n'est pas si populaire. Si vous avez vraiment besoin de stocker quelque chose entre les demandes, envisagez d'utiliser des cookies ou un stockage flash en raison de sa disponibilité supérieure.
@Sergej: Cela ne fait pas mal de vérifier pour cela, n'est-ce pas? Vérifiez simplement si l'utilisateur l'a installé et s'il n'est pas enfoncé. Je ne dis pas que vous devriez compter sur cela, utilisez-le simplement si disponible.
@Sergej: Je ne voudrais pas non plus dire des vitesses. Tandis que le plugin lui-même ne gagne pas beaucoup de traction, la même fonctionnalité (JavaScript multi-processus de sandbox, la mise en cache locale de fichiers via Manifest et SQL Store local) est en train d'être suggérées dans la spécification HTML 5 (l'iPhone l'a même mis en œuvre, et d'autres que je ne peut pas rappeler). Ainsi, si vous l'avez implémenté maintenant via le plugin, vous pouvez basculer plus tard.
J'ai récemment couru dans le même problème et j'ai décidé d'aller avec le traitement latéral du navigateur, tout a fonctionné très bien dans FF et IE8 et IE8 en mode 7, mais ... Notre client, utilisant Internet Explorer 7 a rencontré des problèmes, l'application Serait geler et une boîte de time-dense de script apparaîtrait, j'avais mis trop de travail dans la solution pour la jeter afin que je puisse passer une heure environ, optimisez le script et ajout de la sécurité dans la mesure du possible.
Mes suggestions?
Heureux d'avoir posté cette question. Obtenir beaucoup de bonnes suggestions et obtenir une confirmation sur mes pensées originales. Moi aussi, je suis une bonne croire que le serveur aussi simple et maigre que possible, mais à cause de cela, cela augmente la complexité sensiblement du code secondaire client. Cependant, JQuery a atténué cela énormément. Aussi j'aime utiliser le chef de travail de Chrome. Jusqu'à présent, ma session de chrome prend comme 20 Mo (Gmail est 50) et la CPU atteint 15 ans au point le plus lourd au cours de mes calculs itérateurs. Ça shoulod ne devient pas trop lourd d'ici, alors je pense que je vais bien.
DynaTrace a un excellent profileur (gratuitement!) Spécifique pour IE, vous pouvez voir exactement ce qui prend si longtemps, réseau, peinture, temps de script, il vous dira quelle ligne de javascript accrocher / être appelée 100 000 fois à 100 000 fois .. .Je suis recommandé de saisir une copie, cela m'a beaucoup aidé à résoudre les problèmes de performance IE. ajax.dynatrace.com
Ceci est possible, mais avec la forte page Intiale Charge && Heavy Utilisation de la mise en cache. Prenez Gmail comme exemple
Son intelligent pour diviser la charge de travail entre votre serveur et votre client.
Si vous pensez à l'avenir, vous voudrez peut-être créer une API pour votre application (communiquer avec des applications iPhone ou Android, laisser d'autres sites intégrer à la vôtre, vous devrez dupliquer un tas de code pour tous ces appareils si vous Allez avec une mise en œuvre du serveur Bare-Bones de votre application.
Je sais que ce post est vieux, mais il est arrivé haut sur Google quand j'ai fait une recherche.
Ce qui est vieux est nouveau et ce qui est nouveau est à nouveau vieux. :)