What's new in the Web (Google I/O ‘24)

Рет қаралды 48,498

Күн бұрын

Baseline gives developers a way to understand the interoperability status of web features and APIs. With clear status information available on key developer resource sites such as MDN, Can I Use, and web.dev, it's now easier than ever to know whether a feature is ready to use.
This talk will cover some of the key features now included in Baseline, helping you create more beautiful and capable sites and applications.
Baseline → goo.gle/io-bas...
Baseline 2023 → goo.gle/io-bas...
Speaker: Rachel Andrew
Watch more:
Check out all the Web videos at Google I/O 2024 → goo.gle/io24-w...
Subscribe to Google Chrome Developers → goo.gle/Chrome...
#GoogleIO
Products Mentioned: Baseline
Event: Google I/O 2024

Пікірлер: 42

@dogoku 7 ай бұрын

For the love of god, please do something about scrollbar styling!

@CirTap 7 ай бұрын

this was once possible age ago but they all removed it. I personally don't mind as too many websites created foremost ugly and frankly unusable scrollbars and these thin strips are a pita to use. Not a bit accessible. They should interop on overlay scrollbars (on windows) so the layout shifts stops with overflow:hidden.

@dogoku 7 ай бұрын

@@CirTap the current spec is too limited in what it can do and doesn't work the same across browsers/platforms. with scroll-driven animations, you can implement a custom scrollbar that requires almost no JS, but I would rather just get it fixed with css only...

@CirTap 7 ай бұрын

@@dogoku scroll bars like form controls are OS specific GUI elements so their appearance can't and frankly shouldn't be cross platform. The advantage for every Mac, Win, Linux users is that they can instantly recognise each of these on the system(s) they use and understand how to use them 'cos they work identical in all apps. Websites often break this expectation. Most custom creations I witnessed in the last 25 years I do this stuff, typically fail at some point for some users and content and sites become in accessible or unusable and degrade the UX. If designers and developers would stop trying to be smart and interfere with how stuff works, web sites/apps would simply work. Most screen designers believe they are the only ones with the ultimate idea of a good UI concepts, but for the most part it's just their personal unfounded preference. Pretty doesn't mead good or useable. Since they eventually don't have to use the sites and apps they design, they also never learn about the miserable experiences of their very heterogeneous user base that HAS to use this stuff and just end up hating their lives 🙂 My issue with current scrollbars is the inability for users to override the size (i.e. width) which can render them unusable on some devices. I frankly don't give a toss about colours - they match my OS settings and that's how I recognise them. What's your issue exactly?

@RoKkasCODE 7 ай бұрын

Ooouuu we need that ASAP!!!!

@bakerkawesa 7 ай бұрын

Great presentation. I was able to watch the whole thing despite my TikTok attention span.

@HeitorSalazarBaldelli 7 ай бұрын

best google io video, thanks Rachel!

@AlJey007 7 ай бұрын

I can't help imagining myself watching this video in 2010. My mind would've been blown.

@jtsimoes 7 ай бұрын

Web Platform Status will be super useful to keep track of the new features. Thank you, great resource.

@tarat.techhh 7 ай бұрын

lesgooooo i cannot wait to remove the overlay-no-popover polyfill now!

@BauldyBoys 7 ай бұрын

Name a more iconic duo then Rachel Andrew and Sub-Grid. I'll wait.

@maxim_mazurok 7 ай бұрын

Well, that's pretty cool, but how do I keep track of the baseline required for all 2686 npm packages that my project depends on? :) I'm assuming Babel will provide some level of support similar to caniuse integration they have. But yeah, that might be a challenge for cases where feature detection doesn't work. Like if I'm constructing CSS selectors dynamically and will have :has() inside of JS string, that will be hard to detect. Probably will have to resort to runtime checks, I guess. Also, I don't understand the value of element if it's just for a11y, why not just rely on aria attribute? Or is it similar to or - now considered to be a vital part of any application? I kinda have a feeling that Google being a search engine wanted to assert its dominance by adding an element related to its main product :D

@funkdefied1 7 ай бұрын

I’m sure you’re right about Google and the element, but also, I can’t think of a single web app (and only a few web pages) that don’t have a search bar somewhere

@maxim_mazurok 7 ай бұрын

@@funkdefied1 looks like my comment got removed as spam due to links in it... Long story short, yes, it's hard to find website without search. But most custom and 3rd party searches are no good, and Google is the best IMO.

@mikestaub 7 ай бұрын

Container queries are revolutionary.

@zhdirjfnfb 6 ай бұрын

Standardisation = Google speak for chromium domination so it has control as much as absolutely possible over all new “features” across the web

@Atractiondj 7 ай бұрын

The film industry once agreed to use 35mm film long ago, but you can't agree on one web standard that all browsers must follow. Instead, we wait years until we can use a new feature

@CuriousSpy 7 ай бұрын

Wait few more years until you can use it in production

@CirTap 7 ай бұрын

First mention of *:has()* as a feature request in Bugzilla is 16 years old.... Took 'em a while. Mozilla often ships bizarre and questionable browser and UI features and implement exotic edge case APIs rather than work on the interoperability or fixing "bugs" that are several years or over a decade old. They were able to ship subgrid years ago and @layers almost instantly but I'm still waiting for CSS OM in Firefox let alone "Houdini". They finally ship @property in FF 127 -- almost 3 years behind Chrome. Even Safari has it since early 2023. But Apple also often gets political and doesn't play along if Google comes up with new useful stuff.

@SeanJMay 7 ай бұрын

...long ago is not that long ago, compared to when film started. Some are shot on 16mm, some on 72mm. Likewise, frame rates were all over the place, for decades, from the initial jockey and burlesque movies, through to 48fps experiments that couldn't be experienced in several places, and Ang Lee’s 120fps experiment which could be viewed in even fewer... and then there's IMAX ... it's not like the image format is standard and supported everywhere.

@Atractiondj 7 ай бұрын

@@SeanJMay In my comment I was talking about the old days of film, and not modern formats, there weren’t any 120 frames per second then, and everyone was shooting in 16 frames because you needed a lot of film, and it was very expensive, and also easy to remember! And shooting 24 or 30 frames appeared with the advent of television and varies from the EU or the USA due to voltage in the network

@SeanJMay 7 ай бұрын

@@Atractiondj sure. And in the very olden-days, cameras were hand-cranked, and framerates were all over the board. Most were shot around 16. Edison insisted on 40+. But given the analog nature of the crank, it wasn't even a consistent framerate from second to second, let alone film to film. Films were sped up using booth-controlled rheostats, with shutter speeds double or triple the ~24fps playback. Sound was what normalized it to 24fps, and it still wasn't spectacularly normalized, given the forthcoming jank of image reproduction over NTSC (scanline interleaved 3:2 pulldown for reproduction on 59.97Hz displays; woof) and PAL. Even TV-native framerates were a mess, a century after we started dealing with moving pictures. Brutally difficult NES games were inherently easier to beat in Europe, because the logic ran at only 83.33% the speed of the market that created the games, with all that entailed for sound reproduction, as well. And that's a century into moving images, where we already have standards in place. It's really only very very recently that we have had the means of consistent, region-agnostic, correct(ish) playback of material, available to anybody in the world with appropriate access to sufficiently high-refresh screens, to support all of the nonsense across formats and standards, without serious temporal judder / smearing. GUI Browser interop standards have only been a concern since ~Quake/Half-Life or early seasons of The X Files, or the start of the Foo Fighters' discography. It's been a blink of an eye, comparatively, when looking at normalizing end-user experience, and roughly the same timeframe, when looking at just normalizing "good enough" developer standards. I’m not going to carry water for company actions over those 30 years; a lot of steering has done a lot of long-standing harm. Especially in the early days. But it is actually getting better, and better across OSes and chipset architectures, to boot. Right now, I can launch an Electron app on Windows, Mac, Linux and Steam Deck (either Linux native or Windows emulation via Proton)... and expect it to run on ARM or x86-64 with code-signing being the hardest part of the process. Sure, right now, that's a Chromium thing. But if I don't need some of the bleeding edge, then I can use Tauri and get the same result for a smaller footprint. I would love it if some benevolent genius had sat down and wrote out the timeless, unwavering, feature-complete web standards spec, in 1995 and everybody followed suit, and we would all have consistent sandboxed and secure access to PC features, regardless of browser or device, from this lock-step perfect roadmap. But like the rheostats in the projector booths, being slowly swapped for 24fps, this is close enough.

@PutraPutra-j6x 6 ай бұрын

Goood

@dharmaturtle 7 ай бұрын

Ahhh what was that teaser about a linter/CI tooling that would tell you that you can (or can't) use a feature!? Does that exist?! EXCLAMATION POINT QUESTION MARK

@msahu2595 7 ай бұрын

🎉🎉

@JawsoneJason 7 ай бұрын

Is this event on a plane?

@DeepTitanic 7 ай бұрын

ZED INDEX

@leothefieryhedgemouse6576 7 ай бұрын

I don't like the side tabs... plus I do not like the color picker! I want the color dropper back please!

@JahInd44 6 ай бұрын

Jahind

@YordanTGeorgiev 7 ай бұрын

CSS nesting is definitely not giving anything close to easier to read completely allowing you to make a big mess 🤒

@funkdefied1 7 ай бұрын

I think that scoping CSS with nesting makes things much easier to follow and debug.

@CirTap 7 ай бұрын

Given that ** also creates a "search" landmark just like *

@christianoliff 7 ай бұрын

I disagree... that's like saying the element isn't helpful because it's really the same as . All other landmarks have their own element so I think it makes sense for a one too.

@funkdefied1 7 ай бұрын

can be made with CSS: ‘white-space: nowrap;’ is a more limited form of . You’re spot on with that assessment, though it must have been trivial to implement.