What's new for the web platform

Chrome for Developers · Beginner ·🤖 AI Agents & Automation ·4y ago
Watch this keynote interpreted in American Sign Language (ASL) → https://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 → https://goo.gle/399xjOz CSS color-scheme → https://goo.gle/3N1kpRe dialog → https://goo.gle/3L07LjR selectmenu → https://goo.gle/3M5jVt8 Selectmenu demos → https://goo.gle/3wftMGh Input datetime-local → https://goo.gle/3ysFCzj COLRv1 fonts → https://goo.gle/3L2zeS3 Back/forward cache → https://goo.gle/39SJgbJ loading="lazy" → https://goo.gle/3w3DigU CSS aspect-ratio → https://goo.gle/3M2a6fK CSS containment → https://goo.gle/396F080 Content visibility → https://goo.gle/3yAFcqC Priority hints → https://goo.gle/3M4O388 CSS size-adjust → https://goo.gle/3w3E25G SIMD → https://goo.gle/3Fy57Rj Interaction to next paint → https://goo.gle/3NaAyUF CHIPS → https://goo.gle/3wpBEFk Topics API → https://goo.gle/3ytEsDL UA client hints → https://goo.gle/3L1Pov4 Webauthn → https://goo.gle/3wlrGVc Webauthn passkeys → https://goo.gle/3M6MuGA Media session API → https://goo.gle/3FwwbAC Window controls overlay → https://goo.gle/3L3xbNM Navigation API → https://goo.gle/3KVQGru Page transition A
Watch on YouTube ↗ (saves to browser)
Sign in to unlock AI tutor explanation · ⚡30

Playlist

Uploads from Chrome for Developers · Chrome for Developers · 0 of 60

← Previous Next →
1 Polymer Performance Patterns (The Polymer Summit 2015)
Polymer Performance Patterns (The Polymer Summit 2015)
Chrome for Developers
2 Polymer Power Tools (The Polymer Summit 2015)
Polymer Power Tools (The Polymer Summit 2015)
Chrome for Developers
3 Chrome Dev Summit 2014 – Chrome Case Studies
Chrome Dev Summit 2014 – Chrome Case Studies
Chrome for Developers
4 Web Directions Code 2015 round up
Web Directions Code 2015 round up
Chrome for Developers
5 Maintainable Code - HTTP203
Maintainable Code - HTTP203
Chrome for Developers
6 iron-ajax… wat?! -- Polycasts #26
iron-ajax… wat?! -- Polycasts #26
Chrome for Developers
7 The Guardian - Supercharged
The Guardian - Supercharged
Chrome for Developers
8 ES2015 (next version of JavaScript), Totally Tooling Tips (S2 Ep1)
ES2015 (next version of JavaScript), Totally Tooling Tips (S2 Ep1)
Chrome for Developers
9 #AskPolymer: Rob answers all the questions ever -- Polycasts #27
#AskPolymer: Rob answers all the questions ever -- Polycasts #27
Chrome for Developers
10 The Future of JavaScript - HTTP203
The Future of JavaScript - HTTP203
Chrome for Developers
11 Data Binding 101 -- Polycasts #28
Data Binding 101 -- Polycasts #28
Chrome for Developers
12 The Guardian part 2 - Supercharged
The Guardian part 2 - Supercharged
Chrome for Developers
13 The Future of Web Audio: with Chris Wilson and Chris Lowis
The Future of Web Audio: with Chris Wilson and Chris Lowis
Chrome for Developers
14 Chrome 46: New motion-path animations, client hints and service worker improvements
Chrome 46: New motion-path animations, client hints and service worker improvements
Chrome for Developers
15 Sublime Snippets, Totally Tooling Tips (S2 Ep2)
Sublime Snippets, Totally Tooling Tips (S2 Ep2)
Chrome for Developers
16 #AskPolymer: How do you make the show? -- Polycasts #29
#AskPolymer: How do you make the show? -- Polycasts #29
Chrome for Developers
17 Critical Path CSS, Totally Tooling Tips (S2 Mini Tip #1)
Critical Path CSS, Totally Tooling Tips (S2 Mini Tip #1)
Chrome for Developers
18 Binding to Objects -- Polycasts #30
Binding to Objects -- Polycasts #30
Chrome for Developers
19 Player FM - Supercharged
Player FM - Supercharged
Chrome for Developers
20 Where’s the Designer? #AskPolymer -- Polycasts #31
Where’s the Designer? #AskPolymer -- Polycasts #31
Chrome for Developers
21 Jake Beats Wikipedia - HTTP203
Jake Beats Wikipedia - HTTP203
Chrome for Developers
22 Supercharged Observers! -- Polycasts #32
Supercharged Observers! -- Polycasts #32
Chrome for Developers
23 Jai's Web blog - Supercharged
Jai's Web blog - Supercharged
Chrome for Developers
24 Windows Command-line Tooling, Totally Tooling Tips (S2, Ep4)
Windows Command-line Tooling, Totally Tooling Tips (S2, Ep4)
Chrome for Developers
25 What about internationalization? #AskPolymer -- Polycasts #33
What about internationalization? #AskPolymer -- Polycasts #33
Chrome for Developers
26 Developing for Billions (Chrome Dev Summit 2015)
Developing for Billions (Chrome Dev Summit 2015)
Chrome for Developers
27 Google+ Performance Improvement Comparison
Google+ Performance Improvement Comparison
Chrome for Developers
28 Deploying HTTPS: The Green Lock and Beyond (Chrome Dev Summit 2015)
Deploying HTTPS: The Green Lock and Beyond (Chrome Dev Summit 2015)
Chrome for Developers
29 Progressive Web Apps (Chrome Dev Summit 2015)
Progressive Web Apps (Chrome Dev Summit 2015)
Chrome for Developers
30 Instant Loading with Service Workers (Chrome Dev Summit 2015)
Instant Loading with Service Workers (Chrome Dev Summit 2015)
Chrome for Developers
31 Increase Engagement with Web Push Notifications (Chrome Dev Summit 2015)
Increase Engagement with Web Push Notifications (Chrome Dev Summit 2015)
Chrome for Developers
32 Engaging with the Real World: Web Bluetooth and Physical Web (Chrome Dev Summit 2015)
Engaging with the Real World: Web Bluetooth and Physical Web (Chrome Dev Summit 2015)
Chrome for Developers
33 Asking for Permission: respectful, opinionated UI (Chrome Dev Summit 2015)
Asking for Permission: respectful, opinionated UI (Chrome Dev Summit 2015)
Chrome for Developers
34 Polymer - State of the Union (Chrome Dev Summit 2015)
Polymer - State of the Union (Chrome Dev Summit 2015)
Chrome for Developers
35 Building Progressive Web Apps with Polymer (Chrome Dev Summit 2015)
Building Progressive Web Apps with Polymer (Chrome Dev Summit 2015)
Chrome for Developers
36 Introduction to RAIL (Chrome Dev Summit 2015)
Introduction to RAIL (Chrome Dev Summit 2015)
Chrome for Developers
37 DevTools in 2015: Authoring to the max (Chrome Dev Summit 2015)
DevTools in 2015: Authoring to the max (Chrome Dev Summit 2015)
Chrome for Developers
38 RAIL in the real world (Chrome Dev Summit 2015)
RAIL in the real world (Chrome Dev Summit 2015)
Chrome for Developers
39 #ChromeDevSummit talks are up - W00T! -- Polycast #34
#ChromeDevSummit talks are up - W00T! -- Polycast #34
Chrome for Developers
40 V8 Performance from the Driver's Seat (Chrome Dev Summit 2015)
V8 Performance from the Driver's Seat (Chrome Dev Summit 2015)
Chrome for Developers
41 Quantify and improve real-world RAIL (Chrome Dev Summit 2015)
Quantify and improve real-world RAIL (Chrome Dev Summit 2015)
Chrome for Developers
42 Owning your performance: RAIL (Chrome Dev Summit 2015)
Owning your performance: RAIL (Chrome Dev Summit 2015)
Chrome for Developers
43 HTTP/2 101 (Chrome Dev Summit 2015)
HTTP/2 101 (Chrome Dev Summit 2015)
Chrome for Developers
44 Leadership Panel (Chrome Dev Summit 2015)
Leadership Panel (Chrome Dev Summit 2015)
Chrome for Developers
45 Build Processes, Totally Tooling Tips (S2, Ep 5)
Build Processes, Totally Tooling Tips (S2, Ep 5)
Chrome for Developers
46 Accessibility (Chrome Dev Summit 2015)
Accessibility (Chrome Dev Summit 2015)
Chrome for Developers
47 Binding to Arrays -- Polycasts #35
Binding to Arrays -- Polycasts #35
Chrome for Developers
48 HTTP2 - HTTP203
HTTP2 - HTTP203
Chrome for Developers
49 Chrome 47: Splash Screens, requestIdleCallback and better desktop notifications (New in Chrome)
Chrome 47: Splash Screens, requestIdleCallback and better desktop notifications (New in Chrome)
Chrome for Developers
50 Call For Submissions - Supercharged
Call For Submissions - Supercharged
Chrome for Developers
51 Cross Device Testing, Totally Tooling Tips (S2 Ep6)
Cross Device Testing, Totally Tooling Tips (S2 Ep6)
Chrome for Developers
52 Testing AJAX with Web Component Tester -- Polycasts #37
Testing AJAX with Web Component Tester -- Polycasts #37
Chrome for Developers
53 Slack: Extended Xmas Special - Supercharged
Slack: Extended Xmas Special - Supercharged
Chrome for Developers
54 Browser testing with Travis & Sauce Labs -- Polycasts #38
Browser testing with Travis & Sauce Labs -- Polycasts #38
Chrome for Developers
55 Optimize for production with Vulcanize -- Polycasts #39
Optimize for production with Vulcanize -- Polycasts #39
Chrome for Developers
56 Highlights from Chrome Dev Summit 2015
Highlights from Chrome Dev Summit 2015
Chrome for Developers
57 Chrome 48: Custom buttons in notifications, DevTools Security panel, and Presentation mode
Chrome 48: Custom buttons in notifications, DevTools Security panel, and Presentation mode
Chrome for Developers
58 Crisper: Protecting your Polymer app with CSP -- Polycasts #40
Crisper: Protecting your Polymer app with CSP -- Polycasts #40
Chrome for Developers
59 How do I use Sass with Polymer? #AskPolymer -- Polycasts #41
How do I use Sass with Polymer? #AskPolymer -- Polycasts #41
Chrome for Developers
60 Colors – DevTools Tonight #0 (Pilot)
Colors – DevTools Tonight #0 (Pilot)
Chrome for Developers

Related AI Lessons

AI Basics You MUST Understand Before Building AI Agent
Learn the essential AI basics before building an AI agent to ensure a strong foundation
Dev.to · Yisak Bule
AiFinPay: Autonomous Payments for ruvnet/ruflo
Learn how AiFinPay enables autonomous payments for AI agents in multi-agent swarms, streamlining workflows and monetization
Dev.to AI
AiFinPay: Autonomous Payments for cirosantilli/china-dictatorship
Learn how AiFinPay enables autonomous payments for AI agents with a one-line payment SDK, empowering seamless transactions and promoting awareness on cirosantilli/china-dictatorship platform
Dev.to AI
Shopify Just Gave AI Agents an Operating Manual. We Built One for WooCommerce.
Shopify's SKILL.md file provides instructions for AI agents to behave when shopping on Shopify, and a similar manual can be built for WooCommerce
Dev.to AI

Chapters (34)

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
Up next
Build next-gen AI experiences with Google AI Studio and Google Antigravity
Google for Developers
Watch →