7 bogues chroniques du navigateur qui sévissent sur le Web

Les navigateurs Web sont incroyables. S'il n'y avait pas de navigateurs, nous ne serions pas en mesure de nous connecter aussi bien avec les utilisateurs et les clients en versant nos données et documents sur leurs ordinateurs de bureau, tablettes et téléphones. Hélas, tout le merveilleux contenu fourni par le navigateur Web nous rend d'autant plus frustrés lorsque le rendu n'est pas aussi élégant ou exempt de bogues que nous le souhaiterions.

Lorsqu'il s'agit de développer des sites Web, nous sommes autant à la merci des navigateurs que nous leur en sommes redevables. Tout problème sur n'importe quelle plate-forme saute, en particulier lorsqu'il plante les machines de nos utilisateurs. Et avec le design en tant que tel une prime pour se démarquer ou s'intégrer, toute ligne grasse ou touche de couleur mal appliquée détruit l'expérience esthétique que nous avons travaillé à créer. Même la moindre erreur, comme ajouter un pixel supplémentaire à la largeur d'une ligne ou désaligner un peu un tableau, peut entraîner une expérience utilisateur frustrante, sans parler du coût de la découverte, de la vérification et du contournement.

Bien sûr, c'était pire. Les vastes différences entre les navigateurs ont été en grande partie effacées par l'allégeance aux normes Web du W3C. Et les différences qui subsistent peuvent être généralement ignorées, grâce à la prolifération de bibliothèques comme jQuery, qui non seulement facilitent le piratage JavaScript, mais expliquent également que les navigateurs ne sont pas les mêmes.

Ces bibliothèques ont l'habitude de geler les bogues de navigateur en place. Si les sociétés de navigation corrigent certains de leurs pires bogues, les nouveaux «correctifs» peuvent perturber les anciens correctifs et solutions de contournement. Soudain, le «correctif» devient le problème qui perturbe l'ancienne stabilité que nous avons truquée autour du bogue. Les programmeurs ne peuvent pas gagner.

La stabilité apportée par des bibliothèques comme jQuery a également encouragé les constructeurs de navigateurs à accélérer et à automatiser les processus de mise à jour de leur navigateur. Mozilla s'est engagé à sortir une nouvelle version de Firefox tous les quelques mois. Dans le passé, chaque version était une cible stable pour les développeurs Web, et nous pourrions mettre un petit GIF sur nos sites en affirmant qu'ils fonctionnent mieux dans, disons, IE5. Maintenant, l'odomètre tourne si rapidement qu'une nouvelle version de Firefox sera publiée dans le temps qu'il faut au HTML pour voyager du serveur au client.

En attendant, nous demandons aux navigateurs d'en faire beaucoup plus. Le site Web de mon journal local met ma machine à genoux - des publicités popover en expansion, des extraits vidéo en lecture automatique, du code pour personnaliser les publicités en fonction de mon historique de navigation récent. Si ma fille regarde un site Web de poupée, le JavaScript essaie frénétiquement de trouver une publicité de poupée à me montrer. Toute cette magie gomme le CPU.

Tout cela signifie que les bogues du navigateur d'aujourd'hui sont plus rares mais plus difficiles à cerner. Voici un aperçu des derniers genres de bogues de navigateur qui affligent - ou dans de nombreux cas, simplement harcelants - les concepteurs et les développeurs Web.

Disposition

Les bogues de navigateur les plus visibles sont les problèmes de mise en page. La base de données de bogues Bugzilla de Mozilla a 10 sections pour les problèmes de mise en page, et cela n'inclut pas les problèmes de mise en page classés comme étant liés au DOM, CSS ou Canvas. Le travail le plus important du navigateur est d'organiser le texte et les images, et il est souvent difficile de le faire correctement.

De nombreux bugs de mise en page peuvent sembler minimes au point d'être presque ésotériques. Le bogue Bugzilla 1303580, par exemple, appelle Firefox pour l'utilisation de la version italique d'une police lorsque les balises CSS appellent l'oblique. Peut-être que seul un toxicomane de police le remarquerait. Pendant ce temps, le bogue Bugzilla 1296269 signale que certaines parties des lettres de Comic Sans sont coupées, du moins sous Windows. Les concepteurs de polices font une distinction et cela compte pour eux. Lorsqu'ils ne peuvent pas obtenir le bon aspect et la bonne sensation sur tous les navigateurs, les concepteurs Web peuvent devenir peut-être un peu trop frustrés.

Il y a des centaines, des milliers, voire des millions de ces bogues. À, nous avons rencontré des problèmes avec des images qui disparaissent dans notre éditeur CMS et des balises span qui n'apparaissent que dans le DOM.

Fuites de mémoire

Il est souvent difficile de remarquer les fuites de mémoire. Par définition, ils ne modifient aucune propriété visible. Le site Web est rendu correctement, mais le navigateur ne nettoie pas après coup. Quelques voyages de trop vers des sites Web qui déclenchent la fuite et votre machine ralentit à une exploration parce que toute la RAM est verrouillée contenant une structure de données qui ne sera jamais réutilisée. Ainsi, le système d'exploitation échange frénétiquement des blocs de mémoire virtuelle sur le disque et vous passez votre temps à attendre. Le meilleur choix est de redémarrer votre machine.

Les détails des bogues de fuite de mémoire peuvent être exaspérants, et nous avons de la chance que certains programmeurs prennent le temps de les corriger. Considérez le problème 640578 de la pile de navigateur Chronium. Changer une partie du DOM en jouant avec la innerHTMLpropriété fuit la mémoire. Un exemple de code avec une boucle répétée serrée requestAnimationFrameva dupliquer le problème. Il existe des dizaines de problèmes comme celui-ci.

Bien sûr, ce n'est pas toujours la faute du navigateur. Le numéro 640922 de Chrome, par exemple, détaille également une fuite de mémoire et fournit un exemple. Une analyse plus approfondie, cependant, montre que l'exemple de code créait des Date()objets en cours de route pour tester l'heure et qu'ils étaient probablement à l'origine du problème.

Éclat

C'est à peu près officiel. Tout le monde a oublié les merveilleuses illustrations et vidéos Web anti-aliasées qu'Adobe Flash a apportées au Web. Nous le blâmons plutôt pour tous les accidents qui peuvent ou non avoir été sa faute. Maintenant, il est officiellement à la retraite, mais cela ne va pas vite. Même certaines des entreprises les plus avant-gardistes qui poussent les normes Web semblent toujours avoir du code Flash dans leurs pages. Je suis surpris de la fréquence à laquelle je trouve du code Flash en dehors des sites Web MySpace et GeoCities.

Touches et clics

Il n'est pas facile de jongler avec les différents types d'entrées, surtout maintenant que les tablettes et les téléphones génèrent des touches qui peuvent ou non agir comme un clic de souris. Il ne devrait donc pas être surprenant de constater qu'il y a beaucoup de bugs dans ce domaine. Le framework JavaScript Bootstrap conserve une liste de ses bogues les plus exaspérants, et certains des pires tombent dans cette catégorie.

Safari, par exemple, manquera parfois les tapotements du doigt sur le texte de la balise (151933). Parfois, les menus ne fonctionnent pas sur l'iPad car le navigateur a déplacé le rectangle pour rechercher une entrée (150079). Parfois, les clics déclenchent une étrange agitation dans l'élément - ce qui peut même donner l'impression que cela a été fait exprès par un concepteur avant-gardiste (158276). Tout cela prête à confusion lorsque le texte ou les images à l'écran ne réagissent pas comme prévu.

Vidéo

Le plan a toujours été de simplifier la livraison de l'audio et de la vidéo en déplaçant la responsabilité à l'intérieur du navigateur et hors du monde des plugins. Cela a éliminé les problèmes d'interface, mais cela n'a pas supprimé tous les problèmes. La liste des bogues vidéo est longue et beaucoup d'entre eux sont trop visibles. L'entrée de Bugzilla 754753 décrit «principalement des taches rouges et vertes qui contiennent diverses images fantômes» et l'entrée de Bugzilla 1302991 «« bégaie »faute d'un meilleur mot.»

Certains des problèmes les plus complexes émergent à mesure que les navigateurs intègrent les divers mécanismes de chiffrement conçus pour empêcher le piratage. Le bogue 1304899 suggère que Firefox ne télécharge pas automatiquement le bon mécanisme de chiffrement (EME) d'Adobe. Est-ce la faute de Firefox? Adobe? Ou peut-être un proxy étrange?

Les bugs vidéo vont continuer à dominer. L'intégration de la vidéo Web avec d'autres formes de contenu en ajoutant des balises vidéo à HTML5 a ouvert de nombreuses nouvelles possibilités pour les concepteurs, mais chaque nouvelle possibilité signifie de nouvelles opportunités d'apparition de bogues et d'incohérences.

Planant

La possibilité pour la page Web de suivre le déplacement de la souris sur la page aide les concepteurs Web à donner aux utilisateurs des indications sur les fonctionnalités qui pourraient être cachées derrière une image ou un mot. Hélas, les événements en vol stationnaire ne remontent pas toujours la chaîne aussi vite qu'ils le pourraient.

Le nouveau navigateur Microsoft Edge, par exemple, ne cache pas le curseur lorsque la souris survole certains éléments d'entrée (817822). Parfois, le survol ne s'arrête pas (5381673). Parfois, l'événement de survol est lié au mauvais élément (7787318). Tout cela porte à confusion et décourage l'utilisation d'un effet assez soigné.

Malware

Bien qu'il soit tentant de rejeter toute la responsabilité des bogues de navigateur sur les développeurs de navigateurs, c'est souvent injuste. Beaucoup de problèmes sont causés par des logiciels malveillants conçus pour se présenter comme des extensions ou des plugins utiles. Dans de nombreux cas, le logiciel malveillant fait quelque chose de vraiment utile tout en volant secrètement des clics ou du commerce en arrière-plan.

Le problème est que l'interface d'extension est assez puissante. Une extension peut insérer des balises et du code arbitraires dans tous les sites Web. Entre de bonnes mains, c'est très cool, mais il est facile de voir comment le nouveau code de l'extension peut se heurter au code du site Web. Quoi? Vous ne vouliez pas redéfinir le comportement de la $fonction?

Ce n'est pas tant un bug qu'un problème philosophique profond avec une fonctionnalité très intéressante. Mais avec une grande puissance vient une grande responsabilité - peut-être plus grande que n'importe quel programmeur d'extension peut rassembler. La meilleure façon d'examiner ce problème est de réaliser que c'est le seul domaine sur lequel nous, les utilisateurs, avons le contrôle. Nous pouvons désactiver les extensions et les limiter à quelques sites Web où il n'y a aucun problème. L'API est un peu trop puissante pour un usage quotidien - si puissante qu'il est tentant d'appeler les API d'extensions comme le plus gros bogue de tous. Mais cela nierait tout ce qu'il fait pour nous.

Articles Liés

  • Au-delà de jQuery: un guide expert sur les frameworks JavaScript
  • Bilan: 7 IDE JavaScript mis à l'épreuve
  • Fusillade HTML5: comment Chrome, Safari, Firefox, IE et Opera se mesurent
  • Examen: 13 frameworks Web Primo Python
  • Le pouvoir de la programmation paresseuse
  • Télécharger: Guide de développement de carrière pour les développeurs
  • 7 mauvaises idées de programmation qui fonctionnent
  • 9 mauvaises habitudes de programmation que nous aimons secrètement
  • 21 tendances de programmation à chaud - et 21 à froid