What's new for the web platform

Опубликовано 11 мая 2022, 20:36

Watch this keynote interpreted in American Sign Language (ASL) → goo.gle/3wd5MmZ

Una and Jake dive into recently-cross-browser features, and some experimental stuff that's on its way to make web development easier and more powerful.

Chapters:
0:00 - Intro
0:51 - New UI features
1:10 - Accent color
2:11 - [Dialog]
3:26 - Selectmenu
4:14 - Datetime-local
4:35 - COLRv1
5:44 - Bfcache
7:02 - Image Lazy Loading
7:36 - Aspect-ratio
8:18 - Containment
9:21 - Priority hints
10:13 - Size-adjust
10:56 - SIMD
13:32 - CHIPS
14:43 - Topics
15:39 - User-Agent Client Hints
15:48 - WebAuthn
17:01 - Media Session API
17:22 - Window controls overlay
18:35 - Navigation API
18:54 - Page transition API
19:41 - Web app color scheme
19:51 - Eyedropper API
20:46 - Virtual Keyboard
21:11 - Structured cloning
21:59 - CreateImageBitmap
23:25 - SharedArrayBuffer
23:57 - URLPattern
24:39 - Web Codecs API
24:55 - Cascade layers
27:36 - :has()
29:36 - Container queries
29:54 - Wrap up

Resources:
CSS accent-color → goo.gle/399xjOz
CSS color-scheme → goo.gle/3N1kpRe
dialog → goo.gle/3L07LjR
selectmenu → goo.gle/3M5jVt8
Selectmenu demos → goo.gle/3wftMGh
Input datetime-local → goo.gle/3ysFCzj
COLRv1 fonts → goo.gle/3L2zeS3
Back/forward cache → goo.gle/39SJgbJ
loading="lazy" → goo.gle/3w3DigU
CSS aspect-ratio → goo.gle/3M2a6fK
CSS containment → goo.gle/396F080
Content visibility → goo.gle/3yAFcqC
Priority hints → goo.gle/3M4O388
CSS size-adjust → goo.gle/3w3E25G
SIMD → goo.gle/3Fy57Rj
Interaction to next paint → goo.gle/3NaAyUF
CHIPS → goo.gle/3wpBEFk
Topics API → goo.gle/3ytEsDL
UA client hints → goo.gle/3L1Pov4
Webauthn → goo.gle/3wlrGVc
Webauthn passkeys → goo.gle/3M6MuGA
Media session API → goo.gle/3FwwbAC
Window controls overlay → goo.gle/3L3xbNM
Navigation API → goo.gle/3KVQGru
Page transition API → goo.gle/3kVBFLF
Themes in manifests → goo.gle/3ynnhUu
Eyedropper API → goo.gle/3w1spfk
Virtual keyboard API → goo.gle/3yx0CVI
structuredClone → goo.gle/3M2DQc9
createImageBitmap → goo.gle/38jXyBI
Top level await → goo.gle/39VD8zz
Private fields → goo.gle/3ytxPBi
array.at → goo.gle/3yrenoU
SharedArrayBuffer → goo.gle/3L3J2vb
URLPattern → goo.gle/3P5e2y2
Web codecs API → goo.gle/3Pnl2GS
CSS cascade layers → goo.gle/3M58Ubc
CSS :has() → goo.gle/38cggeF
CSS container queries → goo.gle/3FA9Odx
Container query polyfill → goo.gle/3ytfjJy
Interop 2022 → goo.gle/3rjw0Tf


Speakers: Una Kravets, Jake Archibald

Watch more:
All Google I/O 2022 Sessions → goo.gle/IO22_AllSessions
Web at I/O 2022 playlist → goo.gle/IO22_Web
All Google I/O 2022 Keynotes → goo.gle/IO22_Keynotes

Subscribe to Google Chrome Developers → goo.gle/ChromeDevs

#GoogleIO