Le véritable coût de Amélioration progressive

Original: http://blog.easy-designs.net/archives/the-true-cost-of-progressive-enhancement/


Publié par Aaron Gustafson le 01 Août 2013 | Lien permanent

Lorsque vous avez été évangélisé l’amélioration progressive pour aussi longtemps que nous avons, vous rencontrez toujours des sceptiques. Prenez ce commentaire sur le récent (et argumentée) poste de Tim Kadlec sur la conception des expériences qui fonctionnent sans JavaScript:


C’est bien beau, mais pas monde bien réel. Une analyse coûts-avantages doit se faire qu’est-ce que la prochaine coût utilisateur / visiteur, et plus vous gagnez important? Cette approche idéaliste laisserait plus le sou si elles devaient tenir compte de tous les utilisateurslors de la construction d’un site. C’est pourquoi les vêtements sont de petite, moyenne, large et extra large. La plupart d’entre nous doivent les acheter de cette façon car tout le monde ne peut se permettre un costume sur mesure, et encore moins une garde-robe. Votre approche ne fonctionne que pour ceux qui peuvent voir le retour.


La réponse de Tim était mort:


Je pense que c’est là la différence entre «soutien» et «optimisation» entre en scène. Je ne vais certainement pas dire à sortir et d’acheter tous les appareils sous le soleil, essai sur eux, faire en sorte que les choses se présentent et se comportent de la même. Vous n’avez pas nécessairement à optimiser pour tous ces différents dispositifs et scénarios (c’est là que l’analyse coût-bénéfice doit venir en), mais il n’est souvent pas beaucoup de temps pour au moins les soutenir à un certain niveau.

Amélioration progressive, vous pouvez obtenir un long chemin vers la réalisation de cet objectif. Parfois, c’est aussi simple que de faire quelque chose comme “couper la moutarde” pour exclure les anciens périphériques et navigateurs qui pourraient s’étouffer avancée JS d’avoir à essayer de régler ce problème. L’expérience n’est pas la même, mais si vous avez utilisé l’amélioration progressive de s’assurer que le balisage est solide et ne dépend pas le code JavaScript, c’est au moins quelque chose qui est utilisable pour eux.


J’ai eu des conversations similaires innombrables fois en personne, sur les appels de conférence, dans les commentaires de blog, et (bien sûr) sur Twitter. Parfois je peux gagner les sceptiques plus avec un argument philosophique raisonnée, mais souvent j’ai besoin de commencer à remplir numéros.

Chaque projet est différent, donc je suis souvent réticents à dire l’amélioration progressive coûte X.« C’est aussi partiel etparcelle de tout ce que nous faisons ici à Easy, il est donc condamné presque impossible de dire ce qu’est un projet coûterait sans amélioration progressive . Cela dit, nous avons fait cela assez longtemps pour avoir la peine de partager quelques histoires. Voici deux anecdotes de projets réels, nous avons travaillé.


Sauvegarde Off Du Bleeding Edge

Il ya quelque temps, nous avons construit une application Chrome pour WikiHow. Comme une application Chrome et un show-pièce pour la nouvelle app store, notre client voulu avoir de fantaisie animations CSS3 et transitions, les polices web, un WebDB back-end”, support déconnecté, et beaucoup d’autres cloches HTML5y et sifflets. Et, comme notre cible était un simple navigateur, nous a cédé lorsqu’on lui a demandé d’aller la seule page de l’application itinéraire. L’application a été conçue pour dégrader gracieusement (il a bloqué les navigateurs nonWebKit), mais il n’a pas été progressivement améliorée.

Aller de l’avant un an et notre client est retourné à ajouter le support pour Firefox et IE9 +. Oh boy.

Après avoir construit le site à titre purement WebKit, c’était un peu du défi. En plus des différences de mise en œuvre avec les fonctionnalités CSS expérimentales, nous avons également eu à traiter avec le DOM et JavaScript API variance entre les navigateurs. Mais le plus gros problème que nous avons rencontré a été le manque de soutien WebDB dans Firefox et IE. Vous voyez, dans l’année écoulée, WebDB avait été abandonné par le W3C car de refoulement (principalement à partir de Mozilla et Microsoft). Il n’était pas disponible dans les deux Firefox ou IE, pas plus qu’il ne sera jamais. Et IndexedDB, son remplacement, avait encore à être mis en œuvre dans n’importe quel navigateur production. Nous avons donc fini par écrire une enveloppe au-dessus de localStorage qui ressemblait beaucoup à SQL, qui nous a permis d’éviter la réécriture de la plus grande partie de l’application. Par coïncidence, il a également fait l’application beaucoup plus rapide.

Le coût total du nouveau projet de compatibilité était d’environ 40% du budget initial nécessaire pour construire l’application la première fois. Sans accès à une chronologie alternative, je ne peux pas en être certain, mais mon expérience me dit qu’il aurait ajoutée à moins de 40% dans le projet d’origine, nous avions donné la marge de manœuvre pour construire à l’aide de l’amélioration progressive. Et le résultat final aurait été encore mieux, car il aurait été en mesure de fonctionner sans JavaScript.

Basé sur d’autres conversations que j’ai eues avec les gens, le nombre de 40% semble assez précis; peut-être même un peu faible. Je me souviens d’une conversation que j’ai eue il ya six ou sept ans sur Google Maps. Lorsque l’équipe à l’origine construit Plansen tout de sa gloire Ajax-yils ne pas le rendre très accessible et nécessaire JavaScript. Selon la source (qui je l’ai oublié depuis longtemps), il leur a fallu près de deux fois plus de temps pour moderniser Cartes à ce qu’il aurait pris s’ils avaient construit en suivant l’amélioration progressive à partir du sol. Comme c’est purement anecdotique, vous devez prendre cela avec un grain de sel, mais c’est de la nourriture pour la pensée.

Le matériel de commutation, permettez-moi de partager une histoire de succès dans la construction de choses de la bonne façon.

Smart Code, Téléphones Dumb

Au début de 2012, nous avons commencé à travailler avec un client qui a été aux prises avec la sécurité de leurs applications mobiles. Ils ont eu de nombreuses applications natives qui ont tous suivi la convention commune d’utiliser un service Web pour authentifier les utilisateurs. Ils sont une organisation très à la sécurité concious et cette configuration créait un goulot d’étranglement dans le déploiement de nouvelles fonctionnalités de sécurité. Afin de déployer une nouvelle méthode d’authentification, l’état d’erreur, etc, ils ont dû passer par un excrutiatingly long, douloureux, processus en plusieurs étapes:

  1.      Mettre en œuvre la nouvelle fonctionnalité de sécurité,
  2.      Exposer via le service Web,
  3.      Mettre à jour chaque application pour utiliser le nouveau service web (qui pourraient inclure des changements de l’interface utilisateur, etc),
  4.      Soumettre chaque application pour approbation, et enfin
  5.      Espèrent que leurs utilisateurs ont téléchargé la nouvelle version de l’application.


Ils nous ont apporté pour ré-imaginer le flux d’authentification comme un processus basé sur le Web qui lancerait l’intérieur de chaque application et gérer laissant l’application sait si et quand l’utilisateur a connecté avec succès. Cette approche leur permettait de déployer de nouvelles fonctionnalités de sécurité immédiatement, car les applications et le flux d’authentification seraient très faiblement couplés. Ce serait une grande victoire pour tout le monde.

Malgré le fait que le projet visait à manipuler l’authentification pour les applications mobiles sur quelques plates-formes particulières, nous avons construit les écrans suivants amélioration progressive. Les présentations ont été réceptifs à partir de minuscules écrans tout le chemin jusqu’à grands et nous avons implanté HTML5 et JavaScript de manière totalement discrète pour profiter des nouvelles fraîches des choses comme la validation du formulaire tout en gardant la taille des fichiers et s’assurer que les pages fonctionneraient en l’absence ou l’une ou l’autre technologie.

Quelques mois après l’achèvement du projet, notre client est venu vers nous avec intérêt dans le déploiement de l’écoulement d’authentification à leurs utilisateurs de mpoint. Ils nous ont donné une liste de près de 1400 chaînes de l’agent utilisateur uniques qui ont été utilisés sur l’écran de connexion sur une période de deux jours et a demandé si nous pouvions gérer. Nous analysé la liste (à l’aide d’un petit script que j’ai concocté) et ont été en mesure de mettre sur pied une liste plus gérable de dispositifs globaux et les types de périphériques à utiliser lors de nos tests. C’était quelque chose comme 25 appareils qui couvrent environ 97% du spectre. Nous étions à l’aise en supposant que les questions de fixation dans 97% des périphériques répertoriés seraient susceptibles de couvrir également les 3%, mais étions prêts à résoudre tous les problèmes supplémentaires si elles surgi.

Notre budget de ce projet était d’environ 33% du budget du projet initial.

A notre grande surprise, quand tout a été dit et fait, nous sommes venus dans à peu près la moitié de ce budget en termes d’heures réelles passées et nous avons conclu le projet dans la moitié du temps que nous attendions. C’était génial pour nous car nous avons économisé l’argent de nos clients, qui nous a fait bien paraître. C’était génial pour notre client aussi, parce qu’ils ont réussi à économiser de l’argent grave sur un projet (ce qui arrive rarement dans le monde de l’entreprise, au moins dans mon expérience).

Il est intéressant de noter que cette réalisation n’a rien à voir avec nos prouesses de chasse aux bogues ou notre vitesse l’amélioration progressive fonctionne. Nous avions affaire à certains anciens navigateurs odieux trop pensent Blackberry 4 et OpenWaveet ils ont vraiment ne présentaient pas beaucoup d’un défi. Ainsi, pour une somme très modeste, nous avons pu déployer rapidement un soutien supplémentaire pour plus de 1000 appareils (et probablement des milliers d’autres qui n’ont pas fait la liste) et qui a créé une énorme opportunité pour notre client d’attirer et de fidéliser de nouveaux clients.

 

Leçons apprises

Nous avons longtemps pratiqué l’art de l’amélioration progressive pendant une longue période. C’est profondément enraciné dans notre processus et une partie de qui nous sommes en tant que société. Cela fait qu’il est souvent difficile pour nous de mettre des chiffres précis sur le coût de l’inaction et de l’amélioration progressive des économies financières de faire les choses comme nous le faisons presque toujours. Nous espérons que ces deux petites études de cas permettent d’éclairer un peu les choses pour ceux qui peuvent encore être un peu sceptique.

Avez-vous des études de cas ou des anecdotes, vous pouvez partager? Nous serions ravis de les entendre.

Comments are closed.