Sujet : browser
-
Stockage dans le navigateur : cookies, Web Storage et IndexedDB comparés
Les cookies voyagent avec chaque requête et sont de petite taille par spécification ; localStorage et sessionStorage sont des magasins de chaînes synchrones avec quelques Mio par origine ; IndexedDB est asynchrone, transactionnel et partage le grand quota de l'origine. Tout le stockage du navigateur est de type best-effort sauf si la persistance est accordée, et il est délimité par origine.
-
La politique de même origine (Same-Origin Policy) : ce qu'est une origine et ce qu'elle isole
Une origine est le triplet schéma, hôte et port d'une URL. Un script peut lire et modifier des documents, du stockage et des réponses de même origine ; les lectures cross-origin sont bloquées par défaut, tandis que les écritures cross-origin telles que les soumissions de formulaire et l'intégration telle que les images et les scripts sont généralement autorisées. CORS assouplit les lectures ; des défenses contre le CSRF restent nécessaires.
-
Utiliser fetch avec des délais d'expiration et AbortController
Une promesse fetch n'est rejetée qu'en cas d'échec réseau, pas en cas de statut d'erreur HTTP, et elle n'a par elle-même aucun délai d'expiration. Passer un AbortSignal combinant AbortSignal.timeout et un contrôleur de l'appelant, vérifier response.ok, et distinguer dans le catch TimeoutError, AbortError, les erreurs réseau et les erreurs HTTP.
-
Web Vitals : ce que mesurent LCP, INP et CLS
Les Core Web Vitals sont trois métriques de terrain : Largest Contentful Paint (temps de rendu du plus grand élément visible, cible 2.5 s), Interaction to Next Paint (latence de la plus longue interaction, cible 200 ms) et Cumulative Layout Shift (mouvement inattendu, cible 0.1), chacune évaluée au 75e centile des chargements de page.
-
Les bases de Web Push : abonnements, clés VAPID et le service de push
Un navigateur s'abonne auprès du service de push de son éditeur et remet à la page un point de terminaison (endpoint) plus des clés ; le serveur applicatif envoie par POST des messages chiffrés à ce point de terminaison avec un en-tête TTL et un JWT VAPID (ES256, aud = origine du service de push, exp d'au plus 24 heures) dont la clé publique a été transmise à PushManager.subscribe comme applicationServerKey. Un 201 signifie accepté, pas délivré.
-
Sélecteurs stables et attente automatique dans les tests de bout en bout en navigateur
Deux causes dominent l'instabilité des tests en navigateur : des sélecteurs qui se cassent ou correspondent au mauvais élément, et des pauses temporisées qui présument d'un minutage. Localiser les éléments par rôle, libellé ou identifiant de test, faire en sorte que chaque localisateur corresponde à exactement un élément, et synchroniser sur des assertions qui réessaient et des vérifications d'actionnabilité plutôt que sur le temps.
-
Mise en page CSS : quand utiliser flexbox et quand utiliser grid
Flexbox est un modèle unidimensionnel qui répartit l'espace le long d'une ligne ou d'une colonne ; grid est bidimensionnel et définit lignes et colonnes ensemble. Utiliser flexbox pour les groupes pilotés par le contenu et grid pour la structure de page et de formulaire ; les combiner, utiliser gap, et laisser les éléments rétrécir pour que le texte ne déborde pas.
-
Quand l'amélioration progressive est-elle rentable pour une application qui a de toute façon besoin de JavaScript ?
Question ouverte : pour les applications dont les fonctionnalités essentielles ne peuvent pas fonctionner sans script, quelles parties méritent malgré tout un parcours sans script ou à script réduit qui fonctionne, à quelle fréquence le script échoue-t-il réellement à s'exécuter pour un public donné, et comment une équipe devrait-elle trancher à partir de données plutôt que de principes ?
-
La boucle d'événements de JavaScript : tâches, microtâches et rendu
JavaScript exécute une tâche à la fois ; la boucle d'événements HTML prend une tâche, puis vide entièrement la file des microtâches (réactions de promesses, queueMicrotask) avant la tâche suivante ou une occasion de rendu. Un travail synchrone long et des chaînes de microtâches sans fin bloquent les entrées et l'affichage.
Lisible par machine : JSON