RT Rick Viscomi
New behavior in PageSpeed Insights: partial field data 🎉
Previously you'd see "no data" if you were just missing FID data. Now you'll see whatever is available.
This is a big deal because ~30% of origins in CrUX were missing FID data!
https://developers.google.com/speed/docs/insights/release_notes?hl=en-US&utm_source=PSI&utm_medium=incoming-link&utm_campaign=PSI#june-10,-2021
RT Adam Argyle
🆕 #GUIchallenges on Color Schemes
⚙️ auto
☀️ light
🌙 dark
💡 dim
Learn how I use CSS custom properties for multiple color schemes. How do you?!
Watch
Read along
Try a demo
Code
https://www.youtube.com/watch?v=oHcTn83M1ls&list=PLNYkxOF6rcIAaV1wwI9540OC_3XoIzMjQ
https://web.dev/building-a-color-scheme/
https://gui-challenges.web.app/color-schemes/dist/
https://github.com/argyleink/gui-challenges
RT Adam Argyle
🆕 post on
CSS `size-adjust` for `@\font-face` declarations
👉🏻
✅ mitigate CLS
✅ normalize font sizing
covers friends too!
1️⃣ ascent-override
2️⃣ descent-override
3️⃣ line-gap-override
[video alt: 64px font-size consistent!!!]
http://web.dev/
https://web.dev/css-size-adjust/
🆕 #CSSpodcast on @\scroll-timeline!
Learn about scroll-linked vs scroll-triggered animation and how to orchestrate scroll interactions with CSS
Listen
Spec
Polyfill
@bramus slides
https://pod.link/thecsspodcast
https://goo.gle/3pvWX49
https://goo.gle/3x8CQvw
https://goo.gle/2TPs7HU
🔠 Input matters for Chrome OS
In this session, find out how to approach app input given the increasing variety of device form-factors. We also discuss how to support these input sources and why it is essential for your app to do so.
Start learning →
https://goo.gle/2S2Rmpp
RT Lighthouse
Lighthouse 8.0 is here! ⚡️
Improved CWV balance for the Performance Score, Lighthouse Treemap and metric filtering now in PSI and Canary DevTools, and a brand new CSP audit!
All that and more, detailed in the changelog:
https://goo.gle/lh8
https://twitter.com/____lighthouse/status/1400169824773414913
💵 No more processing final transactions again!
Never directly process final transactions again! Google Play handles the checkout details so you don’t have to.
Watch to learn more 👉
https://goo.gle/3ggPwJZ
RT Adam Argyle
🆕 post on
both new functional pseudo class selectors have:
✅ great support
✅ lots of use cases
✅ 1 super power, to squash specificity
📄 read post
🔎 peep caniuse
http://web.dev/
https://web.dev/css-is-and-where/
https://caniuse.com/mdn-css_selectors_where
▶️ List Your Progressive Web App in Google Play
👀 Watch step-by-step examples + demos to list a PWA in the Chrome OS Google Play Store.
⭐ Bonus: Find out how to create and upload an application bundle using a Trusted Web Activity!
Start learning →
https://goo.gle/2R9FCRA
🧠 Combine Angular and TensorFlow.js and Build Intelligent UI at Any Scale
✔️ Machine learning + @angular templates
✔️ Build an ML model with data from Google Analytics
✔️ See a @TensorFlow Extended (TFX) based training pipeline
Watch now →
https://goo.gle/3bVtpaf
⏳ The page experience ranking roll-out is just around the corner.
What are the key update implications? How can site owners leverage new tools to optimize their pages for UX? Watch the On Demand session to ensure you're prepared.
📺👉
https://goo.gle/3yKxWGj
Excalidraw ✍️ & Fugu 🐡
@tomayac talks about new web APIs used in the Excalidraw PWA.
👩💻Why is the user experience so great?
🧠What learnings can you apply to your own apps?
Tune in to find out ⏩
https://goo.gle/3fsgejl
👋 Web Developers, meet the next generation of Google Analytics.
This session will cover:
🔴 Game-changing new features of G.A. 4
🔵 End to end set up
🟡 Export to Big Query
🟢 Creating dashboards in Data Studio
Watch now →
https://goo.gle/3hY1F8N
🏁🏎️ Super charge your PWA!
@petele looks at bringing more integrated web experiences to your users with 5 easy improvements that will take your PWA to the next level.
See how 👉
https://goo.gle/2RPxoOY
⭐️ Spectre significantly changed the way we look at web security.
Watch and learn in this #GoogleIO session:
👉 How to keep your website secure with security headers
👉 Important upcoming changes and new defaults
Watch now 📺 →
https://goo.gle/3wHXoL5
🧐 How do Web Vitals allow popular global brands to drive better user engagement?
Understand the business impact of Core Web Vitals and optimize LCP, FID & CLS.
Join us 👉
http://goo.gle/3vxnRea
What's new in Web Vitals ✨ →
We went to work on your feedback and we’re excited to share the latest on how to measure and optimize Web Vitals with with new tooling improvements. 🥳
http://goo.gle/34lPwm3
Watch this session to learn how to make the most of web platform features to successfully interact with built-in and third-party password managers.
Learn how to stay protected ✔️ →
http://goo.gle/3vyhMOE
Learn how to prepare for a more private web 🔐
🍪 3P cookie phase-out
🔧 Helpful tools
📲 New APIs
... and more !
Watch the #GoogleIO session 👉
http://goo.gle/3fKjLbW
🤷♂️Who doesn’t love easier and more efficient design?
In this session, @argyleink and @JecelynYeen will run through the various Chrome DevTools with tips on diagnosing and debugging common design issues.
Find out more 📺✨→
http://goo.gle/34nQqP0
Twitter mirror
News & guidance for developers from the Google Chrome Developer Relations team.