Mise à jour mensuelle du développement Web 9⁄2018 : chargement paresseux natif et travail imaginaire

Publié: 2022-03-10
Résumé rapide ↬ Le Web évolue à un rythme si rapide qu'il peut être difficile de rester au courant. Pour vous donner un aperçu de ce qui s'est passé dans le monde du développement Web au cours des dernières semaines, Anselm a une fois de plus compilé sa mise à jour mensuelle.

C'est un concept intéressant de comparer JavaScript avec CO2 et pourtant très valable. Alex Russel, qui travaille pour l'équipe Chrome et a beaucoup d'informations sur l'état actuel du Web, dit qu'utiliser trop de JavaScript ou l'utiliser exclusivement (sans amélioration progressive/dégradation gracieuse) aura le même effet que trop de CO2 pour le écosystème sur la planète Terre — l'écosystème s'effondrera. Et tout comme nous avons besoin d'une certaine quantité de CO2 pour vivre, nous avons besoin de JavaScript sur le web. C'est cette fine ligne qui fait la différence - la ligne entre pas trop et pas du tout.

Je pense qu'avec les API de navigateur natives que nous avons de nos jours, nous avons une opportunité fantastique de créer d'excellents services Web sans trop les gonfler et sans compter uniquement sur JavaScript. Nous pouvons facilement améliorer les éléments natifs avec l'API Custom Elements via les classes ES6, avec si peu de code qu'il semble ridicule de construire tout cela par vous-même dans un framework tiers. Par coïncidence, l'équipe d'ingénierie de Github a publié un article sur la façon dont ils ont complètement abandonné jQuery et ce qu'ils utilisent maintenant à la place : du JavaScript natif et un petit code allégé qui améliore progressivement leur plate-forme. Moins de code, une meilleure maintenabilité et plus de stabilité.

Nouvelles

  • Chrome 70 est maintenant en version bêta, apportant la détection de forme comme essai d'origine qui nous permet d'effectuer la lecture de code QR, la détection de visage et la reconnaissance de texte dans les images. L'API d'authentification Web a également reçu quelques mises à jour et la prise en charge de la politique de referrerpolicy a été ajoutée aux éléments <script> . Cette version rendra également obsolète Custom Elements v0, HTML Imports et Shadow DOM v0.
  • Enfin, avec Firefox 62, Mozilla propose ::selection au lieu de :-moz-selection . Ils ont également implémenté flat() et flatMap() pour les tableaux JavaScript et les développeurs obtiennent un nouvel éditeur de chemin de forme.
  • Chrome 69 est sorti et nous apporte CSS Scroll Snap Points, la propriété CSS viewport-fit pour les affichages découpés comme celui de l'iPhone X, et l'API Web Locks qui permet aux scripts exécutés dans un onglet ou un travailleur d'acquérir de manière asynchrone un verrou, maintenez pendant que le travail est effectué, puis relâchez-le. La mise à jour comprend également la prise en charge du dégradé conique CSS, toggleAttribute() (qui est similaire à la méthode classList.toggle() mais pour les attributs), et flat() et flatMap() pour les tableaux. Malheureusement, cette version a changé la façon dont le navigateur affiche l'URL, et il semble que les gens la considèrent comme un bogue de sécurité. Voyons comment cela va évoluer.
  • Avec Firefox 62 prenant en charge les polices Web variables, nous avons enfin un support dans tous les principaux navigateurs et pouvons désormais l'utiliser largement pour améliorer les performances, être plus créatif avec la typographie et réduire considérablement le trafic de données.
  • Manuel Rego Casasnovas a écrit sur les changements récents sur CSS Grid Layout en pourcentages et hauteur indéfinie dans le navigateur Chrome.
  • Quiconque n'est pas un expert aurait du mal à expliquer comment fonctionne réellement le suivi sur Internet. C'est pourquoi Firefox modifie désormais ses paramètres par défaut et applique par défaut le blocage du suivi dans son navigateur.
  • PHP7.3 arrive bientôt avec de nouvelles syntaxes Heredoc et Nowdoc, des virgules de fin dans les appels de fonction, is_countable() , array_key_first() , array_key_last() et des améliorations de hachage de mot de passe Argon2.
Plus après saut! Continuez à lire ci-dessous ↓

Général

  • "The 'Developer Experience' Bait-and-Switch" d'Alex Russell est un excellent article qui explique les environnements toxiques que nous construisons actuellement pour le Web et pourquoi JavaScript peut être comparé au CO2 - les deux sont nécessaires en petites portions, mais s'il y en a trop cela mettrait tout l'écosystème (le Web) en danger. Un article réfléchi que je recommande à tout le monde ici de lire, de partager et de retenir.
  • Alors qu'Alexa, Cortana, Siri et même les chatbots de support client deviennent la norme, nous devons commencer à considérer non seulement l'apparence de notre contenu, mais aussi son son. Nous pouvons – et devons – utiliser HTML et ARIA pour rendre notre contenu structuré, sensé et, surtout, significatif.

Performances Web

  • Le prochain PostgreSQL 11 présente des améliorations de performances intéressantes. Dimitri Fontaine partage la différence qu'ils peuvent faire.
  • Ben Schwarz partage de nouvelles approches du chargement paresseux natif pour le Web qui pourraient bientôt devenir une réalité.

Sécurité

  • Nightwatch Cybersecurity a publié une vulnérabilité de sécurité dans Android qui expose des informations sur l'appareil de l'utilisateur à toutes les applications qui y sont exécutées. Cela semble inclure le nom du réseau WiFi, le BSSID, les adresses IP locales, les informations du serveur DNS et l'adresse MAC - dans l'ensemble, de nombreuses informations privées permettent aux utilisateurs de suivre des appareils Android individuels. Malheureusement, toutes les versions d'Android OS, y compris les fourches (à l'exception d'Android P/9 où un correctif a été fourni) semblent être affectées sans qu'il soit prévu de corriger les anciennes versions.

CSS

  • Chen Hui Jing explique comment personnaliser les boutons radio sans compromettre leur accessibilité.
  • Les formes CSS ont déjà une longue histoire. Apportés tôt sur le Web par une initiative de l'équipe Web d'Adobe, les fournisseurs de navigateurs ont rapidement supprimé les implémentations et reviennent maintenant lentement avec des spécifications et des implémentations itératives et améliorées. Rachel Andrew explique comment implémenter CSS Shapes.
  • Sara Soueidan a écrit les raisons pour lesquelles elle est passée de la définition des couleurs CSS en HEX ou RVB à HSL et quels en sont les avantages.
  • La croissance du Web s'accompagne de nouvelles fonctionnalités pour mieux s'adapter à ses nouveaux facteurs de forme et cas d'utilisation. Une fonctionnalité qui me passionne est la propriété color-adjust , proposée dans CSS Color Module Level 4. C'est une reconnaissance que le Web continuera à apparaître sur les appareils qui ont des affichages moins que stellaires.
Accords de couleurs
Créer des harmonies de couleurs devient un jeu d'enfant avec HSL. (Crédit image)

HTML et SVG

  • Stefan Judis a lu ce que la documentation de Mozilla a à dire sur les éléments d' input et a découvert quelques éléments intéressants qui pourraient être très utiles pour votre prochain projet.

Javascript

  • Nolan Lawson compare les différentes manières d'utiliser les minuteries en JavaScript et quand les utiliser.
  • ky est un client HTTP minuscule et élégant basé sur l'API Fetch du navigateur.
  • Ankur Anand a écrit un article sur le terrible coût des performances des requêtes CORS dans les applications d'une seule page.
  • Adrian Roselli explique comment nous pouvons créer des listes de liens à la fin d'une page pour les styles d'impression.
  • Babel 7 est sorti. Il est plus rapide, a plus d'options et prend en charge les fragments JSX et TypeScript.
  • Le redimensionnement automatique des <textarea> est un moyen très utile d'améliorer l'expérience utilisateur pour les personnes qui écrivent du contenu pour votre site ou service. J'ai écrit un article de blog sur la façon de redimensionner automatiquement les éléments de formulaire avec une courte classe ECMAScript 6.

Accessibilité

  • Ethan Marcotte réfléchit à ce que signifie l'accessibilité et se rend compte qu'il ne s'agit pas de rendre un site Web compatible avec une technologie ou un logiciel d'assistance, mais de le rendre utilisable pour tous ceux qui souhaitent y accéder, quelle que soit la technologie. C'est une énorme différence car son approche inclut les personnes qui ont des difficultés à lire un site Web même si elles utilisent le même navigateur et le même ordinateur portable que vous. Peut-être qu'ils sont en plein soleil, qu'ils ont des difficultés avec de petits textes ou qu'ils sont distraits par des couleurs vives ou des éléments animés.
  • Eric Bailey souligne à quel point il est important de tester manuellement l'accessibilité.
  • Scott O'Hara partage une navigation par fil d'Ariane en utilisant aria-label pour fournir un nom accessible et aria-current pour indiquer le lien actuellement actif.

La vie de travail

  • Ryan Singer envisage la difficulté de planifier un projet avec un « travail imaginaire » et pourquoi il est si important de tester d'abord à quel point quelque chose sera difficile à intégrer avant de le planifier sur la feuille de route.
Travail réel contre travail imaginaire
Nous sommes tous déjà passés par là : imaginer une solution dans votre tête et la mettre en œuvre sont deux choses totalement différentes. (Crédit image)

Aller plus loin…

  • J'adore le concept de griffonnage, et même si je ne le fais pas régulièrement, cela me fascine toujours. Doodle Addicts est une plateforme qui collecte des doodles de personnes du monde entier. Une belle galerie pour s'inspirer.
  • Jonny Brooks-Bartlett a écrit un article intéressant sur les raisons pour lesquelles tant de data scientists quittent leur emploi. Le travail peut sembler assez intéressant et être un bon pari ces jours-ci, mais souvent les attentes ne correspondent pas à la réalité et les décisions politiques et éthiques sont extrêmement difficiles.
  • Marco Lambertini explique comment la technologie peut nous aider à sauver la planète, mais plus que tout, nous devons apprendre à valoriser la nature et ses ressources.
  • Une discussion intéressante a été soulevée cette semaine par un contributeur Open Source très connu qui a tenté de changer la licence d'un de leurs projets afin d'empêcher les entreprises qui soutiennent l'institution américaine ICE d'utiliser leur logiciel. Le changement a été rapidement annulé après qu'il a été révélé qu'il n'était pas juridiquement exécutoire. Cependant, l'ensemble du sujet (qui revient beaucoup plus souvent ces derniers temps) montre que de plus en plus de gens pensent à l'impact de leur travail. Ils ne veulent pas qu'il soit utilisé pour le mal, mais pour le bien. Et bien que l'idée d'une source ouverte et non restreinte soit souhaitable, ce n'est que si les gens l'utilisent pour défendre les droits de l'homme et améliorer la vie. Je suis curieux de connaître de nouvelles solutions qui pourraient garantir cela; peut-être verrons-nous bientôt plus de conditions de service pour les projets open source (qui seraient alors juridiquement contraignantes mais pourraient empêcher les projets open source gratuits de les utiliser).