The forthcoming Chrome 85 release in August includes style editing for CSS-in-JS frameworks, Lighthouse 6, support for new ES2020 features, and several other helpful additions for web developers.

While CSS-in-JS remains a polarizing approach to development, it has gained adoption in the React ecosystem. Most CSS-in-JS frameworks leverage the CSS Object Model (CSSOM) to construct styles. Chrome version 73 added constructable stylesheets to support seamless reusable styles that work with the Shadow DOM portion of the web components specification.

With Chrome 85, DevTools users can now edit styles added using the CSSOM, making it possible for developers to modify styles within the browser to review the immediate impact of style changes.

Chrome 85 also includes Lighthouse version 6, which consists of a series of new web performance metrics including the largest contentful paint (LCP), cumulative layout shift (CLS), and total blocking time (TBT) to provide even more insight into the performance of a website. The LCP metric replaces the now deprecated First Meaningful Paint (FMP) metric. With Lighthouse 6, a new formula of weighted metrics gets used to generate lighthouse performance scores. Lighthouse 6 also adds an unused JavaScript audit, eight new accessibility audits, and numerous other improvements.

#javascript #web development #chrome #development #architecture & design #news