Uncategorized

Chrome and the web in 2020

(Cheerful music) -Welcome to the 2020 Chrome Developer Summit, I’m Dion -I am Ben We are a member of the Chrome team Also the host of this year's keynote speech -This year is destined to be a very memorable year -At the end of the year We are as excited as you -[Dion] CDS has been committed to Integrate the Chrome team with the community So that we can learn from each other -For the inability to hold live meetings We feel very sad But we will do our best to replicate this experience online Including streaming videos on YouTube Our team will also be in the whole week Monitor the progress of related activities and process comments -In addition, today we will also launch a project called New experiment for Chrome Dev Summit Adventure This is a fun online world, you, the virtual participant Can interact here, we will try Reproduce the fun of face-to-face interaction We will discuss this topic in detail later today Looking forward to hearing your thoughts on this -[Ben] Google’s Chrome team has two tasks The first is to strengthen the Web and other open ecosystems We can improve the Blink Web rendering engine Open source projects such as V8 JavaScript runtime To achieve this goal -[Dion] AV1 Media Codec Skia Graphics Library And developer tools such as Workbox, Lighthouse Of course there are DevTools and so on -The scope of use of these items far exceeds Chrome Even the web, they can help countless other products And platform to provide support, such as the Node.JS ecosystem with V8 Open video with AV1, and Skia It plays a vital role in Android and Flutter -[Dion] Of course, the second part of our mission is Build the Chrome web browser In Windows, Mac OS Linux and Android Provide a quality web experience -In iOS, we use Apple's The WebKit framework brings as many quality web experiences as possible to millions of users In all these efforts Our focus is simple Can be boiled down to three things -[Dion] Make sure the network can Provide a safe environment -[Ben] Get faster Smoother web browsing experience -[Dion] Add more features to the Web So as to provide richer More diverse applications -In today’s keynote speech, we will explain to you The latest progress of our work and highlight The work of others in the community -First, we invite our colleague Parisa Tabriz Introduce us the latest situation of Chrome browser -Thanks, Dion 2020 for all of us It's a year full of challenges and new experiences As early as March, we decided to Skip a version of Chrome for the first time Because we want to make sure When our team is working from home one after another Everyone has a stable Chrome Now we are humble and very proud So many people around the world choose Chrome to help them stay in touch and get the latest news Especially in challenging times Looking back on this year, I want to share some of what we saw Changes in how Chrome is used How our core principles help us make this transition Be prepared and how we continue Make improvements to help our users Now, people all over the world rely on the Chrome browser Virtually meet with family, friends, classmates and colleagues And keep in touch with them People have been using Chrome on desktops since January The time for video conferencing has increased by 4 times We all know that performance is the key Especially when using video on the web Therefore, in order to keep Chrome fast and efficient We have introduced configuration file boot optimization This feature can increase page loading speed by 10% We also introduced a tab throttling function It can help speed up almost everything Chrome start, tab switch, tab restore We prioritize the allocation of laptop resources to Actually use the tab page to achieve this purpose Moreover, it can also reduce power consumption And extend battery life Finally, we are saving memory Also made some progress Dion will introduce this in detail later Now, when we look at the trend data of Google search We will find that during the blockade, the health and news Science, government and food related inquiries are all increasing People want to ensure safe access to the latest information about local travel restrictions And learn how to make food at home Generally speaking, able to access information on the open Web Very important, we will continue to focus on Product content and global user base Provide diversified services For users with poor eyesight or who rely on screen readers Chrome becomes the first to use auto-generated titles Links and forms to create an accessible PDF browser All this makes the PDF clearer and easier to read for screen readers We also translate the entire website into your favorite language And make the whole translation process easier It also adds support for another 28 languages Finally, we have started testing a vision-based search program I hope this search program can help newcomers to the Internet Or users who are not literate or illiterate As many of us start to move to work from home There are many problems, such as small screen Cluttered work environment, family affairs, and various other things Chrome team will continue Put productivity features as a priority Tab groups make it easier for you to sort items Urgency or any way you like to organize tabs You can even collapse groups of tabs So as not to distract you We also started to try in the new tab page of Chrome Add new modules to help you quickly jump back to the previous task Whether it’s researching products or planning meals You can still catch up with your favorite shows Currently, we are aware of the Phishing attacks and other cybersecurity threats continue to increase How we protect users for Chrome And we are proud of some new features that we launched this year These new features make it more difficult for cyber attackers to succeed For example, we activated an additional layer of security Enhance the safe browsing function, improve the HTTP-over-HTTPS Security and privacy, and many improvements have been made to the password manager We also redesigned Chrome’s settings Provides more accessible and intuitive privacy controls For those who want to save worry and effort We have introduced a new security check in Chrome Now we have introduced some of the most commonly used Quick access to privacy and security controls Such as deleting your browsing history or in your address bar Open an incognito window directly Finally, we are in some smug ecosystem Good progress has been made in security initiatives Later today, you will hear about our Information on the progress made on the privacy sandbox This sandbox is an open source project Aims to develop a set of open standards To fundamentally improve online privacy Dion will announce the Important latest information As we provide users with more control Allow them to share data with their favorite extension We hope to provide you with some tools To meet this new reality Now, before I hand over the next time to Dion I want to tell the Chrome team This year's hard work at home is affirmed To improve user experience We released eight stable Chrome versions Meets the default browser requirements of iOS 14 And make Chrome’s performance, usefulness and security Improved on all available platforms Thank you! Now hand over the time to Dion and he will introduce you in detail The latest features in the Chrome extension -Thanks, Parisa Made so many major improvements I am happy to see all the work we are doing Make the browser more efficient, safer and provide more privacy protection features We now believe that extensions are very important for the Web It’s like an aftermarket, allowing first and third parties Add rich features to enhance The overall experience of the website or web We really like you and more than 200,000 active developers Built extensions, and Chrome online 250,000 extensions in the app store Users also like them very much Interestingly, according to our estimation Within a few minutes since the start of this keynote speech Users have installed more than 20,000 extensions Users now want strong privacy protection And security features, we very much agree with this Therefore, we have been working hard to update our extension platform And our vision for a more private and secure browsing experience Maintain a higher fit We call it Manifest V3 Today, we announced the official release of Manifest V3 To improve safety, we will prohibit Remote hosting of code starts and provides developers with More tools to write secure extensions To enhance user privacy, at the beginning of this year We have improved the visibility of the controller in the new extension menu And make some sensitive permissions optional Today’s users after installing the extension You can turn off these permissions In 2021, we will go further Keep these permissions by default and let users You can choose to disable it when installing the extension Manifest V3 can be tested in Chrome 88 Beta When Chrome 88 is released stably from January 19th, developers can update the updated extension Submit to the Chrome Web Store You can learn more from the link here -As Dion stated, privacy is Chrome’s Important themes of the new extension model We have also been with the ecosystem Many other extensions collaborate To improve the privacy of the web platform itself We have been developing a project called Important plan for "Privacy Sandbox" The plan is divided into two parts First, reduce the cross-site tracking that occurs on the web today Second, enhance network performance through some new features These new features form an alternative to protecting privacy Powering the future experience Some websites use third-party cookies to Track people on the web Chrome plans to implement these privacy protection alternatives Phase out third-party cookies, but now we have Make cookies more secure for websites and users This year, Chrome completed a project called The release of SameSite’s new strategy, the strategy Limit cookies to first-party access by default Require developers to declare which cookies can be sent to third-party domains Before this change, even though most cookies were only Used by the first party, but they can also be accessed by third parties Thus unnecessarily exposing them to security threats For example, cross-site request forgery attacks Now, 99.9% of first-party cookies are automatically Limited to first-party use only in Chrome And all third-party cookies must Send via HTTPS and encrypt during transmission Microsoft Edge and Mozilla Firefox Is also adopting this same new site strategy We have been working hard to solve the hidden tracking problem Such as browser fingerprint recognition Now when the developer tries to create It will appear when the only configuration file of your browser The so-called fingerprints that can be observed on various websites Through a new project called Privacy Budget We are trying a new method While enabling rich web functions Strictly restrict fingerprint recognition We also released the User Agent-Client Hints API This API can replace as we all know And likes can be traced back to the birth of the Web The user agent string used This allows developers to only request that they actually Required data about your browser In the second part of the privacy sandbox, we have been working with Web ecosystem uses a series of new Web standards together These standards provide various privacy protection solutions In order to complete important web use cases Such as personalized content, single sign-on, and related advertising And no third-party cookies Or other cross-site tracking mechanism I’m happy to tell you that the first two solutions have been Available for developers to conduct early trials Including Conversion Measurement API This is a new feature that can be used without cross-site In the case of identifiers, evaluate when an ad click leads to a conversion And trust tokens, this new API can be In the case of passive tracking, by passing the trust in an environment to Another environment to help combat fraud and distinguish robots from humans In the stable version of Chrome we currently use Both solutions are available through Chrome Origin Trials mechanism for testing and feedback Later today, we will explore in more depth Some of these changes, so don’t forget to take these courses -Users only need to click to get a new and outstanding experience And you can traverse the web links one by one To make the whole journey better, all of us must make sure The web page loads quickly, and after loading We need to make the interface responsive To achieve fast loading and runtime performance You need a browser and a web developer Work together to do the right thing Previously, Parisa shared how to get Chrome The latest information such as configuration file guide optimization and tab throttling In addition, we have been optimizing overall memory usage And made some very important progress in this regard We want to share with you For example, the previous stable version of Chrome Chrome 85 Introduced enhancements to the browser reclaiming memory So that advanced users on Mac OS can at most Reduce memory usage by 1 GB And our next version, Chrome 87, shows Each top site can save up to 80 MB And we recently updated V8 with memory compression technology The technology significantly reduces JavaScript memory usage We can see this in Gmail Memory usage reduced by 45% Finally, V8 can now load pages in parallel JavaScript file So the script can be passed and compiled And execute the script as soon as the page needs them Thus completely eliminating the suspension of delivery Now we will continue to work hard Make it easier for web developers Create high-performance websites Earlier this year, we launched Web Vitals To provide clear and unified guidance on web page attributes This is great for providing excellent User experience is essential We will focus on highlighting the explanation Performance is the three aspects of Core Web Vitals Chrome user experience report shows Most websites have good interactivity Nearly half of websites load fast and look stable Overall, about a quarter of websites Passed these three indicator thresholds So we still have a long way to go But we think this is a good start Next, we will delve into these data in Web Almanac And today will be published written by web experts 2020 version of the latest Web Almanac Actually, I really like the novel statistics For example, the longest image or attribute we have found Over 15 million characters Enough to write "War and Peace" five times Let us come back and explain the indicators Last month, the Google search team announced their plan In the next six months, Core Web Vitals will be Into its process of measuring page performance If you value discovery through Google search This will provide additional incentives to optimize Your metric and reach three thresholds Get started now as you measure, track and improve We have all the tools to support you RUM provider ecosystem Can also migrate quickly If you use CloudFlare New Relic Akamai's mPulse SpeedCurve, Calibre, etc.

Core Web Vitals can now be used But we also know that many websites are currently in use Google Analytics And they want to be able to evaluate their web page metrics Last summer, we released a JavaScript library for web indicators And how to collect web metrics data and send it to Description of Google Analytics Now, we are very happy to be able to publish a web page metrics report This is an open source website and tool that allows you to directly In Google Analytics Query and view web page index data This report also allows you to compare data from various market segments In order to understand how much performance Will affect your business results Now, we see that the method of web page metrics has indeed caused Developer resonance, especially on the web Infrastructure conditions and equipment functions This is especially true in a market where changes are possible So what do you need to do To improve your indicators? Let us welcome the leading beauty and health products from India Sunit Jindal, chief engineer of online market Nykaa He will share with everyone Visit the website and iterate Experience to reach these thresholds Leave it to you, Sunit -Thank you, Dion.

I’m Sunit Jindal Is India's leading multi-channel beauty resort Chief Engineer of Nykaa At Nykaa, we firmly believe in high-performance applications Is a prerequisite for a good user experience This is especially true for mobile users We found that the performance success One of the keys is to cooperate with our business Key teams maintain a consistent pace The speed it takes to present content to users SEO possible benefits and conversion rate We ensure that we work with marketing and business partners Some metrics to keep consistent Frankly speaking, when Web Vitals was first released Means we have to do more work But we also know that this is a positive change Although the new indicators mean that we must again Do in-depth research to reach the threshold, but once we do You will find it is worth it By optimizing the code Add the correct CDN where needed Replace awkward third-party scripts with easier implementations, etc., We have improved these three Core Web Vitals In the end, we worked hard for several months Successfully improved all Core Web Vitals For users, pages load faster And there is little or no content transfer on the page We also found that across devices and network bandwidth Performance-related scores are constantly improving After the migration, compared to the old mobile site Our page views per visit increased by 23% Traffic from second-tier and third-tier cities Also increased by nearly 28% Finally, we also see that other key indicators are also increasing Such as average order value and search traffic In the process of leading the team through this journey I feel that Core Web Vitals represents a guideline Can promote us to provide a clear and fast user experience So far, we are very satisfied with the results And look forward to the follow-up content of the web indicators course Thank you, give it back to you, Dion -Thanks to Sunit and the entire developer community, etc.

Feedback from partners We found improvements to Core Web Vitals 2020 And its measurement opportunities Please watch Annie’s explanation later today Understand when we iterate over the indicator set for 2021 Consider this and how to share your feedback You want to be able to create as easily as possible Responsive and beautiful interface You provided us with what you want to simplify Rich feedback on CSS Una will share some feedback on this The latest changes, and let you know Some new works that particularly excite us -Thanks, Dion Currently, many exciting things are happening in the CSS field And in terms of making the interface easy to build and debug I have a lot of latest information to share with you We are always analyzing trends and conducting investigations Found that for many people who build web interfaces Style is actually a big pain point And we, as an online community, have heard your voice We hope to solve the current problems encountered by developers So, what have we done recently? First, we are always improving the tools Through cooperation with Microsoft Introduce grid development tools and develop Flexbox tools Hope to alleviate some of the trouble of layout debugging We are also making many other small incremental changes These changes will make you more clear Value being calculated and related reasons This year, we also released some important updates about CSS Our cross-browser behavior in Flexbox and Flexbox has made some major advancements in the conversion gap This means you can now like Same in CSS grid, controlled by parent Space between children We will specify the aspect ratio to ensure that your response content is The size ratio is the same, and will not cause hacker attacks And we provide content visibility, which is a CSS feature You can skip the rendering of elements as needed Including layout and painting Significantly improve rendering performance This allows for faster interaction with the content on the screen And the content is still searchable and accessible External contributors and With the help of the Agalia team We also provide some Styling APIs, including List bullet style with marked pseudo elements More refined text modification style Focus in pseudo-classes, which enables you to Set the style of the parent object based on whether the child object receives attention There is also path support in clip-path Used to support a wider range of cropping effects And in the near future, we will release hardware accelerated SVG animation to ensure better performance across browsers Another feature that excites me is @property It is available in Chromium 85 Now you can register directly in the CSS file CSS custom properties with syntax and fallback values This is part of CSS Houdini's work Especially the Properties and Values ​​API If you are interested in further extending CSS with Houdini Please follow me about using it in today’s browsers All discussions of Houdini, including one by my team Tools built to make it easier to use If you want to watch this later Please click the link below Recently, the future of CSS has become brighter Next year is coming, the Chromium team Will work on solving web style Some bigger problems We work with the open interface community group Committed to exploring form control styles And open up the expansion possibilities of current web forms And this is a problem that many people are suffering We also provide animation timeline In order to scroll to the animation to be styled with CSS Currently, this operation is performed using JavaScript And the workload is quite heavy, we are studying how to Make CSS architecture clearer for design systems and products Include a cascading layer in order to be between user agent and author style Enable new injection points for style sheets In addition, we are still studying CSS nesting The favorite content of the PM post processor And the scope style of CSS itself Soon we will target multiple or longer selectors And use the mashes selector Provide clearer CSS statements Finally, the Chromium team currently Exploring container query Also known as element query We are actively preparing for the upcoming subversion Prototyping of component-driven design products Enable the element itself to respond to the size of its parent container No matter where it is on the page And it’s not just limited to the viewport size of the document This is a huge change in style function I can see that it is indeed changing the ecosystem Help lead a more independent response The era of design components and systems All these web improvements themselves It's all exciting, right? They really tell the interface style together The story of becoming a priority for the web platform We heard your voice, I can't wait Want to know the direction of development of CSS and the Web since then -Thank you, Una I can’t wait to see what you will improve through these Rich and smooth experience In a later event, we will discuss the Web How to take content to a whole new level Because in the process of visualizing each story in a new way As creators use a wealth of new tools We have seen a real increase in creativity Another key aspect of a seamless experience Is to reduce users’ transactions on the Web Friction encountered We will continue to invest in areas such as identity and payment With one-time password support or Web OTP Users no longer need to use two-step verification Copy and paste from the SMS app And this also applies to Chrome and Safari WebAuthn brings biometric sensors to the web Safari also recently added support, so Users can access touch ID and face ID through the web We want to bring this simplicity into the payment field And we are experimenting with secure payment confirmation So that WebAuthn enters the payment process We are experimenting But the real exploration has begun from here We can't wait to see The end result of these enhanced payment experiences So, welcome to check out some of the APIs Session and code lab We have built these interface functions and their use for identification and The payment function allows you to build More powerful rich web applications We have seen that when we are missing some features you need What will happen You may have to resort to using those that allow you to use HTML, CSS and JavaScript Skill system, but you have to give up Core advantages of web deployment Able to attract users on any platform on any device Without forcing users to download Large applications that are rarely used in practice Are all the factors that make the Web a successful platform Promoting the continuous success of the Web means pushing the limits Unlock new use cases that are not even possible today While retaining the features that make the web better Henrik is a member of the web community, I have known him for many years Developers like him are doing this Therefore, I invite him to join us and bring him to Share some work that has a real impact on mankind Henrik, welcome to join us -Hey, Dion.

Thank you so much for inviting me I wish we could have this conversation face to face – me too Can you share with us what you have been building? – of course. Whenever you put someone to sleep in a medical setting Keep their vital signs considered to be Best practice -I hope so Therefore, I think you have to monitor the patient’s true vital signs Here we are referring to human vital signs Instead of page metrics – Yes, of course Therefore, you have to make Anesthesia records Part of this record is a chart Which shows the patient during the whole process Vital signs every five minutes Sometimes this process can be very long So you might do this 50 times in a given situation Many people still use paper to do this And make a small chart like this So naturally, we are at anesthesiacharting.com A progressive web application It can actually do all of this work for you – understood.

So I am actually looking at The content on this paper, and try to figure out how PWA works -Yes, it might be easier if I demonstrate for you -Can you give us a demonstration? Ok please -As you can see, I am connected A patient vital signs monitor We can not only read data directly from it And record it in the chart And you can also issue commands Speech recognition API will also bring us some fun So if I say to measure blood pressure now (Buzzing sound from the machine) You will notice on the monitor Blood pressure cuff started to appear We can not only put a vital signs monitor in the corner You can also combine all this data Including my ECG waveform and all content All on a big screen This way, providers can see everything they need – awesome. There are a lot of things to explain Can you talk about how to make all Are these integrated contents working properly? -Okay, let's talk about the vital signs monitor Custom binary protocol executed via web sequence Of course, the Presentation API we use will All this content is displayed on a separate screen Is different from what I see here Then we also use Wake Lock API Make sure this computer won't Sleep halfway -Exactly.

So why use web technology to build it? -Distribute software on the web very easy In fact, we do have an electronic application We are using it to complete some of these operations Some monitors actually require a local TCP connection This connection does exist, which is great, but it also means Many of our problems with support come from this Because the user does not understand the principle. They need to download something And not sure if it is running related objects in Chrome Or run it alone Therefore, it is possible to use the Web It's great to finish all the work -Very reasonable I am glad to see it in reality Usage in the environment What's next? Do you want to see other APIs on the web? – Yes. I have already said that I am really looking forward to it Native Sockets API because it allows us to pass TCP interacts with some other monitors In addition, I think that currently in our application The only thing that cannot be run offline is What we do when we finally generate PDF for you Therefore, we actually run the puppeteer service It will take this HTML and return it to you PDF If we only use the local JavaScript API PDF can be generated in a unified way, that’s great – It sounds pretty good.

Ok Feedback recorded I really hope we can do it on the next CDS Face-to-face conversation, despite being able to go online Online communication with you in the dentist's office is very special And it's from the UK -Yes, that's really great Thank you so much for inviting me, and everyone knows We have also taken all necessary precautions against the new coronavirus I even tested for the new coronavirus yesterday To ensure the safety of all of us – Safety first Hear stories like Henrik Make us pass Project Fugu Wait for the plan to implement new web features Proud of the work done Although Henrik’s example may be a bit specialized But he told us many other Use cases are also important For example, Gravit Designer makes their Users can easily read and write files using File System Access API This simplifies the process of opening and saving They have started using the new Local Font Access API, this API enables users to use Special fonts installed on your computer We want to hear about enhancing the web experience Information on required functions So stay tuned When you put all these together You can create something special Glad to share with you Adobe Spark recently An impressive new PWA launched It has stable performance, powerful functions, and supports a new generation Creatives collaborate and create together seamlessly It can provide a very pleasant experience Immediately afterwards, Spark in their partners Special attention is directly shared in the speech Their journey -When you put effort into building a great web experience You will want to attract as many users as possible Services such as Google search are an excellent Discovery platform and powerful web differentiation tool But now, many users are used to Google Play and other app stores to discover things Development of progressive web applications that meet recommended quality standards Developers can use trusted web activities Incorporate it into the Android app In Chrome 85 released earlier this year We have extended support for trusted web activities to Chrome OS, and developers can now add it Publish the app to the Chrome OS Play Store Chrome OS and Chromebooks are excellent platforms Can be demonstrated through Project Fugu and other work The functions of modern Web and its extended functions Developers can use the Play Store Easily discover and install the web applications And they can be deeply integrated into Chrome OS launcher and overall system experience In the past year, Chromo OS has A powerful new desktop PWA is introduced into its ecosystem From advanced graphics products such as Adobe Spark to Attractive media applications such as YouTube TV and Hulu are readily available Framer is a cross-device design and prototyping tool It was originally a platform application on Mac OS After the collaborative web version was released Its number of users has increased fourfold Today, we announce that Google Play is Use trusted web activities published in the Play Store PWA added support for game billing It will be integrated into Chrome 88 Now available for developers And will launch a stable version in mid-January 2021 Both Chrome OS and Android will support it And support the purchase of digital goods and subscription content Including the new Standardized Digital Goods API You can use the "a new level of desktop web application" And "New Features of Web Applications in Play".

Learn more about them in these two courses -We have shared some latest information about the platform Let’s discuss the new features of developer tools And how they help you build these great web applications It's your turn, Jecelyn -Thanks, Dion A lot has happened in the field of developer tools Let’s explore in depth First, we are in Chrome DevTools Provides some great new features The first is the grid tool. As Una said before Now you can use the new CSS grid debugging tool Debug CSS grids more easily Great, I am very excited about it Second, we are "presenting" and "sensor" New simulation function has been added to the tab Including lack of local fonts, inactive users, etc. Next is the most commonly used panel in DevTools This is the element panel, which now supports more functions Including the editing of CSS styles in the JS framework In terms of accessibility, we have added some new features Includes accessible color suggestions and Simulate visual defects, etc.

Finally, we also added a bunch of new tabs and panels Such as the new media panel Can help you debug your website more easily There is still a lot of content, so don’t forget to participate tomorrow "The New Features of DevTools" course In continuous development, as people pay more and more attention to web indicators By this summer, all the indicators we have observed Have achieved up to 70% growth Therefore, we must ensure that all these functions Make further enhancements, including Lighthouse This tool allows you to Review your website on a one-to-one basis And provide feasible improvement guidelines First, we have added three new audit content Help you determine the Cumulative Layout Shift used to check Specific method In addition, we know that third-party libraries Essential to your Core Web Vitals Therefore, as a first step, we embed content for third parties Added other review items to help you clearly understand Your influence on website metrics We hope these changes Make it easier for developers Debug and optimize its Core Web Vitals Stay tuned to watch Elizabeth provide later today "Status of Speed ​​Tools" course for more information Finally, I want to thank the Workbox team They launched the create-react-app More flexible integration, allowing you to Complete control of the service worker logic Recently, the team released Workbox V6 It contains some commendable updates Including for building custom caching strategies and plugins New extensible hook It also supports Webpack V5, and in More flexible integration is provided in create-react-app V4 Eventually, we will have more code bases Migrate to TypeScript to make it easier to Use code libraries in TypeScript projects Don't forget to watch tomorrow Jeffrey explains other courses Okay, then return the time to Dion and Ben -We have discussed how to build fast Powerful and secure web experience and show you some examples But we always hope to achieve our goals step by step in a down-to-earth manner We asked ourselves if we can create a Rich web applications that load quickly and run smoothly? Considering our own abilities, we usually try Use developer tools to achieve this goal Two years ago, we announced the launch of Squoosh at the 2018 Chrome Developer Summit As the Web is about to get three commendable new image formats We know it’s time to build the second version Therefore, we added JPEG-XL, WebP2, AVIF You can see the image encoding How much development has been made in the past two decades At the same time, we use the latest and most powerful WebAssembly function, more mature WebAssembly Toolchain to enable image compression in the browser The running speed is greatly improved We also understand the needs of users Thus creating a new and improved interface And wrote the Squoosh CLI so you can use All codes and settings available in PWA Compress all images at once Share the same in the command line version of the browser and node WebAssembly binaries are very effective So you can check out Squoosh V2 And follow the link here to learn how the team built Squoosh V2 And how to use it to compress images As we mentioned at the beginning The Chrome team is focused on working with the community This community actually includes everyone in CDS So that the Web becomes more powerful, fast and seamless The most important thing is to be safer -Surprisingly, over 30 years The web platform continues to evolve -I think it’s older than most of our team members -(Chuckling softly) Can we say that? We will continue to improve web.dev as a one-stop service Used to understand our Views on how to get the best results from the modern web -[Dion] on the website for Lighthouse And Web Vitals program and other tools are fully explained -Of course, at the CDS online conference this week We will do our best to explain all The latest and greatest development We will answer your questions at any time And listen to your thoughts and feedback -We have too much wonderful content to share and additional information for you to analyze in depth This information will be available on our YouTube channel -So next, stay tuned Adobe Spark team, listen to them directly The construction of the new PWA that we briefly described earlier -Now we are going to watch it too, and join with you Chrome Dev Summit Adventure (Cheerful music)

As found on YouTube

For more info click here