Chrome Developers 
@[email protected]
Bot
Twitter mirror
News & guidance for developers from the Google Chrome Developer Relations team.
Joined Dec 2020
🔍 Feedback wanted: The road to a better layout shift metric for long-lived pages
Where @anniesullie and @mmocny discuss the Chrome team's plans to update CLS to make it more fair to single-page apps, infinite-scroll lists, and other long-lived pages.
https://web.dev/better-layout-shift-metric/
RT Dion Almaer
😋 Taste and Nutrition on the Web 💪
We need to talk taste on the Web. This post describes my journey with health & how it taught me how important nutrition is but also how we don’t want a bland world. Your website isn’t experienced as a nutrition label.
https://blog.almaer.com/taste-and-nutrition-on-the-web/
We’re excited to publicly introduce Open Web Docs, a collective project between Google, Microsoft, Mozilla, Coil, W3C, Samsung and Igalia!
Supporting a community of technical writers around strategic creation and long-term maintenance of web platform technology documentation.
Open Web Docs: We’re happy and proud to announce Open Web Docs, to support a community of technical writers around creation and long-term maintenance of web platform technology documentation that is open and inclusive for all.
https://opencollective.com/open-web-docs/updates/introducing-open-web-docs
Progress update on the Privacy Sandbox initiative:
http://blog.chromium.org/2021/01/privacy-sandbox-in-2021.html
✍️ Over the weekend, @tomayac has been looking into using the `ruby` element for HTML footnotes [1]. He's now interested in the thoughts of HTML, CSS, and accessibility experts [2].
—
[1] See quoted tweet
[2] See blog post and tweet thread for details.
Thomas Steiner: 📢 New post: `
<ruby>
` HTML footnotes:
```html
Lorem ipsom
<ruby>
dolor sit amet
<rt>
Lorem ipsum is a
chopped-up version of a real work;
you can't truly translate it.
</rt>
</ruby>
,
consectetur adipiscing elit.
```
Read on [1].
—
[1]✍️
https://blog.tomayac.com/2021/01/24/ruby-html-footnotes/
</ruby>
https://twitter.com/ChromiumDev/status/1353617191309074435
RT Adam Argyle
Conditional Breakpoints in DevTools:
✅ how
✅ why
✅ what
in 1 minute
breakpoints rule y'all, use em
🆕 #GUIchallenges from @argyleink!
"Thinking on ways to solve a SIDENAV"
✅ responsive
✅ keyboard support
✅ cross browser
✅ grid + :target
✅ transforms
✅ light & dark theme
Watch
Read
Demo
https://www.youtube.com/watch?v=uiZqDLqjGRY
https://web.dev/building-a-sidenav-component/
https://gui-challenges.web.app/sidenav/dist/
RT Adam Argyle
if the user has expressed no motion preference, destructure the feature detection boolean result and give it a friendly name on the fly
voila, now you can check if motion is OK before running any motion based animation code 🤓
Chrome 88 is rolling out now! @petele has all the details!
* Extension manifest v3
* CSS aspect-ratio property
* Play billing OT for PWAs using Trusted Web Activity
* Throttling of chained JS timers
* Abort signals in `addEventListener`s
* And lots more
https://developers.google.com/web/updates/2021/01/nic88
RT Surma
Reminder: The call for speakers for the WebAssembly Summit 2021 closes tomorrow!
WebAssembly Summit: Wasm Summit is back for 2021! 🎉
This year will happen virtually, through Youtube Livestreams, and a Discord community. 🧑💻
We are looking for speakers, fireside chat hosts, and channel moderators! 📸
Apply to the CFP below, until January 15th! 📝
https://webassembly-summit.org/
RT Adam Argyle
Flex = blue overlay (top)
Grid = green overlay (bottom)
I LOVE how these overlays stay along for the ride as I resize the element 😍
✅ see how space is distributed for the flex layout
✅ see the dynamic column size I defined my grid with
in REAL TIME
RT Jake Archibald
I've given idb-keyval a bit of a cleanup. It's now smaller, only ~250 bytes if you only need get/set. There's also a few new tree-shakable utility methods, like getMany(), setMany(), entries(), and update().
https://www.npmjs.com/package/idb-keyval
📢 New case study by @tomayac: "After a careful analysis, we [the @excalidraw project] have decided that Progressive Web App (#PWA) is the future we want to build upon". Learn more about the team's rationale:
👉
(Cross-posted on the Excalidraw blog.)
https://web.dev/deprecating-excalidraw-electron/
RT Paul Kinlan
I've hunkered down for too long and I miss talking to people and being able to help you with web development issues.
I want to fix that, so I'm going to dedicate more time to helping developers with any issue.
🗓 Book a meeting:
https://getchrome.withgoogle.com/schedule/paulkinlan?ln=en
https://paul.kinlan.me/helping-you-book-a-meeting/
RT Surma
While I have your attention:
We are still looking for more speakers and moderators for the WebAssembly Summit 2021 in April!
WebAssembly Summit: Wasm Summit is back for 2021! 🎉
This year will happen virtually, through Youtube Livestreams, and a Discord community. 🧑💻
We are looking for speakers, fireside chat hosts, and channel moderators! 📸
Apply to the CFP below, until January 15th! 📝
https://webassembly-summit.org/
🎁 A bundle of laughs for your holiday pleasure!
#ChromeDevSummit was full of educational content, tips, & tricks. It also had some silly moments featuring @DasSurma, @jaffathecake, and @aerotwist! Enjoy the show!
🤣 Get ready for some chuckles →
http://goo.gle/3heYQxX
🧭 Let’s navigate together 🧭
Learn how code migrations in @ChromeDevTools are planned, implemented, & maintained with @aerotwist, @TimvdLippe, & @Jack_Franklin. See some testing, code style, consistency, & more!
#ChromeDevSummit→
http://goo.gle/3mLIUEz
🌟 Design once. Build once. Use everywhere.🌟
Learn how Web Components empower your design systems with @asyncLiz & @rodydavis.
🗺See how your designers & engineers can provide your design to teams using any framework from React, Vue, Angular, & more →
http://goo.gle/2KJWZVE
Re @drenzulli & Andrew Kean Guan teach us about web workers vs service workers
⚖️ Explore similarities, differences, the most popular communication APIs, & some common use cases.
See patterns from successes like @1800flowers, @Tinder, & @SquooshApp →
http://goo.gle/2WAEkyc
🥇 Making the 2nd load a 1st-class citizen can make your repeat users happy.
@samthor looks at common causes of "stale assets" and suggests sensible modern defaults.
Make your life easier →
http://goo.gle/37Gi6RA
Bot
Twitter mirror
News & guidance for developers from the Google Chrome Developer Relations team.
Joined Dec 2020
