{"id":83160,"date":"2022-09-24T03:12:59","date_gmt":"2022-09-24T01:12:59","guid":{"rendered":"https:\/\/rmarketingdigital.com\/dev\/resumen-de-web-dev-live\/"},"modified":"2020-09-16T19:00:51","modified_gmt":"2020-09-16T22:00:51","slug":"resumen-de-web-dev-live","status":"publish","type":"post","link":"https:\/\/rmarketingdigital.com\/de\/dev\/resumen-de-web-dev-live\/","title":{"rendered":"Zusammenfassung von web.dev LIVE"},"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\">Inhalt<\/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=\"Inhaltsverzeichnis umschalten\"><span class=\"ez-toc-js-icon-con\"><span class=\"\"><span class=\"eztoc-hide\" style=\"display:none;\">Umschalten<\/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\/de\/dev\/resumen-de-web-dev-live\/#Vitales-web\" >Web-Vitalwerte<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-2\" href=\"https:\/\/rmarketingdigital.com\/de\/dev\/resumen-de-web-dev-live\/#Privacidad-y-seguridad-en-la-web\" >Datenschutz und Sicherheit im Web<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-3\" href=\"https:\/\/rmarketingdigital.com\/de\/dev\/resumen-de-web-dev-live\/#Construyendo-una-web-con-poderosas-capacidades\" >Erstellen einer Website mit leistungsstarken Funktionen<\/a><ul class='ez-toc-list-level-3' ><li class='ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-4\" href=\"https:\/\/rmarketingdigital.com\/de\/dev\/resumen-de-web-dev-live\/#Chrome-Devtools-nueva-pestana-Problemas-emulador-de-deficiencias-de-color-y-compatibilidad-con-Web-Vitals\" >Chrome Devtools: Registerkarte \u201eNeue Probleme\u201c, Farbmangel-Emulator und Web Vitals-Unterst\u00fctzung<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-5\" href=\"https:\/\/rmarketingdigital.com\/de\/dev\/resumen-de-web-dev-live\/#Lighthouse-60-nuevas-metricas-mediciones-de-laboratorio-de-Core-Web-Vitals-una-puntuacion-de-rendimiento-actualizada-y-nuevas-auditorias\" >Lighthouse 6.0: Neue Metriken, Core Web Vitals-Labormessungen, eine aktualisierte Leistungsbewertung und neue Audits<\/a><\/li><\/ul><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-6\" href=\"https:\/\/rmarketingdigital.com\/de\/dev\/resumen-de-web-dev-live\/#Aprende-mas\" >Mehr erfahren<\/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<p>          Eine Zusammenfassung der wichtigsten Neuigkeiten und Updates, die w\u00e4hrend unserer dreit\u00e4gigen Online-Community-Veranstaltung angek\u00fcndigt wurden, sowie eine Erinnerung an bevorstehende regionale Veranstaltungen.<\/p>\n<p>\n          <time>6. Juli 2020<\/time><\/p>\n<\/header>\n<p>Wir haben gerade unsere dreit\u00e4gige Veranstaltung web.dev LIVE abgeschlossen, bei der einige Mitglieder der Web-Community online zusammenkamen, um \u00fcber den Stand der Webentwicklung zu sprechen. Wir begannen jeden Tag in einer anderen regionalen Zeitzone und Google-Mitarbeiter tauschten eine Reihe von Updates, Neuigkeiten und Tipps aus, um Entwicklern mit Tools und Anleitungen zu helfen, das Web stabil, leistungsstark und zug\u00e4nglich zu halten.<\/p>\n<p>Wenn Sie einen Teil des Live-Streams verpasst haben, werden alle Sitzungen aufgezeichnet und stehen Ihnen zum Anschauen auf YouTube zur Verf\u00fcgung. Wir haben auch bevorstehende regionale Veranstaltungen auf der ganzen Welt, die von Google Developer Groups veranstaltet werden und Deep-Dive-Sessions zu Themen anbieten, die im Zusammenhang mit dem stehen, was wir bei web.dev LIVE behandelt haben.<\/p>\n<p>Schauen wir uns einige der Neuigkeiten und Updates an, die im Laufe der drei Tage geteilt wurden.<\/p>\n<h2 id=\"web-vitals\"><span class=\"ez-toc-section\" id=\"Vitales-web\"><\/span>Web-Vitalwerte <span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>Das Chrome-Team<br \/>\n<a rel=\"nofollow noopener noreferrer\" target=\"_blank\" href=\"https:\/\/blog.chromium.org\/2020\/05\/introducing-web-vitals-essential-metrics.html\">Angek\u00fcndigt<\/a> die Web Vitals-Initiative zur Bereitstellung einheitlicher Anleitungen, Metriken und Tools, um Entwicklern dabei zu helfen, gro\u00dfartige Benutzererlebnisse im Web zu bieten. Auch das Google Search-Team <a rel=\"nofollow noopener noreferrer\" target=\"_blank\" href=\"https:\/\/webmasters.googleblog.com\/2020\/05\/evaluating-page-experience.html\">k\u00fcrzlich angek\u00fcndigt<\/a> Dabei wird die Seitenerfahrung als Ranking-Kriterium bewertet und Core Web Vitals-Metriken als Grundlage einbezogen.<\/p>\n<p>Die drei S\u00e4ulen der 2020 Core Web Vitals sind das Laden von Seiteninhalten, Interaktivit\u00e4t und visuelle Stabilit\u00e4t, die durch die folgenden Metriken erfasst werden:<\/p>\n<figure class=\"w-figure\">\n  <img alt='corewebvitals-5974435' src='https:\/\/rmarketingdigital.com\/wp-content\/uploads\/2020\/09\/corewebvitals-5974435.png'><br \/>\n<\/figure>\n<ul>\n<li>Ein gr\u00f6\u00dferer Content-Paint misst die wahrgenommene Ladegeschwindigkeit und markiert den Punkt auf der Seitenladezeitleiste, an dem der Hauptinhalt einer Seite wahrscheinlich geladen wurde.<\/li>\n<li>First Input Delay misst die Reaktionsf\u00e4higkeit und quantifiziert die Erfahrung, die Benutzer empfinden, wenn sie zum ersten Mal versuchen, mit einer Seite zu interagieren.<\/li>\n<li>Die kumulative Layoutverschiebung misst die visuelle Stabilit\u00e4t und quantifiziert das Ausma\u00df unerwarteter Bewegungen des Seiteninhalts.<\/li>\n<\/ul>\n<p>Bei web.dev LIVE teilen wir Best Practices dazu <a rel=\"nofollow noopener noreferrer\" target=\"_blank\" href=\"https:\/\/youtu.be\/AQqFZ5t8uNc\">Optimieren Sie f\u00fcr Core Web Vitals<\/a> und wie man es benutzt <a rel=\"nofollow noopener noreferrer\" target=\"_blank\" href=\"https:\/\/youtu.be\/OHb3xZIqUeU\">Chrome DevTools, um die Grundwerte Ihrer Website zu erkunden<\/a>. Wir teilen auch viele andere leistungsbezogene Vortr\u00e4ge, die Sie unter web.dev\/live im Zeitplan f\u00fcr Tag 1 finden.<\/p>\n<p>Die Entwicklung f\u00fcr eine so umfassende Plattform wie das Internet kann eine Herausforderung sein. Build-Tools stehen oft im Mittelpunkt Ihres Webentwicklungsprojekts und spielen eine Schl\u00fcsselrolle bei der Verwaltung Ihres Entwickler- und Produktlebenszyklus.<\/p>\n<p>Wir haben alle schon einmal unhandliche Build-Konfigurationsdateien gesehen, die Webentwicklern helfen sollen <em>y<\/em> Tool-Autoren meistern die Komplexit\u00e4t des Webs, wir haben tooling.report erstellt. Auf dieser Website k\u00f6nnen Sie das richtige Build-Tool f\u00fcr Ihr n\u00e4chstes Projekt ausw\u00e4hlen, entscheiden, ob sich die Migration von einem Tool zu einem anderen lohnt, oder herausfinden, wie Sie Best Practices in Ihre Tool- und Codebasis-Einrichtung integrieren k\u00f6nnen.<\/p>\n<p>Wir haben eine Reihe von Tests entwickelt, um festzustellen, mit welchen Build-Tools Sie die Best Practices f\u00fcr die Webentwicklung befolgen k\u00f6nnen. Wir arbeiten mit Build-Tool-Autoren zusammen, um sicherzustellen, dass wir ihre Tools korrekt verwenden und fair darstellen.<\/p>\n<figure class=\"w-figure\">\n  <img alt='Werkzeugbericht-2949255' class=\"w-screenshot\" src='https:\/\/rmarketingdigital.com\/wp-content\/uploads\/2020\/09\/toolingreport-2949255.png'><br \/>\n<\/figure>\n<p>Die erste Version von tooling.report deckt Webpack v4, Rollup v2, Parcel v2 und Browserify with Gulp ab, die derzeit die beliebtesten Build-Tools zu sein scheinen. Wir haben tooling.report mit der Flexibilit\u00e4t entwickelt, mit Hilfe der Community weitere Build-Tools und zus\u00e4tzliche Tests hinzuzuf\u00fcgen.<\/p>\n<p>Wenn uns eine Best Practice fehlt, die getestet werden sollte, <a rel=\"nofollow noopener noreferrer\" target=\"_blank\" href=\"https:\/\/github.com\/GoogleChromeLabs\/tooling.report\/issues\/new\">Schlagen Sie es in einer GitHub-Ausgabe vor<\/a>. Wenn Sie bereit sind, einen Test zu schreiben oder ein neues Tool hinzuzuf\u00fcgen, das wir nicht im urspr\u00fcnglichen Satz enthalten haben, laden wir Sie dazu ein<br \/>\n<a rel=\"nofollow noopener noreferrer\" target=\"_blank\" href=\"https:\/\/github.com\/GoogleChromeLabs\/tooling.report\/blob\/dev\/CONTRIBUTING.md\">beitragen<\/a>!<\/p>\n<p>In der Zwischenzeit k\u00f6nnen Sie mehr \u00fcber unseren Ansatz zur Erstellung von tooling.report lesen und unsere Sitzung von web.dev LIVE verfolgen.<\/p>\n<h2 id=\"privacy-and-security-on-the-web\"><span class=\"ez-toc-section\" id=\"Privacidad-y-seguridad-en-la-web\"><\/span>Datenschutz und Sicherheit im Web <span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>Chrome glaubt an ein offenes Web, das die Privatsph\u00e4re der Nutzer respektiert und wichtige Anwendungsf\u00e4lle bereith\u00e4lt, die daf\u00fcr sorgen, dass das Web f\u00fcr alle funktioniert.<\/p>\n<p>Im Jahr 2019 Chrome<br \/>\n<a rel=\"nofollow noopener noreferrer\" target=\"_blank\" href=\"https:\/\/blog.chromium.org\/2019\/05\/improving-privacy-and-security-on-web.html\">vorgeschlagen<\/a> eine Aktualisierung des Cookie-Standards, um Cookies standardm\u00e4\u00dfig auf Kontexte von Erstanbietern zu beschr\u00e4nken und zu verlangen, dass Cookies f\u00fcr Kontexte von Drittanbietern explizit als solche gekennzeichnet werden. Dies stellt insbesondere eine Verteidigungslinie gegen Cross-Site-Request-Forgery-Angriffe dar. Der Vorschlag wird jetzt von Chrome, Firefox, Edge und anderen Browsern \u00fcbernommen.<\/p>\n<p>W\u00e4hrend Chrome entschieden hat <a rel=\"nofollow noopener noreferrer\" target=\"_blank\" href=\"https:\/\/blog.chromium.org\/2020\/04\/temporarily-rolling-back-samesite.html\">vor\u00fcbergehende Umkehr<\/a> Angesichts dieser Ver\u00e4nderungen im Zusammenhang mit COVID-19 ist in einer Krise, in der die Menschen am st\u00e4rksten gef\u00e4hrdet sind, leider auch eine Zunahme dieser Art von Angriffen zu beobachten. Mit der stabilen Ver\u00f6ffentlichung von Chrome 84 (Mitte Juli 2020) \u00e4ndern sich die \u00c4nderungen<br \/>\n<a rel=\"nofollow noopener noreferrer\" target=\"_blank\" href=\"https:\/\/www.chromium.org\/updates\/same-site?pli=1#20200528\">beginnen sich wieder zu entfalten<\/a> in allen Chrome-Versionen ab 80. Weitere Informationen finden Sie im Cookie-Leitfaden von SameSite sowie in der web.dev LIVE-Sitzung.<\/p>\n<p>Dar\u00fcber hinaus unter dem Banner der <a rel=\"nofollow noopener noreferrer\" target=\"_blank\" href=\"https:\/\/blog.chromium.org\/2020\/01\/building-more-private-web-path-towards.html\">Datenschutz-Sandbox<\/a> Chrome stellt eine Reihe von Standardvorschl\u00e4gen vor, die darauf abzielen, Anwendungsf\u00e4lle zu unterst\u00fctzen, die es Menschen erm\u00f6glichen, ihren Lebensunterhalt mit der Webplattform zu verdienen, dies jedoch auf eine Weise tun, die die Privatsph\u00e4re der Benutzer besser respektiert. Chrome sucht aktiv nach Feedback zu diesen Vorschl\u00e4gen und nimmt an den offenen W3C-Foren teil, um die Vorschl\u00e4ge sowie die von anderen Parteien eingereichten Vorschl\u00e4ge zu diskutieren. Erfahren Sie mehr \u00fcber diese Initiative unter <a rel=\"nofollow noopener noreferrer\" target=\"_blank\" href=\"https:\/\/youtu.be\/8Tl0uQdVpxU\">Sicherheit und Datenschutz f\u00fcr das offene Web<\/a> Sitzung.<\/p>\n<p>Betrachten wir abschlie\u00dfend die Benutzersicherheit: <a rel=\"nofollow noopener noreferrer\" target=\"_blank\" href=\"https:\/\/meltdownattack.com\/\">Spektrum<\/a> war eine Sicherheitsl\u00fccke, die dazu f\u00fchrte, dass b\u00f6sartiger Code, der in einem Browserprozess ausgef\u00fchrt wurde, alle mit diesem Prozess verbundenen Daten lesen konnte, selbst wenn diese aus einer anderen Quelle stammten. Eine der Abhilfema\u00dfnahmen des Browsers hierf\u00fcr ist die Site-Isolierung, das hei\u00dft, jede Site wird einem separaten Prozess unterzogen. Sehen Sie sich die LIVE web.dev-Sitzung an<br \/>\n<a rel=\"nofollow noopener noreferrer\" target=\"_blank\" href=\"https:\/\/youtu.be\/XLNJYhjA-0c\">Neue ursprungs\u00fcbergreifende \u00d6ffnungs- und Einbettungsrichtlinien<\/a> (COOP und COEP) f\u00fcr weitere Informationen.<\/p>\n<h2 id=\"building-a-web-with-powerful-capabilities\"><span class=\"ez-toc-section\" id=\"Construyendo-una-web-con-poderosas-capacidades\"><\/span>Erstellen einer Website mit leistungsstarken Funktionen <span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>Chrome m\u00f6chte, dass Sie die Freiheit haben, Web-Apps von h\u00f6chster Qualit\u00e4t zu erstellen, die Ihnen die gr\u00f6\u00dftm\u00f6gliche Reichweite f\u00fcr Nutzer auf allen Ger\u00e4ten bieten. Chrome kombiniert die Installierbarkeit und Zuverl\u00e4ssigkeit von PWAs mit dem Funktionsprojekt (Project Fugu) und konzentriert sich auf drei Dinge, um die L\u00fccke zwischen nativem und Web zu schlie\u00dfen und Ihnen dabei zu helfen, gro\u00dfartige Erlebnisse zu erstellen und bereitzustellen.<\/p>\n<p>Erstens haben die Chrome-Teams hart daran gearbeitet, Webentwicklern und Benutzern mehr Kontrolle \u00fcber das Installationserlebnis zu geben, indem sie der Omnibox eine Installationswerbung hinzugef\u00fcgt haben und vieles mehr. Trotz der Allgegenw\u00e4rtigkeit des Internets ist es f\u00fcr einige Unternehmen immer noch wichtig, ihre App im Store zu haben. Um zu helfen, wurde Chrome gestartet<br \/>\n<a rel=\"nofollow noopener noreferrer\" target=\"_blank\" href=\"https:\/\/github.com\/GoogleChromeLabs\/bubblewrap\">Luftpolsterfolie<\/a>, eine Bibliothek und CLI, die es einfach machen, Ihre PWA in den Play Store zu bringen. Tats\u00e4chlich, <a rel=\"nofollow noopener noreferrer\" target=\"_blank\" href=\"http:\/\/PWABuilder.com\">PWABuilder.com<\/a> verwendet jetzt Luftpolsterfolie unter der Haube. Mit nur wenigen Mausklicks k\u00f6nnen Sie eine APK generieren und Ihre PWA in den Play Store hochladen, sofern sie den Anforderungen entspricht<br \/>\n<a rel=\"nofollow noopener noreferrer\" target=\"_blank\" href=\"https:\/\/blog.chromium.org\/2020\/06\/changes-to-quality-criteria-for-pwas.html\">Kriterien<\/a>.<\/p>\n<p>Zweitens bietet Chrome eine engere Integration mit dem Betriebssystem, z. B. die M\u00f6glichkeit, ein Foto, einen Song oder was auch immer zu teilen, indem der Freigabedienst auf Systemebene mit der Web Share API aufgerufen wird, oder die M\u00f6glichkeit, Inhalte zu empfangen, wenn sie von einer anderen Website geteilt werden . installierte Anwendung. Mit der App-ID k\u00f6nnen Sie Benutzer auf dem Laufenden halten oder sie dezent \u00fcber neue Aktivit\u00e4ten informieren. Dar\u00fcber hinaus ist es f\u00fcr Benutzer ab Chrome 84 (Mitte Juli 2020) jetzt einfacher, mithilfe von App-Verkn\u00fcpfungen schnell eine Aktion zu starten.<\/p>\n<p>Und schlie\u00dflich hat Chrome an neuen Funktionen gearbeitet, die neue Szenarien erm\u00f6glichen, die vorher nicht m\u00f6glich waren, wie etwa Editoren, die Dateien im lokalen Dateisystem des Benutzers lesen und schreiben oder die Liste der lokal installierten Schriftarten abrufen, damit Benutzer sie verwenden k\u00f6nnen. . in ihren Entw\u00fcrfen.<\/p>\n<p>W\u00e4hrend web.dev LIVE haben wir dar\u00fcber gesprochen <a rel=\"nofollow noopener noreferrer\" target=\"_blank\" href=\"https:\/\/youtu.be\/NXCT3htg9nk\">viele weitere F\u00e4higkeiten und Features<\/a> Dadurch k\u00f6nnen Sie die gleiche Art von Erlebnis mit den gleichen Funktionen wie native Anwendungen bieten. Sehen Sie sich alle Sitzungen unter web.dev\/live im Zeitplan f\u00fcr Tag 2 an.<\/p>\n<h3 id=\"chrome-devtools:-new-issues-tab-color-deficiencies-emulator-and-web-vitals-support\"><span class=\"ez-toc-section\" id=\"Chrome-Devtools-nueva-pestana-Problemas-emulador-de-deficiencias-de-color-y-compatibilidad-con-Web-Vitals\"><\/span>Chrome Devtools: Registerkarte \u201eNeue Probleme\u201c, Farbmangel-Emulator und Web Vitals-Unterst\u00fctzung <span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>Eine der leistungsst\u00e4rksten Funktionen von Chrome DevTools ist die F\u00e4higkeit, Probleme auf einer Webseite zu erkennen und den Entwickler darauf aufmerksam zu machen. Dies ist umso relevanter, wenn wir in die n\u00e4chste Phase von a \u00fcbergehen<br \/>\n<a rel=\"nofollow noopener noreferrer\" target=\"_blank\" href=\"https:\/\/blog.chromium.org\/2020\/01\/building-more-private-web-path-towards.html\">Datenschutz-erste Website<\/a>. Um Benachrichtigungsm\u00fcdigkeit und Konsolenunordnung zu reduzieren, haben Chrome DevTools Folgendes ver\u00f6ffentlicht: <a rel=\"nofollow noopener noreferrer\" target=\"_blank\" href=\"https:\/\/developers.google.com\/web\/tools\/chrome-devtools\/issues\">Registerkarte \u201eProbleme\u201c.<\/a> das sich zun\u00e4chst auf drei Arten kritischer Probleme konzentriert: Cookie-Probleme,<br \/>\n<a rel=\"nofollow noopener noreferrer\" target=\"_blank\" href=\"https:\/\/developers.google.com\/web\/fundamentals\/security\/prevent-mixed-content\/what-is-mixed-content\">gemischter Inhalt<\/a>und COEP-Probleme. Sehen Sie sich die LIVE web.dev-Sitzung unter an <a rel=\"nofollow noopener noreferrer\" target=\"_blank\" href=\"https:\/\/youtu.be\/1TbkSxQb4bI\">Suchen und beheben Sie Probleme mit der Registerkarte \u201eProbleme\u201c.<\/a> F\u00fcr den Anfang.<\/p>\n<figure class=\"w-figure\">\n  <img alt='Issues-5095346' class=\"w-screenshot w-screenshot--filled\" src='https:\/\/rmarketingdigital.com\/wp-content\/uploads\/2020\/09\/issues-5095346.png'><br \/>\n<\/figure>\n<p>Da Core Web Vitals au\u00dferdem zu einem der wichtigsten Metriks\u00e4tze werden, die Webentwickler verfolgen und messen k\u00f6nnen, m\u00f6chte DevTools sicherstellen, dass Entwickler ihre Leistung im Vergleich zu diesen Schwellenwerten leicht verfolgen k\u00f6nnen. Diese drei Metriken befinden sich jetzt im Leistungsbereich von Chrome DevTools.<\/p>\n<p>Und da sich immer mehr Entwickler auf Barrierefreiheit konzentrieren, f\u00fchrte DevTools schlie\u00dflich auch eine ein <a rel=\"nofollow noopener noreferrer\" target=\"_blank\" href=\"https:\/\/twitter.com\/mathias\/status\/1237393102635012101?\">Emulator f\u00fcr Farbsehschw\u00e4chen<\/a> Dadurch k\u00f6nnen Entwickler verschwommenes Sehen und andere Arten von Sehbehinderungen nachahmen. Mehr \u00fcber diese und viele andere Funktionen erfahren Sie im <a rel=\"nofollow noopener noreferrer\" target=\"_blank\" href=\"https:\/\/youtu.be\/6yrJZHqJe2k\">Was ist neu in DevTools?<\/a> Sitzung.<\/p>\n<figure class=\"w-figure\">\n  <img alt='Emulator-5874971' class=\"w-screenshot w-screenshot--filled\" src='https:\/\/rmarketingdigital.com\/wp-content\/uploads\/2020\/09\/emulator-5874971.png'><br \/>\n<\/figure>\n<h3 id=\"lighthouse-6.0:-new-metrics-core-web-vitals-lab-measurements-an-updated-performance-score-and-new-audits\"><span class=\"ez-toc-section\" id=\"Lighthouse-60-nuevas-metricas-mediciones-de-laboratorio-de-Core-Web-Vitals-una-puntuacion-de-rendimiento-actualizada-y-nuevas-auditorias\"><\/span>Lighthouse 6.0: Neue Metriken, Core Web Vitals-Labormessungen, eine aktualisierte Leistungsbewertung und neue Audits <span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p><a rel=\"nofollow noopener noreferrer\" target=\"_blank\" href=\"https:\/\/developers.google.com\/web\/tools\/lighthouse\">Leuchtturm<\/a> ist ein automatisiertes Open-Source-Tool, das Entwicklern hilft, die Leistung ihrer Website zu verbessern. In seiner neuesten Version konzentrierte sich das Lighthouse-Team auf die Bereitstellung von Erkenntnissen auf der Grundlage von Metriken, die Ihnen einen ausgewogenen \u00dcberblick \u00fcber die Qualit\u00e4t Ihrer Benutzererfahrung anhand kritischer Dimensionen geben.<\/p>\n<p>Um die Konsistenz zu gew\u00e4hrleisten, hat Lighthouse Unterst\u00fctzung f\u00fcr Core Web Vitals hinzugef\u00fcgt: LCP, TBT (ein Proxy f\u00fcr FID, da Lighthouse ein Labortool ist und FID nur im Feld gemessen werden kann) und CLS. Lighthouse hat au\u00dferdem drei alte Metriken entfernt: First Significant Paint, First CPU Idle und Maximum Potential FID. Diese Entfernungen sind auf \u00dcberlegungen wie die Metrikvariabilit\u00e4t und neuere Metriken zur\u00fcckzuf\u00fchren, die den Teil der Benutzererfahrung, den Lighthouse zu messen versucht, besser widerspiegeln. Dar\u00fcber hinaus hat Lighthouse auf der Grundlage des Benutzerfeedbacks einige Anpassungen an der Anzahl der Faktoren jeder Metrik im Gesamtleistungsscore vorgenommen.<\/p>\n<p>Leuchtturm f\u00fcgte auch ein hinzu <a rel=\"nofollow noopener noreferrer\" target=\"_blank\" href=\"https:\/\/googlechrome.github.io\/lighthouse\/scorecalc\/\">Punkterechner<\/a> um Ihnen bei der Erkundung Ihrer Leistungsbewertung zu helfen und einen Vergleich zwischen den Ergebnissen der Versionen 5 und 6 bereitzustellen. Wenn Sie ein Audit mit Lighthouse 6.0 durchf\u00fchren, enth\u00e4lt der Bericht einen Link zum Rechner mit Ihren vollst\u00e4ndigen Ergebnissen.<\/p>\n<p>Und schlie\u00dflich hat Lighthouse eine Reihe neuer Audits hinzugef\u00fcgt, mit Schwerpunkt auf JavaScript-Analyse und Barrierefreiheit.<\/p>\n<figure class=\"w-figure\">\n  <img alt='audits-7603447' class=\"w-screenshot\" src='https:\/\/rmarketingdigital.com\/wp-content\/uploads\/2020\/09\/audits-7603447.png'><br \/>\n<\/figure>\n<p>Erfahren Sie mehr, indem Sie sich das ansehen <a rel=\"nofollow noopener noreferrer\" target=\"_blank\" href=\"https:\/\/youtu.be\/yDHfrhCGFQw\">Neuigkeiten im Bereich Speed-Tools<\/a><br \/>\nSitzung.<\/p>\n<h2 id=\"learn-more\"><span class=\"ez-toc-section\" id=\"Aprende-mas\"><\/span>Mehr erfahren <span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>Vielen Dank an alle Community-Mitglieder, die sich uns angeschlossen haben, um die Chancen und Herausforderungen der Webplattform zu diskutieren.<\/p>\n<p>In diesem Beitrag wurden einige der H\u00f6hepunkte der Veranstaltung zusammengefasst, aber es gab noch viel mehr. Schauen Sie sich unbedingt alle Sitzungen an und abonnieren Sie den web.dev-Newsletter, wenn Sie weitere Inhalte direkt in Ihren Posteingang erhalten m\u00f6chten. Und besuchen Sie den Abschnitt \u201eRegionale Veranstaltungen\u201c unter web.dev\/live, um eine bevorstehende Community-Veranstaltung in Ihrer Zeitzone zu finden!<\/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>Eine Zusammenfassung der wichtigsten Neuigkeiten und Aktualisierungen, die w\u00e4hrend unserer dreit\u00e4gigen Online-Community-Veranstaltung angek\u00fcndigt wurden, und eine Erinnerung an bevorstehende regionale Veranstaltungen. 6 von\u2026<\/p>","protected":false},"author":1,"featured_media":83161,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[1356],"tags":[],"class_list":["post-83160","post","type-post","status-publish","format-standard","has-post-thumbnail","category-dev"],"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>resumen de web.dev LIVE - R Marketing Digital<\/title>\n<meta name=\"description\" content=\"Un resumen de las principales noticias y actualizaciones que se anunciaron durante nuestro evento comunitario en l\u00ednea de 3 d\u00edas y un recordatorio sobre\" \/>\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\/de\/dev\/resume-web-dev-live\/\" \/>\n<meta property=\"og:locale\" content=\"de_DE\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"resumen de web.dev LIVE\" \/>\n<meta property=\"og:description\" content=\"Un resumen de las principales noticias y actualizaciones que se anunciaron durante nuestro evento comunitario en l\u00ednea de 3 d\u00edas y un recordatorio sobre\" \/>\n<meta property=\"og:url\" content=\"https:\/\/rmarketingdigital.com\/de\/dev\/resume-web-dev-live\/\" \/>\n<meta property=\"og:site_name\" content=\"R Marketing Digital\" \/>\n<meta property=\"article:published_time\" content=\"2022-09-24T01:12:59+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/rmarketingdigital.com\/wp-content\/uploads\/2020\/09\/thumbnail-4454132.png\" \/>\n\t<meta property=\"og:image:width\" content=\"752\" \/>\n\t<meta property=\"og:image:height\" content=\"479\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\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\\\/fr\\\/dev\\\/resume-web-dev-live\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/rmarketingdigital.com\\\/fr\\\/dev\\\/resume-web-dev-live\\\/\"},\"author\":{\"name\":\"R Marketing Digital\",\"@id\":\"https:\\\/\\\/rmarketingdigital.com\\\/#\\\/schema\\\/person\\\/7c0d9782b2977b840b3740f00c69a73e\"},\"headline\":\"resumen de web.dev LIVE\",\"datePublished\":\"2022-09-24T01:12:59+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/rmarketingdigital.com\\\/fr\\\/dev\\\/resume-web-dev-live\\\/\"},\"wordCount\":2166,\"image\":{\"@id\":\"https:\\\/\\\/rmarketingdigital.com\\\/fr\\\/dev\\\/resume-web-dev-live\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/rmarketingdigital.com\\\/wp-content\\\/uploads\\\/2020\\\/09\\\/thumbnail-4454132.png\",\"articleSection\":[\"Dev\"],\"inLanguage\":\"de\"},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/rmarketingdigital.com\\\/fr\\\/dev\\\/resume-web-dev-live\\\/\",\"url\":\"https:\\\/\\\/rmarketingdigital.com\\\/fr\\\/dev\\\/resume-web-dev-live\\\/\",\"name\":\"resumen de web.dev LIVE - R Marketing Digital\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/rmarketingdigital.com\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/rmarketingdigital.com\\\/fr\\\/dev\\\/resume-web-dev-live\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/rmarketingdigital.com\\\/fr\\\/dev\\\/resume-web-dev-live\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/rmarketingdigital.com\\\/wp-content\\\/uploads\\\/2020\\\/09\\\/thumbnail-4454132.png\",\"datePublished\":\"2022-09-24T01:12:59+00:00\",\"author\":{\"@id\":\"https:\\\/\\\/rmarketingdigital.com\\\/#\\\/schema\\\/person\\\/7c0d9782b2977b840b3740f00c69a73e\"},\"description\":\"Un resumen de las principales noticias y actualizaciones que se anunciaron durante nuestro evento comunitario en l\u00ednea de 3 d\u00edas y un recordatorio sobre\",\"inLanguage\":\"de\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/rmarketingdigital.com\\\/fr\\\/dev\\\/resume-web-dev-live\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"de\",\"@id\":\"https:\\\/\\\/rmarketingdigital.com\\\/fr\\\/dev\\\/resume-web-dev-live\\\/#primaryimage\",\"url\":\"https:\\\/\\\/rmarketingdigital.com\\\/wp-content\\\/uploads\\\/2020\\\/09\\\/thumbnail-4454132.png\",\"contentUrl\":\"https:\\\/\\\/rmarketingdigital.com\\\/wp-content\\\/uploads\\\/2020\\\/09\\\/thumbnail-4454132.png\",\"width\":752,\"height\":479,\"caption\":\"thumbnail-4454132-6895145-png\"},{\"@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\":\"de\"},{\"@type\":\"Person\",\"@id\":\"https:\\\/\\\/rmarketingdigital.com\\\/#\\\/schema\\\/person\\\/7c0d9782b2977b840b3740f00c69a73e\",\"name\":\"R Marketing Digital\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"de\",\"@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":"Zusammenfassung von web.dev LIVE - R Marketing Digital","description":"Eine Zusammenfassung der wichtigsten Neuigkeiten und Updates, die w\u00e4hrend unserer dreit\u00e4gigen Online-Community-Veranstaltung angek\u00fcndigt wurden, sowie eine Erinnerung daran","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\/de\/dev\/resume-web-dev-live\/","og_locale":"de_DE","og_type":"article","og_title":"resumen de web.dev LIVE","og_description":"Un resumen de las principales noticias y actualizaciones que se anunciaron durante nuestro evento comunitario en l\u00ednea de 3 d\u00edas y un recordatorio sobre","og_url":"https:\/\/rmarketingdigital.com\/de\/dev\/resume-web-dev-live\/","og_site_name":"R Marketing Digital","article_published_time":"2022-09-24T01:12:59+00:00","og_image":[{"width":752,"height":479,"url":"https:\/\/rmarketingdigital.com\/wp-content\/uploads\/2020\/09\/thumbnail-4454132.png","type":"image\/png"}],"author":"R Marketing Digital","twitter_card":"summary_large_image","schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/rmarketingdigital.com\/fr\/dev\/resume-web-dev-live\/#article","isPartOf":{"@id":"https:\/\/rmarketingdigital.com\/fr\/dev\/resume-web-dev-live\/"},"author":{"name":"R Marketing Digital","@id":"https:\/\/rmarketingdigital.com\/#\/schema\/person\/7c0d9782b2977b840b3740f00c69a73e"},"headline":"resumen de web.dev LIVE","datePublished":"2022-09-24T01:12:59+00:00","mainEntityOfPage":{"@id":"https:\/\/rmarketingdigital.com\/fr\/dev\/resume-web-dev-live\/"},"wordCount":2166,"image":{"@id":"https:\/\/rmarketingdigital.com\/fr\/dev\/resume-web-dev-live\/#primaryimage"},"thumbnailUrl":"https:\/\/rmarketingdigital.com\/wp-content\/uploads\/2020\/09\/thumbnail-4454132.png","articleSection":["Dev"],"inLanguage":"de"},{"@type":"WebPage","@id":"https:\/\/rmarketingdigital.com\/fr\/dev\/resume-web-dev-live\/","url":"https:\/\/rmarketingdigital.com\/fr\/dev\/resume-web-dev-live\/","name":"Zusammenfassung von web.dev LIVE - R Marketing Digital","isPartOf":{"@id":"https:\/\/rmarketingdigital.com\/#website"},"primaryImageOfPage":{"@id":"https:\/\/rmarketingdigital.com\/fr\/dev\/resume-web-dev-live\/#primaryimage"},"image":{"@id":"https:\/\/rmarketingdigital.com\/fr\/dev\/resume-web-dev-live\/#primaryimage"},"thumbnailUrl":"https:\/\/rmarketingdigital.com\/wp-content\/uploads\/2020\/09\/thumbnail-4454132.png","datePublished":"2022-09-24T01:12:59+00:00","author":{"@id":"https:\/\/rmarketingdigital.com\/#\/schema\/person\/7c0d9782b2977b840b3740f00c69a73e"},"description":"Eine Zusammenfassung der wichtigsten Neuigkeiten und Updates, die w\u00e4hrend unserer dreit\u00e4gigen Online-Community-Veranstaltung angek\u00fcndigt wurden, sowie eine Erinnerung daran","inLanguage":"de","potentialAction":[{"@type":"ReadAction","target":["https:\/\/rmarketingdigital.com\/fr\/dev\/resume-web-dev-live\/"]}]},{"@type":"ImageObject","inLanguage":"de","@id":"https:\/\/rmarketingdigital.com\/fr\/dev\/resume-web-dev-live\/#primaryimage","url":"https:\/\/rmarketingdigital.com\/wp-content\/uploads\/2020\/09\/thumbnail-4454132.png","contentUrl":"https:\/\/rmarketingdigital.com\/wp-content\/uploads\/2020\/09\/thumbnail-4454132.png","width":752,"height":479,"caption":"thumbnail-4454132-6895145-png"},{"@type":"WebSite","@id":"https:\/\/rmarketingdigital.com\/#website","url":"https:\/\/rmarketingdigital.com\/","name":"R Digitales Marketing","description":"SEO Agentur | Werbung f\u00fcr soziale Netzwerke | 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":"de"},{"@type":"Person","@id":"https:\/\/rmarketingdigital.com\/#\/schema\/person\/7c0d9782b2977b840b3740f00c69a73e","name":"R Digitales Marketing","image":{"@type":"ImageObject","inLanguage":"de","@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\/de\/wp-json\/wp\/v2\/posts\/83160","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/rmarketingdigital.com\/de\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/rmarketingdigital.com\/de\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/rmarketingdigital.com\/de\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/rmarketingdigital.com\/de\/wp-json\/wp\/v2\/comments?post=83160"}],"version-history":[{"count":0,"href":"https:\/\/rmarketingdigital.com\/de\/wp-json\/wp\/v2\/posts\/83160\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/rmarketingdigital.com\/de\/wp-json\/wp\/v2\/media\/83161"}],"wp:attachment":[{"href":"https:\/\/rmarketingdigital.com\/de\/wp-json\/wp\/v2\/media?parent=83160"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/rmarketingdigital.com\/de\/wp-json\/wp\/v2\/categories?post=83160"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/rmarketingdigital.com\/de\/wp-json\/wp\/v2\/tags?post=83160"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}