{"id":92984,"date":"2022-10-20T23:45:39","date_gmt":"2022-10-20T21:45:39","guid":{"rendered":"https:\/\/rmarketingdigital.com\/dev\/whats-new-in-lighthouse-6-0\/"},"modified":"2020-10-18T06:22:42","modified_gmt":"2020-10-18T09:22:42","slug":"whats-new-in-lighthouse-6-0","status":"publish","type":"post","link":"https:\/\/rmarketingdigital.com\/fr\/dev\/whats-new-in-lighthouse-6-0\/","title":{"rendered":"Nouveaut\u00e9s de Lighthouse 6.0"},"content":{"rendered":"<div id=\"ez-toc-container\" class=\"ez-toc-v2_0_86 counter-hierarchy ez-toc-counter ez-toc-grey ez-toc-container-direction\">\n<div class=\"ez-toc-title-container\">\n<p class=\"ez-toc-title\" style=\"cursor:inherit\">Table des mati\u00e8res<\/p>\n<span class=\"ez-toc-title-toggle\"><a href=\"#\" class=\"ez-toc-pull-right ez-toc-btn ez-toc-btn-xs ez-toc-btn-default ez-toc-toggle\" aria-label=\"Basculer la table des mati\u00e8res\"><span class=\"ez-toc-js-icon-con\"><span class=\"\"><span class=\"eztoc-hide\" style=\"display:none;\">Basculer<\/span><span class=\"ez-toc-icon-toggle-span\"><svg style=\"fill: #999;color:#999\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"list-377408\" width=\"20px\" height=\"20px\" viewbox=\"0 0 24 24\" fill=\"none\"><path d=\"M6 6H4v2h2V6zm14 0H8v2h12V6zM4 11h2v2H4v-2zm16 0H8v2h12v-2zM4 16h2v2H4v-2zm16 0H8v2h12v-2z\" fill=\"currentColor\"><\/path><\/svg><svg style=\"fill: #999;color:#999\" class=\"arrow-unsorted-368013\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"10px\" height=\"10px\" viewbox=\"0 0 24 24\" version=\"1.2\" baseprofile=\"tiny\"><path d=\"M18.2 9.3l-6.2-6.3-6.2 6.3c-.2.2-.3.4-.3.7s.1.5.3.7c.2.2.4.3.7.3h11c.3 0 .5-.1.7-.3.2-.2.3-.5.3-.7s-.1-.5-.3-.7zM5.8 14.7l6.2 6.3 6.2-6.3c.2-.2.3-.5.3-.7s-.1-.5-.3-.7c-.2-.2-.4-.3-.7-.3h-11c-.3 0-.5.1-.7.3-.2.2-.3.5-.3.7s.1.5.3.7z\"\/><\/svg><\/span><\/span><\/span><\/a><\/span><\/div>\n<nav><ul class='ez-toc-list ez-toc-list-level-1' ><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-1\" href=\"https:\/\/rmarketingdigital.com\/fr\/dev\/whats-new-in-lighthouse-6-0\/#New-metrics\" >De nouvelles m\u00e9triques<\/a><ul class='ez-toc-list-level-3' ><li class='ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-2\" href=\"https:\/\/rmarketingdigital.com\/fr\/dev\/whats-new-in-lighthouse-6-0\/#Largest-Contentful-Paint-LCP\" >La plus grande peinture de contenu (LCP)<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-3\" href=\"https:\/\/rmarketingdigital.com\/fr\/dev\/whats-new-in-lighthouse-6-0\/#Cumulative-Layout-Shift-CLS\" >D\u00e9calage cumulatif de la disposition (CLS)<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-4\" href=\"https:\/\/rmarketingdigital.com\/fr\/dev\/whats-new-in-lighthouse-6-0\/#Total-Blocking-Time-TBT\" >Temps de blocage total (TBT)<\/a><\/li><\/ul><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-5\" href=\"https:\/\/rmarketingdigital.com\/fr\/dev\/whats-new-in-lighthouse-6-0\/#Performance-score-update\" >Mise \u00e0 jour du score de performance<\/a><ul class='ez-toc-list-level-3' ><li class='ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-6\" href=\"https:\/\/rmarketingdigital.com\/fr\/dev\/whats-new-in-lighthouse-6-0\/#Shifts-in-scores\" >Changements dans les scores<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-7\" href=\"https:\/\/rmarketingdigital.com\/fr\/dev\/whats-new-in-lighthouse-6-0\/#Scoring-calculator\" >Calculateur de score<\/a><\/li><\/ul><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-8\" href=\"https:\/\/rmarketingdigital.com\/fr\/dev\/whats-new-in-lighthouse-6-0\/#New-audits\" >Nouveaux audits<\/a><ul class='ez-toc-list-level-3' ><li class='ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-9\" href=\"https:\/\/rmarketingdigital.com\/fr\/dev\/whats-new-in-lighthouse-6-0\/#Unused-JavaScript\" >JavaScript inutilis\u00e9<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-10\" href=\"https:\/\/rmarketingdigital.com\/fr\/dev\/whats-new-in-lighthouse-6-0\/#Accessibility-audits\" >Audits d&#039;accessibilit\u00e9<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-11\" href=\"https:\/\/rmarketingdigital.com\/fr\/dev\/whats-new-in-lighthouse-6-0\/#Maskable-icon\" >Ic\u00f4ne masquable<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-12\" href=\"https:\/\/rmarketingdigital.com\/fr\/dev\/whats-new-in-lighthouse-6-0\/#Charset-declaration\" >D\u00e9claration du jeu de caract\u00e8res<\/a><\/li><\/ul><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-13\" href=\"https:\/\/rmarketingdigital.com\/fr\/dev\/whats-new-in-lighthouse-6-0\/#Lighthouse-CI\" >Phare CI<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-14\" href=\"https:\/\/rmarketingdigital.com\/fr\/dev\/whats-new-in-lighthouse-6-0\/#Mobile-emulation\" >\u00c9mulation mobile<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-15\" href=\"https:\/\/rmarketingdigital.com\/fr\/dev\/whats-new-in-lighthouse-6-0\/#Browser-extension\" >Extension de navigateur<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-16\" href=\"https:\/\/rmarketingdigital.com\/fr\/dev\/whats-new-in-lighthouse-6-0\/#Budgets\" >Les budgets<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-17\" href=\"https:\/\/rmarketingdigital.com\/fr\/dev\/whats-new-in-lighthouse-6-0\/#Source-location-links\" >Liens d&#039;emplacement source<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-18\" href=\"https:\/\/rmarketingdigital.com\/fr\/dev\/whats-new-in-lighthouse-6-0\/#On-the-horizon\" >Sur l&#039;horizon<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-19\" href=\"https:\/\/rmarketingdigital.com\/fr\/dev\/whats-new-in-lighthouse-6-0\/#Thank-you\" >Merci!<\/a><\/li><\/ul><\/nav><\/div>\n<p><\/p>\n<div>\n<header class=\"w-article-header\">\n<p class=\"w-article-header__subhead w-mb--non\">\n          Nouvelles mesures, mise \u00e0 jour du score de performance, nouveaux audits, et plus encore.\n        <\/p>\n<p>\n          <time>19 mai 2020<\/time><\/p>\n<\/header>\n<p>Aujourd&#039;hui, nous sortons Lighthouse 6.0!<\/p>\n<p><a rel=\"nofollow noopener noreferrer\" target=\"_blank\" href=\"https:\/\/github.com\/GoogleChrome\/lighthouse\/\">Phare<\/a> est un outil d&#039;audit de site Web automatis\u00e9 qui<br \/>\naide les d\u00e9veloppeurs avec des opportunit\u00e9s et des diagnostics pour am\u00e9liorer l&#039;exp\u00e9rience utilisateur de leurs sites.<br \/>\nIl est disponible dans Chrome DevTools, npm (en tant que module Node et CLI) ou en tant qu&#039;extension de navigateur (dans<br \/>\n<a rel=\"nofollow noopener noreferrer\" target=\"_blank\" href=\"https:\/\/chrome.google.com\/webstore\/detail\/lighthouse\/blipmdconlkpinefehnmjammfjpmpbjk\">Chrome<\/a> et<br \/>\n<a rel=\"nofollow noopener noreferrer\" target=\"_blank\" href=\"https:\/\/addons.mozilla.org\/en-US\/firefox\/addon\/google-lighthouse\/\">Firefox<\/a>). Il alimente de nombreux Google<br \/>\nservices, y compris web.dev\/measure et <a rel=\"nofollow noopener noreferrer\" target=\"_blank\" href=\"https:\/\/developers.google.com\/speed\/pagespeed\/insights\/\">PageSpeed<br \/>\nConnaissances<\/a>.<\/p>\n<p>Lighthouse 6.0 est disponible imm\u00e9diatement sur NPM et en <a rel=\"nofollow noopener noreferrer\" target=\"_blank\" href=\"https:\/\/www.google.com\/chrome\/canary\/\">Chrome<br \/>\nCanari<\/a>. D&#039;autres services Google qui tirent parti de Lighthouse<br \/>\nobtenez la mise \u00e0 jour d&#039;ici la fin du mois. Il atterrira dans Chrome Stable dans Chrome 84 (mi-juillet).<\/p>\n<p>Pour essayer l&#039;interface de ligne de commande Lighthouse Node, utilisez les commandes suivantes:<\/p>\n<p><web-copy-code><\/p>\n<pre class=\"language-bash\"><code class=\"language-bash\"><span class=\"token function\">npm<\/span> <span class=\"token function\">installer<\/span> -g lighthouse<br>lighthouse https:\/\/www.example.com --view<\/code><\/pre>\n<p><\/web-copy-code><\/p>\n<p>Cette version de Lighthouse s&#039;accompagne d&#039;un grand nombre de modifications<br \/>\n<a rel=\"nofollow noopener noreferrer\" target=\"_blank\" href=\"https:\/\/github.com\/GoogleChrome\/lighthouse\/releases\/tag\/v6.0.0\">r\u00e9pertori\u00e9 dans le changelog 6.0<\/a>. Nous couvrirons<br \/>\nles points forts de cet article.<\/p>\n<h2 id=\"new-metrics\"><span class=\"ez-toc-section\" id=\"New-metrics\"><\/span>De nouvelles m\u00e9triques <span class=\"ez-toc-section-end\"><\/span><\/h2>\n<figure class=\"w-figure\">\n  <img alt='phare-nouvelle-metrics-2369866' class=\"w-screenshot\" src='https:\/\/rmarketingdigital.com\/wp-content\/uploads\/2020\/10\/lighthouse-new-metrics-2369866.png' width=\"600\"><br \/>\n<\/figure>\n<p>Lighthouse 6.0 introduit trois nouvelles mesures dans le rapport. Deux de ces nouvelles mesures - La plus grande<br \/>\nContentful Paint (LCP) et Cumulative Layout Shift (CLS) - sont des impl\u00e9mentations de laboratoire de Core Web<br \/>\nVitals.<\/p>\n<h3 id=\"lcp\"><span class=\"ez-toc-section\" id=\"Largest-Contentful-Paint-LCP\"><\/span>La plus grande peinture de contenu (LCP) <span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>La plus grande peinture de contenu (LCP) est une mesure de la charge per\u00e7ue<br \/>\nvivre. Il marque le point lors du chargement de la page lorsque le contenu principal - ou \u00able plus grand\u00bb - a \u00e9t\u00e9 charg\u00e9 et<br \/>\nest visible par l&#039;utilisateur. LCP est un compl\u00e9ment important \u00e0 First Contentful Paint (FCP) qui<br \/>\ncapture le tout d\u00e9but de l&#039;exp\u00e9rience de chargement. LCP indique aux d\u00e9veloppeurs comment<br \/>\nrapidement un utilisateur est en mesure de voir le contenu d&#039;une page. Un score LCP inf\u00e9rieur \u00e0 2,5 secondes est<br \/>\nconsid\u00e9r\u00e9 comme \u00abbon\u00bb.<\/p>\n<p>Pour plus d&#039;informations, <a rel=\"nofollow noopener noreferrer\" target=\"_blank\" href=\"https:\/\/youtu.be\/diAc65p15ag\">regardez cette plong\u00e9e approfondie sur LCP<\/a> par Paul Irish.<\/p>\n<h3 id=\"cls\"><span class=\"ez-toc-section\" id=\"Cumulative-Layout-Shift-CLS\"><\/span>D\u00e9calage cumulatif de la disposition (CLS) <span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>Le d\u00e9calage de mise en page cumulatif (CLS) est une mesure de la stabilit\u00e9 visuelle. Article<br \/>\nquantifie \u00e0 quel point le contenu d&#039;une page se d\u00e9place visuellement. Un score CLS faible est un signal<br \/>\nles d\u00e9veloppeurs que leurs utilisateurs ne subissent pas de changements de contenu indus; un score CLS inf\u00e9rieur \u00e0 0,10 est<br \/>\nconsid\u00e9r\u00e9 comme \u00abbon\u00bb.<\/p>\n<p>CLS dans un environnement de laboratoire est mesur\u00e9 jusqu&#039;\u00e0 la fin du chargement de la page. Alors que sur le terrain, vous pouvez<br \/>\nmesurer CLS jusqu&#039;\u00e0 la premi\u00e8re interaction de l&#039;utilisateur ou en incluant toutes les entr\u00e9es de l&#039;utilisateur.<\/p>\n<p>Pour plus d&#039;informations, <a rel=\"nofollow noopener noreferrer\" target=\"_blank\" href=\"https:\/\/youtu.be\/zIJuY-JCjqw\">regardez cette plong\u00e9e approfondie sur CLS<\/a> par Annie Sullivan.<\/p>\n<h3 id=\"tbt\"><span class=\"ez-toc-section\" id=\"Total-Blocking-Time-TBT\"><\/span>Temps de blocage total (TBT) <span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>Le temps de blocage total (TBT) quantifie la r\u00e9activit\u00e9 de la charge, en mesurant<br \/>\ndur\u00e9e totale pendant laquelle le thread principal a \u00e9t\u00e9 bloqu\u00e9 suffisamment longtemps pour emp\u00eacher la r\u00e9activit\u00e9 des entr\u00e9es.<br \/>\nTBT mesure le temps total entre First Contentful Paint (FCP) et Time to Interactive<br \/>\n(TTI). Il s&#039;agit d&#039;une m\u00e9trique compagnon du TTI et apporte plus de nuance \u00e0 la quantification de l&#039;activit\u00e9 principale des threads<br \/>\nqui bloque la capacit\u00e9 d&#039;un utilisateur \u00e0 interagir avec votre page.<\/p>\n<p>De plus, TBT est bien corr\u00e9l\u00e9 avec la m\u00e9trique de terrain First Input Delay<br \/>\n(FID), qui est un Core Web Vital.<\/p>\n<h2 id=\"score\"><span class=\"ez-toc-section\" id=\"Performance-score-update\"><\/span>Mise \u00e0 jour du score de performance  <span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>Le score de performance dans Lighthouse est calcul\u00e9 \u00e0 partir d&#039;un<br \/>\nm\u00e9lange pond\u00e9r\u00e9 de plusieurs mesures pour r\u00e9sumer la vitesse d&#039;une page. La formule de score de performance 6.0<br \/>\nsuit.<\/p>\n<table class=\"lh-table\">\n<thead>\n<tr>\n<th><strong>Phase<\/strong><\/th>\n<th><strong>Nom de la m\u00e9trique<\/strong><\/th>\n<th><strong>Poids m\u00e9trique<\/strong><\/th>\n<\/tr>\n<\/thead>\n<tbody>\n<tr>\n<td>T\u00f4t (15%)<\/td>\n<td>First Contentful Paint (FCP)<\/td>\n<td>15%<\/td>\n<\/tr>\n<tr>\n<td>Milieu (40%)<\/td>\n<td>Indice de vitesse (SI)<\/td>\n<td>15%<\/td>\n<\/tr>\n<tr>\n<td><\/td>\n<td>La plus grande peinture de contenu (LCP)<\/td>\n<td>25%<\/td>\n<\/tr>\n<tr>\n<td>Tardif (15%)<\/td>\n<td>Time To Interactive (TTI)<\/td>\n<td>15%<\/td>\n<\/tr>\n<tr>\n<td>Filetage principal (25%)<\/td>\n<td>Temps de blocage total (TBT)<\/td>\n<td>25%<\/td>\n<\/tr>\n<tr>\n<td>Pr\u00e9visibilit\u00e9 (5%)<\/td>\n<td>D\u00e9calage cumulatif de la disposition (CLS)<\/td>\n<td>5%<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<p>Alors que trois nouvelles m\u00e9triques ont \u00e9t\u00e9 ajout\u00e9es, trois anciennes ont \u00e9t\u00e9 supprim\u00e9es: Premi\u00e8re peinture significative,<br \/>\nPremier processeur inactif et FID potentiel maximal. Les pond\u00e9rations des statistiques restantes ont \u00e9t\u00e9 modifi\u00e9es pour<br \/>\nmettre l&#039;accent sur l&#039;interactivit\u00e9 principale des threads et la pr\u00e9visibilit\u00e9 de la mise en page.<\/p>\n<p>\u00c0 titre de comparaison, voici le score de la version 5:<\/p>\n<table class=\"lh-table\">\n<thead>\n<tr>\n<th><strong>Phase<\/strong><\/th>\n<th><strong>Nom de la m\u00e9trique<\/strong><\/th>\n<th><strong>Poids<\/strong><\/th>\n<\/tr>\n<\/thead>\n<tbody>\n<tr>\n<td>T\u00f4t (23%)<\/td>\n<td>First Contentful Paint (FCP)<\/td>\n<td>23%<\/td>\n<\/tr>\n<tr>\n<td>Milieu (34%)<\/td>\n<td>Indice de vitesse (SI)<\/td>\n<td>27%<\/td>\n<\/tr>\n<tr>\n<td><\/td>\n<td>Premi\u00e8re peinture significative (FMP)<\/td>\n<td>7%<\/td>\n<\/tr>\n<tr>\n<td>Termin\u00e9 (46%)<\/td>\n<td>Temps d&#039;interactivit\u00e9 (TTI)<\/td>\n<td>33%<\/td>\n<\/tr>\n<tr>\n<td><\/td>\n<td>Premier processeur inactif (FCI)<\/td>\n<td>13%<\/td>\n<\/tr>\n<tr>\n<td>Fil principal<\/td>\n<td>FID potentiel maximum<\/td>\n<td>0%<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<p><img alt='changements de poids de phare-2177453' src='https:\/\/rmarketingdigital.com\/wp-content\/uploads\/2020\/10\/lighthouse-weight-changes-2177453.png'><\/p>\n<p>Quelques faits saillants des changements de score entre les versions 5 et 6 de Lighthouse:<\/p>\n<ul>\n<li><strong>Le poids du TTI a \u00e9t\u00e9 r\u00e9duit de 33% \u00e0 15%<\/strong>. C&#039;\u00e9tait en r\u00e9ponse directe \u00e0 l&#039;utilisateur<br \/>\ndes commentaires sur la variabilit\u00e9 TTI, ainsi que sur les incoh\u00e9rences dans les optimisations m\u00e9triques conduisant \u00e0<br \/>\nam\u00e9liorations de l&#039;exp\u00e9rience utilisateur. TTI est toujours un signal utile lorsqu&#039;une page est enti\u00e8rement<br \/>\ninteractif, mais avec le TBT comme<br \/>\ncompl\u00e9ment-<a rel=\"nofollow noopener noreferrer\" target=\"_blank\" href=\"https:\/\/docs.google.com\/document\/d\/1xCERB_X7PiP5RAZDwyIkODnIXoBk-Oo7Mi9266aEdGg\/edit#heading=h.vkfjuiyx1s5l\">la variabilit\u00e9 est r\u00e9duite<\/a>.<br \/>\nAvec ce changement de score, nous esp\u00e9rons que les d\u00e9veloppeurs seront plus efficacement encourag\u00e9s \u00e0 optimiser pour<br \/>\nl&#039;interactivit\u00e9 de l&#039;utilisateur.<\/li>\n<li><strong>Le poids du FCP a \u00e9t\u00e9 r\u00e9duit de 23% \u00e0 15%.<\/strong> Mesure uniquement lorsque le premier pixel est<br \/>\npeint (FCP) ne nous a pas donn\u00e9 une image compl\u00e8te. Combiner cela avec la mesure lorsque les utilisateurs sont capables<br \/>\npour voir ce qui les int\u00e9resse le plus (LCP) refl\u00e8te mieux l&#039;exp\u00e9rience de chargement.<\/li>\n<li><strong>FID potentiel maximum<\/strong> <strong>est obsol\u00e8te<\/strong>. Il n&#039;appara\u00eet plus dans le rapport, mais est<br \/>\ntoujours disponible dans le JSON. Il est maintenant recommand\u00e9 de se pencher sur le TBT pour quantifier votre interactivit\u00e9<br \/>\nau lieu de mpFID.<\/li>\n<li><strong>La premi\u00e8re peinture significative est obsol\u00e8te.<\/strong> Cette m\u00e9trique \u00e9tait trop variable et n&#039;\u00e9tait pas viable<br \/>\nchemin vers la normalisation car la mise en \u0153uvre est sp\u00e9cifique aux internes de rendu Chrome. Pendant que<br \/>\ncertaines \u00e9quipes trouvent que le timing FMP en vaut la peine sur leur site, la m\u00e9trique ne recevra pas<br \/>\nam\u00e9liorations suppl\u00e9mentaires.<\/li>\n<li><strong>Le premier processeur inactif est obsol\u00e8te<\/strong> car ce n&#039;est pas assez distinct du TTI. TBT et TTI<br \/>\nsont d\u00e9sormais les indicateurs incontournables de l&#039;interactivit\u00e9.<\/li>\n<li>Le poids de CLS est relativement faible, m\u00eame si nous pr\u00e9voyons de l&#039;augmenter dans une future version majeure.<\/li>\n<\/ul>\n<h3 id=\"score-shifts\"><span class=\"ez-toc-section\" id=\"Shifts-in-scores\"><\/span>Changements dans les scores <span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>Comment ces changements affectent-ils les scores des sites r\u00e9els? Nous avons publi\u00e9 un<br \/>\n<a rel=\"nofollow noopener noreferrer\" target=\"_blank\" href=\"https:\/\/docs.google.com\/spreadsheets\/d\/1BZFh7AyyaLHCj5LGAbrn3m72ysu4yv8okyHG-f3MoXI\/edit?usp=sharing\">Analyse<\/a><br \/>\ndes changements de score \u00e0 l&#039;aide de deux ensembles de donn\u00e9es: a <a rel=\"nofollow noopener noreferrer\" target=\"_blank\" href=\"https:\/\/gist.github.com\/connorjclark\/8afe673d4e7c6e17204834a256e7caf1\">ensemble g\u00e9n\u00e9ral de<br \/>\ndes sites<\/a> et un<br \/>\n<a rel=\"nofollow noopener noreferrer\" target=\"_blank\" href=\"https:\/\/gist.github.com\/connorjclark\/0be52464887ae3a6f29ad5a798122e0c#file-readme-md\">ensemble de sites statiques<\/a><br \/>\nconstruit avec <a rel=\"nofollow noopener noreferrer\" target=\"_blank\" href=\"https:\/\/www.11ty.dev\/\">Onze<\/a>. En r\u00e9sum\u00e9, ~ 20% des sites voient nettement plus<br \/>\nscores, ~ 30% n&#039;ont pratiquement aucun changement, et ~ 50% voient une diminution d&#039;au moins cinq points.<\/p>\n<p>Les changements de score peuvent \u00eatre d\u00e9compos\u00e9s en trois \u00e9l\u00e9ments principaux:<\/p>\n<ul>\n<li>noter les changements de poids<\/li>\n<li>corrections de bogues pour les impl\u00e9mentations de m\u00e9triques sous-jacentes<\/li>\n<li>changements de la courbe de score individuelle<\/li>\n<\/ul>\n<p>Les changements de poids du score et l&#039;introduction de trois nouvelles mesures ont g\u00e9n\u00e9r\u00e9 une majorit\u00e9 du score global<br \/>\nchangements. De nouvelles mesures que les d\u00e9veloppeurs n&#039;ont pas encore optimis\u00e9es pour avoir un poids significatif dans la version 6<br \/>\nscore de performance. Alors que le score de performance moyen du corpus de test dans la version 5 \u00e9tait d&#039;environ 50, les scores moyens sur les nouvelles m\u00e9triques Temps de blocage total et la plus grande peinture de contenu \u00e9taient d&#039;environ 30. Ensemble, ces deux m\u00e9triques repr\u00e9sentent 50% du poids dans les performances de la version 6 de Lighthouse. score, donc naturellement un grand pourcentage de sites a vu des baisses.<\/p>\n<p>Les corrections de bogues au calcul de la m\u00e9trique sous-jacente peuvent entra\u00eener des scores diff\u00e9rents. Cela affecte<br \/>\nrelativement peu de sites mais peuvent avoir un impact consid\u00e9rable dans certaines situations. Au total, environ 8% de sites<br \/>\nont connu une am\u00e9lioration du score en raison des changements d&#039;impl\u00e9mentation des m\u00e9triques et environ 4% de sites ont vu un score<br \/>\ndiminution en raison des changements de mise en \u0153uvre des mesures. Environ 88% de sites n&#039;ont pas \u00e9t\u00e9 affect\u00e9s par ces correctifs.<\/p>\n<p>Les changements de la courbe de score individuel ont \u00e9galement eu un impact sur les changements de score globaux, bien que tr\u00e8s l\u00e9g\u00e8rement. Nous<br \/>\ns&#039;assurer p\u00e9riodiquement que la courbe de score s&#039;aligne avec les m\u00e9triques observ\u00e9es dans le <a rel=\"nofollow noopener noreferrer\" target=\"_blank\" href=\"http:\/\/httparchive.org\/\">HTTPArchive<br \/>\nbase de donn\u00e9es<\/a>. \u00c0 l&#039;exclusion des sites affect\u00e9s par des changements majeurs de mise en \u0153uvre, mineurs<br \/>\nles ajustements de la courbe de score pour les mesures individuelles ont am\u00e9lior\u00e9 les scores d&#039;environ 3% des sites et<br \/>\ndiminu\u00e9 les scores d&#039;environ 4% des sites. Environ 93% de sites n&#039;ont pas \u00e9t\u00e9 affect\u00e9s par ce changement.<\/p>\n<h3 id=\"calculator\"><span class=\"ez-toc-section\" id=\"Scoring-calculator\"><\/span>Calculateur de score <span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>Nous avons publi\u00e9 un <a rel=\"nofollow noopener noreferrer\" target=\"_blank\" href=\"https:\/\/googlechrome.github.io\/lighthouse\/scorecalc\/\">calculatrice de score<\/a> aider<br \/>\nvous explorez la notation des performances. Le calculateur vous donne \u00e9galement une comparaison entre la version 5 de Lighthouse et<br \/>\n6 scores. Lorsque vous ex\u00e9cutez un audit avec Lighthouse 6.0, le rapport est accompagn\u00e9 d&#039;un lien vers la calculatrice<br \/>\navec vos r\u00e9sultats renseign\u00e9s.<\/p>\n<figure class=\"w-figure\">\n  <img alt='phare-scorecalc-1889936' class=\"w-screenshot\" src='https:\/\/rmarketingdigital.com\/wp-content\/uploads\/2020\/10\/lighthouse-scorecalc-1889936.png' width=\"600\"><figcaption class=\"w-figcaption\">Un grand merci \u00e0 <a rel=\"nofollow noopener noreferrer\" target=\"_blank\" href=\"https:\/\/twitter.com\/anatudor\">Ana Tudor<\/a> pour la mise \u00e0 niveau de la jauge!<\/figcaption><\/figure>\n<h2 id=\"new-audits\"><span class=\"ez-toc-section\" id=\"New-audits\"><\/span>Nouveaux audits <span class=\"ez-toc-section-end\"><\/span><\/h2>\n<h3 id=\"unused-javascript\"><span class=\"ez-toc-section\" id=\"Unused-JavaScript\"><\/span>JavaScript inutilis\u00e9 <span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>Nous tirons parti <a rel=\"nofollow noopener noreferrer\" target=\"_blank\" href=\"https:\/\/developers.google.com\/web\/tools\/chrome-devtools\/coverage\">Code DevTools<br \/>\ncouverture<\/a> dans un nouvel audit: <strong>Inutilis\u00e9<br \/>\nJavaScript<\/strong>.<\/p>\n<p>Cet audit n&#039;est pas <em>enti\u00e8rement<\/em> nouveau: c&#039;\u00e9tait <a rel=\"nofollow noopener noreferrer\" target=\"_blank\" href=\"https:\/\/github.com\/GoogleChrome\/lighthouse\/issues\/1852#issuecomment-306900595\">ajout\u00e9 dans<br \/>\nmi-2017<\/a>, mais<br \/>\nen raison de la surcharge de performance, il a \u00e9t\u00e9 d\u00e9sactiv\u00e9 par d\u00e9faut pour que le phare reste aussi rapide que<br \/>\npossible. La collecte de ces donn\u00e9es de couverture est maintenant beaucoup plus efficace, nous nous sentons donc \u00e0 l&#039;aise d&#039;activer<br \/>\npar d\u00e9faut.<\/p>\n<h3 id=\"a11y\"><span class=\"ez-toc-section\" id=\"Accessibility-audits\"><\/span>Audits d&#039;accessibilit\u00e9 <span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>Lighthouse utilise le merveilleux <a rel=\"nofollow noopener noreferrer\" target=\"_blank\" href=\"https:\/\/github.com\/dequelabs\/axe-core\">noyau de hache<\/a> biblioth\u00e8que pour alimenter le<br \/>\ncat\u00e9gorie d&#039;accessibilit\u00e9. Dans Lighthouse 6.0, nous avons ajout\u00e9 les audits suivants:<\/p>\n<h3 id=\"maskable-icon\"><span class=\"ez-toc-section\" id=\"Maskable-icon\"><\/span>Ic\u00f4ne masquable <span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>Ic\u00f4nes masquables est un nouveau format d&#039;ic\u00f4ne qui cr\u00e9e des ic\u00f4nes pour votre PWA<br \/>\nont fi\u00e8re allure sur tous les types d&#039;appareils. Pour que votre PWA soit aussi belle que possible, nous avons introduit<br \/>\nun nouvel audit pour v\u00e9rifier si votre manifest.json prend en charge ce nouveau format.<\/p>\n<h3 id=\"charset\"><span class=\"ez-toc-section\" id=\"Charset-declaration\"><\/span>D\u00e9claration du jeu de caract\u00e8res <span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>L&#039;\u00e9l\u00e9ment meta charset d\u00e9clare quel encodage de caract\u00e8res doit \u00eatre utilis\u00e9<br \/>\npour interpr\u00e9ter un document HTML. Si cet \u00e9l\u00e9ment est manquant, ou s&#039;il est d\u00e9clar\u00e9 tardivement<br \/>\ndocument, les navigateurs utilisent un certain nombre d&#039;heuristiques pour deviner quel encodage doit \u00eatre utilis\u00e9. Si un<br \/>\nle navigateur ne devine pas correctement, et un \u00e9l\u00e9ment meta charset tardif est trouv\u00e9, l&#039;analyseur lance g\u00e9n\u00e9ralement<br \/>\ntout le travail effectu\u00e9 jusqu&#039;\u00e0 pr\u00e9sent et recommence, conduisant \u00e0 de mauvaises exp\u00e9riences pour l&#039;utilisateur. Cette nouvelle<br \/>\naudit v\u00e9rifie que la page a un encodage de caract\u00e8res valide et qu&#039;elle est d\u00e9finie au d\u00e9but et au d\u00e9but.<\/p>\n<h2 id=\"ci\"><span class=\"ez-toc-section\" id=\"Lighthouse-CI\"><\/span>Phare CI <span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>Au CDS en novembre dernier<br \/>\nnous avons annonc\u00e9 <a rel=\"nofollow noopener noreferrer\" target=\"_blank\" href=\"https:\/\/github.com\/GoogleChrome\/lighthouse-ci\">Phare CI<\/a>, le n\u0153ud open source<br \/>\nCLI et serveur qui suit les r\u00e9sultats de Lighthouse \u00e0 chaque validation dans votre int\u00e9gration continue<br \/>\npipeline, et nous avons parcouru un long chemin depuis la sortie alpha. Lighthouse CI a maintenant un support<br \/>\npour de nombreux fournisseurs de CI, notamment Travis, Circle, GitLab et Github Actions. Pr\u00eat \u00e0 d\u00e9ployer<br \/>\n<a rel=\"nofollow noopener noreferrer\" target=\"_blank\" href=\"https:\/\/github.com\/GoogleChrome\/lighthouse-ci\/tree\/master\/docs\/recipes\">images de docker<\/a> faire de la configuration un<br \/>\nBreeze, et une refonte compl\u00e8te du tableau de bord r\u00e9v\u00e8le d\u00e9sormais les tendances dans chaque cat\u00e9gorie et m\u00e9trique<br \/>\ndans Lighthouse pour une analyse d\u00e9taill\u00e9e.<\/p>\n<p>Commencez \u00e0 utiliser Lighthouse CI sur votre projet d\u00e8s aujourd&#039;hui en suivant notre<br \/>\n<a rel=\"nofollow noopener noreferrer\" target=\"_blank\" href=\"https:\/\/github.com\/GoogleChrome\/lighthouse-ci\/blob\/master\/docs\/getting-started.md\">Guide de D\u00e9marrage<\/a>.<\/p>\n<figure class=\"w-figure w-figure--inline-left\">\n<p>    <img alt='phare-ci-1-2123731' class=\"w-screenshot\" src='https:\/\/rmarketingdigital.com\/wp-content\/uploads\/2020\/10\/lighthouse-ci-1-2123731.png' width=\"600\"><\/p>\n<\/figure>\n<figure class=\"w-figure w-figure--inline-left\">\n<p>    <img alt='phare-ci-2-4937296' class=\"w-screenshot\" src='https:\/\/rmarketingdigital.com\/wp-content\/uploads\/2020\/10\/lighthouse-ci-2-4937296.png' width=\"600\"><\/p>\n<\/figure>\n<figure class=\"w-figure\">\n<p>    <img alt='phare-ci-3-3713028' class=\"w-screenshot\" src='https:\/\/rmarketingdigital.com\/wp-content\/uploads\/2020\/10\/lighthouse-ci-3-3713028.png' width=\"600\"><\/p>\n<\/figure>\n<p>Nous avons renomm\u00e9 le <strong>Audits<\/strong> panneau au <strong>Phare<\/strong> panneau. Assez dit!<\/p>\n<p>En fonction de la taille de votre fen\u00eatre DevTools, le panneau se trouve probablement derri\u00e8re le <code>\u00bb<\/code> bouton. Vous pouvez faire glisser<br \/>\nl&#039;onglet pour modifier l&#039;ordre.<\/p>\n<p>Pour r\u00e9v\u00e9ler rapidement le panneau avec le <a rel=\"nofollow noopener noreferrer\" target=\"_blank\" href=\"https:\/\/developers.google.com\/web\/tools\/chrome-devtools\/command-menu\">Commander<br \/>\nmenu<\/a>:<\/p>\n<ol>\n<li>presse <code>Ctrl + Maj + J<\/code> (ou alors <code>Commande + Option + J<\/code> sur Mac) pour ouvrir DevTools.<\/li>\n<li>presse <code>Contr\u00f4le + Maj + P<\/code> (ou alors <code>Commande + Maj + P<\/code> sur Mac) \u00e0<br \/>\nOuvrez le <strong>Commander<\/strong> menu.<\/li>\n<li>Commencez \u00e0 taper \u00abPhare\u00bb.<\/li>\n<li>presse <code>Entrer<\/code>.<\/li>\n<\/ol>\n<h2 id=\"emulation\"><span class=\"ez-toc-section\" id=\"Mobile-emulation\"><\/span>\u00c9mulation mobile <span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>Lighthouse suit un \u00e9tat d&#039;esprit ax\u00e9 sur le mobile. Les probl\u00e8mes de performances sont plus apparents sous<br \/>\nconditions mobiles, mais les d\u00e9veloppeurs ne testent souvent pas dans ces conditions. C&#039;est pourquoi la valeur par d\u00e9faut<br \/>\nLa configuration dans Lighthouse applique une \u00e9mulation mobile. L&#039;\u00e9mulation se compose de:<\/p>\n<ul>\n<li>Conditions de r\u00e9seau et CPU lentes simul\u00e9es (via un moteur de simulation appel\u00e9<br \/>\n<a rel=\"nofollow noopener noreferrer\" target=\"_blank\" href=\"https:\/\/github.com\/GoogleChrome\/lighthouse\/blob\/master\/docs\/lantern.md\">Lanterne<\/a>).<\/li>\n<li>\u00c9mulation d&#039;\u00e9cran de l&#039;appareil (la m\u00eame que celle trouv\u00e9e dans Chrome DevTools).<\/li>\n<\/ul>\n<p>Depuis le d\u00e9but, Lighthouse utilise le Nexus 5X comme appareil de r\u00e9f\u00e9rence. Ces derni\u00e8res ann\u00e9es, la plupart<br \/>\nles ing\u00e9nieurs de performance utilisent le Moto G4 \u00e0 des fins de test. Maintenant Lighthouse embo\u00eete le pas<br \/>\net a chang\u00e9 son appareil de r\u00e9f\u00e9rence en Moto G4. En pratique, ce changement n&#039;est pas tr\u00e8s perceptible,<br \/>\nmais voici tous les changements d\u00e9tectables par une page Web:<\/p>\n<ul>\n<li>La taille de l&#039;\u00e9cran passe de 412 \u00d7 660 px \u00e0 360 \u00d7 640 px.<\/li>\n<li>La cha\u00eene de l&#039;agent utilisateur est l\u00e9g\u00e8rement modifi\u00e9e, la partie de l&#039;appareil qui \u00e9tait auparavant <code>Nexus 5 Build \/ MRA58N<\/code><br \/>\nsera maintenant <code>Moto G (4)<\/code>.<\/li>\n<\/ul>\n<p>\u00c0 partir de Chrome 81, Moto G4 est \u00e9galement disponible dans la liste d&#039;\u00e9mulation d&#039;appareils Chrome DevTools.<\/p>\n<figure class=\"w-figure\">\n  <img alt='phare-motog4-3361904' class=\"w-screenshot w-screenshot--filled\" src='https:\/\/rmarketingdigital.com\/wp-content\/uploads\/2020\/10\/lighthouse-motog4-3361904.png'><br \/>\n<\/figure>\n<h2 id=\"extension\"><span class=\"ez-toc-section\" id=\"Browser-extension\"><\/span>Extension de navigateur <span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>le<br \/>\n<a rel=\"nofollow noopener noreferrer\" target=\"_blank\" href=\"https:\/\/chrome.google.com\/webstore\/detail\/lighthouse\/blipmdconlkpinefehnmjammfjpmpbjk\">Extension Chrome pour Lighthouse<\/a><br \/>\na \u00e9t\u00e9 un moyen pratique de g\u00e9rer Lighthouse localement. Malheureusement, c&#039;\u00e9tait compliqu\u00e9 \u00e0 supporter.<br \/>\nNous l&#039;avons ressenti parce que Chrome DevTools <strong>Phare<\/strong> panel est une meilleure exp\u00e9rience (le rapport<br \/>\ns&#039;int\u00e8gre avec d&#039;autres panneaux), nous pourrions r\u00e9duire nos frais g\u00e9n\u00e9raux d&#039;ing\u00e9nierie en simplifiant Chrome<br \/>\nextension.<\/p>\n<p>Au lieu d&#039;ex\u00e9cuter Lighthouse localement, l&#039;extension utilise d\u00e9sormais le <a rel=\"nofollow noopener noreferrer\" target=\"_blank\" href=\"https:\/\/developers.google.com\/speed\/docs\/insights\/v5\/get-started\">PageSpeed Insights<br \/>\nAPI<\/a>. Nous reconnaissons que ce sera<br \/>\nne suffira pas \u00e0 remplacer certains de nos utilisateurs. Voici les principales diff\u00e9rences:<\/p>\n<ul>\n<li>PageSpeed Insights ne peut pas auditer les sites Web non publics, car il est ex\u00e9cut\u00e9 via une t\u00e9l\u00e9commande<br \/>\nserveur et non votre instance Chrome locale. Si vous devez auditer un site Web non public, utilisez<br \/>\nles DevTools <strong>Phare<\/strong> panneau ou l&#039;interface de ligne de commande Node.<\/li>\n<li>Il n&#039;est pas garanti que PageSpeed Insights utilise la derni\u00e8re version de Lighthouse. Si vous souhaitez utiliser<br \/>\nla derni\u00e8re version, utilisez le Node CLI. L&#039;extension de navigateur recevra la mise \u00e0 jour environ 1 \u00e0 2 semaines apr\u00e8s la publication.<\/li>\n<li>PageSpeed Insights est une API Google, son utilisation implique l&#039;acceptation des conditions g\u00e9n\u00e9rales de l&#039;API Google de<br \/>\nUn service. Si vous ne souhaitez pas ou ne pouvez pas accepter les conditions d&#039;utilisation, utilisez les DevTools <strong>Phare<\/strong> panneau,<br \/>\nou le Node CLI.<\/li>\n<\/ul>\n<p>La bonne nouvelle est que la simplification de l&#039;histoire du produit nous a permis de nous concentrer sur d&#039;autres techniques<br \/>\nprobl\u00e8mes. En cons\u00e9quence, nous avons publi\u00e9 le <a rel=\"nofollow noopener noreferrer\" target=\"_blank\" href=\"https:\/\/addons.mozilla.org\/en-US\/firefox\/addon\/google-lighthouse\/\">Phare Firefox<br \/>\nextension<\/a>!<\/p>\n<h2 id=\"budgets\"><span class=\"ez-toc-section\" id=\"Budgets\"><\/span>Les budgets <span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>Lighthouse 5.0 a introduit des budgets de performance qui<br \/>\nprise en charge de l&#039;ajout de seuils pour<br \/>\n<a rel=\"nofollow noopener noreferrer\" target=\"_blank\" href=\"https:\/\/github.com\/GoogleChrome\/lighthouse\/blob\/master\/docs\/performance-budgets.md#resource-budgets\">combien de chaque type de ressource<\/a><br \/>\n(comme des scripts, des images ou des css) qu&#039;une page peut servir.<\/p>\n<p>Lighthouse 6.0 ajoute<br \/>\n<a rel=\"nofollow noopener noreferrer\" target=\"_blank\" href=\"https:\/\/github.com\/GoogleChrome\/lighthouse\/blob\/master\/docs\/performance-budgets.md#timing-budgets\">prise en charge des mesures de budg\u00e9tisation<\/a>,<br \/>\nvous pouvez maintenant d\u00e9finir des seuils pour des m\u00e9triques sp\u00e9cifiques telles que FCP. Pour l&#039;instant, les budgets ne sont disponibles que<br \/>\nau Node CLI et Lighthouse CI.<\/p>\n<h2 id=\"source-location\"><span class=\"ez-toc-section\" id=\"Source-location-links\"><\/span>Liens d&#039;emplacement source <span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>Certains des probl\u00e8mes que Lighthouse trouve sur une page peuvent \u00eatre attribu\u00e9s \u00e0 une ligne sp\u00e9cifique de<br \/>\nle code source et le rapport indiqueront le fichier et la ligne exacts qui sont pertinents. Pour rendre cela facile<br \/>\nexplorer dans DevTools, cliquer sur les emplacements sp\u00e9cifi\u00e9s dans le rapport ouvrira les fichiers concern\u00e9s<br \/>\ndans le <strong>Sources<\/strong> panneau.<\/p>\n<figure class=\"w-figure\">\n  <video autoplay=\"\" loop=\"\" muted=\"\" playsinline=\"\" class=\"w-screenshot\"><source src=\"https:\/\/storage.googleapis.com\/web-dev-assets\/lighthouse-whats-new-6.0\/lighthouse-source-location.webm\" type=\"video\/webm\"><source src=\"https:\/\/storage.googleapis.com\/web-dev-assets\/lighthouse-whats-new-6.0\/lighthouse-source-location.mp4\" type=\"video\/mp4\"><\/source><\/source><\/video><figcaption class=\"w-caption\">\n    DevTools r\u00e9v\u00e8le la ligne de code exacte \u00e0 l&#039;origine du probl\u00e8me.<br \/>\n  <\/figcaption><\/figure>\n<h2 id=\"horizon\"><span class=\"ez-toc-section\" id=\"On-the-horizon\"><\/span>Sur l&#039;horizon <span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>Lighthouse a commenc\u00e9 \u00e0 exp\u00e9rimenter la collecte de cartes sources pour alimenter de nouvelles fonctionnalit\u00e9s, telles que:<\/p>\n<ul>\n<li>D\u00e9tecter les modules en double dans les bundles JavaScript.<\/li>\n<li>D\u00e9tecter les polyfills excessifs ou les transformations dans le code envoy\u00e9 aux navigateurs modernes.<\/li>\n<li>Augmenter l&#039;audit JavaScript inutilis\u00e9 pour fournir une granularit\u00e9 au niveau du module.<\/li>\n<li>Visualisations de Treemap mettant en \u00e9vidence les modules qui n\u00e9cessitent une action.<\/li>\n<li>Affichage du code source d&#039;origine pour les \u00e9l\u00e9ments de rapport avec un &quot;emplacement source&quot;.<\/li>\n<\/ul>\n<figure class=\"w-figure\">\n  <img alt='phare-sourcemaps-non-utilis\u00e9js-8218644' class=\"w-screenshot\" src='https:\/\/rmarketingdigital.com\/wp-content\/uploads\/2020\/10\/lighthouse-sourcemaps-unusedjs-8218644.png' width=\"600\"><figcaption class=\"w-caption\">\n    L&#039;audit JavaScript inutilis\u00e9 utilisant des mappages de sources pour afficher le code inutilis\u00e9 dans des modules group\u00e9s sp\u00e9cifiques.<br \/>\n  <\/figcaption><\/figure>\n<p>Ces fonctionnalit\u00e9s seront activ\u00e9es par d\u00e9faut dans une future version de Lighthouse. Pour l&#039;instant, vous pouvez voir<br \/>\nAudits exp\u00e9rimentaux de Lighthouse avec l&#039;indicateur CLI suivant:<\/p>\n<p><web-copy-code><\/p>\n<pre class=\"language-bash\"><code class=\"language-bash\">phare https:\/\/web.dev --view --preset exp\u00e9rimental<\/code><\/pre>\n<p><\/web-copy-code><\/p>\n<h2 id=\"thanks\"><span class=\"ez-toc-section\" id=\"Thank-you\"><\/span>Merci! <span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>Nous vous remercions d&#039;utiliser Lighthouse et de nous faire part de vos commentaires. Vos commentaires nous aident \u00e0 am\u00e9liorer Lighthouse<br \/>\net nous esp\u00e9rons que Lighthouse 6.0 vous permettra d&#039;am\u00e9liorer plus facilement les performances de votre<br \/>\nsites Internet.<\/p>\n<p>Que pouvez-vous faire ensuite?<\/p>\n<ul>\n<li>Ouvrez Chrome Canary et donnez au <strong>Phare<\/strong> panneau pour aller.<\/li>\n<li>Utilisez le Node CLI: <code>npm install -g phare &amp;&amp; phare https:\/\/yoursite.com --view<\/code>.<\/li>\n<li>Obtenir <a rel=\"nofollow noopener noreferrer\" target=\"_blank\" href=\"https:\/\/github.com\/GoogleChrome\/lighthouse-ci#lighthouse-ci\">Phare CI<\/a> courir avec<br \/>\nvotre projet.<\/li>\n<li>Consultez la documentation d&#039;audit de Lighthouse.<\/li>\n<li>Amusez-vous \u00e0 am\u00e9liorer le Web!<\/li>\n<\/ul>\n<p>Nous sommes passionn\u00e9s par le Web et nous aimons travailler avec la communaut\u00e9 des d\u00e9veloppeurs pour cr\u00e9er des outils pour<br \/>\naider \u00e0 am\u00e9liorer le Web. Lighthouse est un projet open source et nous remercions tous les<br \/>\ncontributeurs aidant \u00e0 tout, des corrections de faute de frappe aux refactors de documentation en passant par les tout nouveaux<br \/>\naudits.<br \/>\n<a rel=\"nofollow noopener noreferrer\" target=\"_blank\" href=\"https:\/\/github.com\/GoogleChrome\/lighthouse\/blob\/master\/CONTRIBUTING.md\">Int\u00e9ress\u00e9 \u00e0 contribuer?<\/a><br \/>\nBalancer par le <a rel=\"nofollow noopener noreferrer\" target=\"_blank\" href=\"https:\/\/github.com\/GoogleChrome\/lighthouse\">Repo GitHub Lighthouse<\/a>.<\/p>\n<p>    <web-feedback additional-questions=\"\"><\/web-feedback>\n  <\/div>\n<p><script async src=\"\/\/platform.twitter.com\/widgets.js\" charset=\"utf-8\"><\/script><\/p>","protected":false},"excerpt":{"rendered":"<p>New metrics, Performance score update, new audits, and more. May 19, 2020 Today we&#8217;re releasing Lighthouse 6.0! Lighthouse is an automated website auditing tool that helps developers with opportunities and&#8230;<\/p>","protected":false},"author":1,"featured_media":92985,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[1356],"tags":[1434,1418],"class_list":["post-92984","post","type-post","status-publish","format-standard","has-post-thumbnail","category-dev","tag-chrome","tag-mac"],"yoast_head":"<!-- This site is optimized with the Yoast SEO Premium plugin v27.0 (Yoast SEO v28.2) - https:\/\/yoast.com\/product\/yoast-seo-premium-wordpress\/ -->\n<title>What&#039;s New in Lighthouse 6.0 - R Marketing Digital<\/title>\n<meta name=\"description\" content=\"New metrics, Performance score update, new audits, and more. May 19, 2020 Today we&#039;re releasing Lighthouse 6.0! Lighthouse is an automated website\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/rmarketingdigital.com\/fr\/dev\/whats-new-in-lighthouse-6-0\/\" \/>\n<meta property=\"og:locale\" content=\"fr_FR\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"What&#039;s New in Lighthouse 6.0\" \/>\n<meta property=\"og:description\" content=\"New metrics, Performance score update, new audits, and more. May 19, 2020 Today we&#039;re releasing Lighthouse 6.0! Lighthouse is an automated website\" \/>\n<meta property=\"og:url\" content=\"https:\/\/rmarketingdigital.com\/fr\/dev\/whats-new-in-lighthouse-6-0\/\" \/>\n<meta property=\"og:site_name\" content=\"R Marketing Digital\" \/>\n<meta property=\"article:published_time\" content=\"2022-10-20T21:45:39+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/rmarketingdigital.com\/wp-content\/uploads\/2020\/10\/lighthouse-logo-5769199.svg.svg+xml\" \/>\n\t<meta property=\"og:image:width\" content=\"1\" \/>\n\t<meta property=\"og:image:height\" content=\"1\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"author\" content=\"R Marketing Digital\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/rmarketingdigital.com\\\/dev\\\/whats-new-in-lighthouse-6-0\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/rmarketingdigital.com\\\/dev\\\/whats-new-in-lighthouse-6-0\\\/\"},\"author\":{\"name\":\"R Marketing Digital\",\"@id\":\"https:\\\/\\\/rmarketingdigital.com\\\/#\\\/schema\\\/person\\\/7c0d9782b2977b840b3740f00c69a73e\"},\"headline\":\"What&#8217;s New in Lighthouse 6.0\",\"datePublished\":\"2022-10-20T21:45:39+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/rmarketingdigital.com\\\/dev\\\/whats-new-in-lighthouse-6-0\\\/\"},\"wordCount\":2336,\"image\":{\"@id\":\"https:\\\/\\\/rmarketingdigital.com\\\/dev\\\/whats-new-in-lighthouse-6-0\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/rmarketingdigital.com\\\/wp-content\\\/uploads\\\/2020\\\/10\\\/lighthouse-logo-5769199.svg.svg+xml\",\"keywords\":[\"Chrome\",\"Mac\"],\"articleSection\":[\"Dev\"],\"inLanguage\":\"fr-FR\"},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/rmarketingdigital.com\\\/dev\\\/whats-new-in-lighthouse-6-0\\\/\",\"url\":\"https:\\\/\\\/rmarketingdigital.com\\\/dev\\\/whats-new-in-lighthouse-6-0\\\/\",\"name\":\"What's New in Lighthouse 6.0 - R Marketing Digital\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/rmarketingdigital.com\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/rmarketingdigital.com\\\/dev\\\/whats-new-in-lighthouse-6-0\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/rmarketingdigital.com\\\/dev\\\/whats-new-in-lighthouse-6-0\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/rmarketingdigital.com\\\/wp-content\\\/uploads\\\/2020\\\/10\\\/lighthouse-logo-5769199.svg.svg+xml\",\"datePublished\":\"2022-10-20T21:45:39+00:00\",\"author\":{\"@id\":\"https:\\\/\\\/rmarketingdigital.com\\\/#\\\/schema\\\/person\\\/7c0d9782b2977b840b3740f00c69a73e\"},\"description\":\"New metrics, Performance score update, new audits, and more. May 19, 2020 Today we're releasing Lighthouse 6.0! Lighthouse is an automated website\",\"inLanguage\":\"fr-FR\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/rmarketingdigital.com\\\/dev\\\/whats-new-in-lighthouse-6-0\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"fr-FR\",\"@id\":\"https:\\\/\\\/rmarketingdigital.com\\\/dev\\\/whats-new-in-lighthouse-6-0\\\/#primaryimage\",\"url\":\"https:\\\/\\\/rmarketingdigital.com\\\/wp-content\\\/uploads\\\/2020\\\/10\\\/lighthouse-logo-5769199.svg.svg+xml\",\"contentUrl\":\"https:\\\/\\\/rmarketingdigital.com\\\/wp-content\\\/uploads\\\/2020\\\/10\\\/lighthouse-logo-5769199.svg.svg+xml\",\"caption\":\"lighthouse-logo-5769199-svg_-3706970-svgxml\"},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/rmarketingdigital.com\\\/#website\",\"url\":\"https:\\\/\\\/rmarketingdigital.com\\\/\",\"name\":\"R Marketing Digital\",\"description\":\"Agencia SEO | Publicidad redes sociales | Community Management\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/rmarketingdigital.com\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"fr-FR\"},{\"@type\":\"Person\",\"@id\":\"https:\\\/\\\/rmarketingdigital.com\\\/#\\\/schema\\\/person\\\/7c0d9782b2977b840b3740f00c69a73e\",\"name\":\"R Marketing Digital\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"fr-FR\",\"@id\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/c5599c203e0120b8ccbff4666af86f35f9b3dcad468a8bc6295313a3964a80be?s=96&d=mm&r=g\",\"url\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/c5599c203e0120b8ccbff4666af86f35f9b3dcad468a8bc6295313a3964a80be?s=96&d=mm&r=g\",\"contentUrl\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/c5599c203e0120b8ccbff4666af86f35f9b3dcad468a8bc6295313a3964a80be?s=96&d=mm&r=g\",\"caption\":\"R Marketing Digital\"}}]}<\/script>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"What's New in Lighthouse 6.0 - R Marketing Digital","description":"New metrics, Performance score update, new audits, and more. May 19, 2020 Today we're releasing Lighthouse 6.0! Lighthouse is an automated website","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/rmarketingdigital.com\/fr\/dev\/whats-new-in-lighthouse-6-0\/","og_locale":"fr_FR","og_type":"article","og_title":"What's New in Lighthouse 6.0","og_description":"New metrics, Performance score update, new audits, and more. May 19, 2020 Today we're releasing Lighthouse 6.0! Lighthouse is an automated website","og_url":"https:\/\/rmarketingdigital.com\/fr\/dev\/whats-new-in-lighthouse-6-0\/","og_site_name":"R Marketing Digital","article_published_time":"2022-10-20T21:45:39+00:00","og_image":[{"url":"https:\/\/rmarketingdigital.com\/wp-content\/uploads\/2020\/10\/lighthouse-logo-5769199.svg.svg+xml","width":1,"height":1,"type":"image\/jpeg"}],"author":"R Marketing Digital","twitter_card":"summary_large_image","schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/rmarketingdigital.com\/dev\/whats-new-in-lighthouse-6-0\/#article","isPartOf":{"@id":"https:\/\/rmarketingdigital.com\/dev\/whats-new-in-lighthouse-6-0\/"},"author":{"name":"R Marketing Digital","@id":"https:\/\/rmarketingdigital.com\/#\/schema\/person\/7c0d9782b2977b840b3740f00c69a73e"},"headline":"What&#8217;s New in Lighthouse 6.0","datePublished":"2022-10-20T21:45:39+00:00","mainEntityOfPage":{"@id":"https:\/\/rmarketingdigital.com\/dev\/whats-new-in-lighthouse-6-0\/"},"wordCount":2336,"image":{"@id":"https:\/\/rmarketingdigital.com\/dev\/whats-new-in-lighthouse-6-0\/#primaryimage"},"thumbnailUrl":"https:\/\/rmarketingdigital.com\/wp-content\/uploads\/2020\/10\/lighthouse-logo-5769199.svg.svg+xml","keywords":["Chrome","Mac"],"articleSection":["Dev"],"inLanguage":"fr-FR"},{"@type":"WebPage","@id":"https:\/\/rmarketingdigital.com\/dev\/whats-new-in-lighthouse-6-0\/","url":"https:\/\/rmarketingdigital.com\/dev\/whats-new-in-lighthouse-6-0\/","name":"What's New in Lighthouse 6.0 - R Marketing Digital","isPartOf":{"@id":"https:\/\/rmarketingdigital.com\/#website"},"primaryImageOfPage":{"@id":"https:\/\/rmarketingdigital.com\/dev\/whats-new-in-lighthouse-6-0\/#primaryimage"},"image":{"@id":"https:\/\/rmarketingdigital.com\/dev\/whats-new-in-lighthouse-6-0\/#primaryimage"},"thumbnailUrl":"https:\/\/rmarketingdigital.com\/wp-content\/uploads\/2020\/10\/lighthouse-logo-5769199.svg.svg+xml","datePublished":"2022-10-20T21:45:39+00:00","author":{"@id":"https:\/\/rmarketingdigital.com\/#\/schema\/person\/7c0d9782b2977b840b3740f00c69a73e"},"description":"New metrics, Performance score update, new audits, and more. May 19, 2020 Today we're releasing Lighthouse 6.0! Lighthouse is an automated website","inLanguage":"fr-FR","potentialAction":[{"@type":"ReadAction","target":["https:\/\/rmarketingdigital.com\/dev\/whats-new-in-lighthouse-6-0\/"]}]},{"@type":"ImageObject","inLanguage":"fr-FR","@id":"https:\/\/rmarketingdigital.com\/dev\/whats-new-in-lighthouse-6-0\/#primaryimage","url":"https:\/\/rmarketingdigital.com\/wp-content\/uploads\/2020\/10\/lighthouse-logo-5769199.svg.svg+xml","contentUrl":"https:\/\/rmarketingdigital.com\/wp-content\/uploads\/2020\/10\/lighthouse-logo-5769199.svg.svg+xml","caption":"lighthouse-logo-5769199-svg_-3706970-svgxml"},{"@type":"WebSite","@id":"https:\/\/rmarketingdigital.com\/#website","url":"https:\/\/rmarketingdigital.com\/","name":"Marketing num\u00e9rique","description":"Agence de r\u00e9f\u00e9rencement | Publicit\u00e9 sur les r\u00e9seaux sociaux | Gestion de communaut\u00e9","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/rmarketingdigital.com\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"fr-FR"},{"@type":"Person","@id":"https:\/\/rmarketingdigital.com\/#\/schema\/person\/7c0d9782b2977b840b3740f00c69a73e","name":"Marketing num\u00e9rique","image":{"@type":"ImageObject","inLanguage":"fr-FR","@id":"https:\/\/secure.gravatar.com\/avatar\/c5599c203e0120b8ccbff4666af86f35f9b3dcad468a8bc6295313a3964a80be?s=96&d=mm&r=g","url":"https:\/\/secure.gravatar.com\/avatar\/c5599c203e0120b8ccbff4666af86f35f9b3dcad468a8bc6295313a3964a80be?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/c5599c203e0120b8ccbff4666af86f35f9b3dcad468a8bc6295313a3964a80be?s=96&d=mm&r=g","caption":"R Marketing Digital"}}]}},"_links":{"self":[{"href":"https:\/\/rmarketingdigital.com\/fr\/wp-json\/wp\/v2\/posts\/92984","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/rmarketingdigital.com\/fr\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/rmarketingdigital.com\/fr\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/rmarketingdigital.com\/fr\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/rmarketingdigital.com\/fr\/wp-json\/wp\/v2\/comments?post=92984"}],"version-history":[{"count":0,"href":"https:\/\/rmarketingdigital.com\/fr\/wp-json\/wp\/v2\/posts\/92984\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/rmarketingdigital.com\/fr\/wp-json\/wp\/v2\/media\/92985"}],"wp:attachment":[{"href":"https:\/\/rmarketingdigital.com\/fr\/wp-json\/wp\/v2\/media?parent=92984"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/rmarketingdigital.com\/fr\/wp-json\/wp\/v2\/categories?post=92984"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/rmarketingdigital.com\/fr\/wp-json\/wp\/v2\/tags?post=92984"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}