September 11, 2025 • 52 mins
Why CSS is Now the Fastest-Moving Space in Web Development (with Una Kravets)
While everyone's talking about AI disrupting development, Una Kravets from Google Chrome reveals a surprising twist: CSS has quietly become the fastest-evolving part of web development. In this conversation, Una breaks down how features that required months of JavaScript engineering are now landing as native platform capabilities. Think customizable dropdowns, anchor positioning, and scroll-driven animations. She shares insights from working directly with Chromium engineers and explains why senior developer expertise is becoming more valuable than ever, even as AI lowers the barrier to building applications.
Una walks through her process for identifying platform gaps and working with standards bodies like Open UI. She also tackles the unique challenge of scaling web platform knowledge in an AI-driven development landscape, sharing her mixed feelings about AI's current applications. From her success building Chrome extensions with Gemini to her frustration with chat-based customer service, Una argues for using AI where it makes sense while maintaining the human elements that make the web engaging. Whether you're skeptical about AI's role in development or curious about the cutting-edge of CSS, this conversation offers a grounded yet forward-thinking perspective on the future of web development.
Our Fantastic Guest
Una Kravets
Una Kravets leads the Web UI Developer Relations Team at Google Chrome with a mission to make the web platform easier to build on and more powerful. She hosts the CSS Podcast and has spoken at over 100 conferences around the world helping folks build better web interfaces. When Una isn't online, she loves to craft and recently became a mom.
X
Bluesky
Website
Links and Resources
Emil Kowalski's React motion course animations.dev
Google's web development guidance and feature announcements
Open UI Community Group
CSS Working Group GitHub
Web Platform Tests
Thank you very much for listening!
We are also pretty much on all social media platforms, so make sure to like and subscribe!
Homepage - https://www.weeklybrew.dev/
BlueSky - https://bsky.app/profile/weeklybrew.dev
Instagram - https://www.instagram.com/weeklydevsbrew/
TikTok - https://www.tiktok.com/@weeklybrew.dev
YouTube - https://www.youtube.com/@theweeklydevsbrew
LinkedIn - https://linkedin.com/company/the-weekly-dev-s-brew
Mark as Played
Transcript
Episode Transcript
Available transcripts are automatically generated. Complete accuracy is not guaranteed.
(01:00:00):
Welcome everyone to anotherepisode of the Weekly
Dev's Brew. I'm superexcited to sit here today
with Una. With Una. Yes. Weare going to talk about
interaction patterns today,besides probably a lot of other
stuff. And before this podcast,you mentioned
that you've learned alittle bit and researched a
(01:00:20):
little bit and thinking aboutinteraction pattern that we
apply these days to the in theweb, but also how they're going
to change, probably withthings like AI and those
things. So what are yourthoughts so far? Okay. An area
that I have workedin for the past few years has
been CSS, HTML, JavaScript,things that are
(01:00:44):
core to the platform,right? That help you build UIs,
make it easier to build theseengaging web
experiences. But right now,we're at this interesting point
where this whole definition ofwhat a web
developer is, is changing.
And we have these AI tools thatare using LLMs that are
searching the internetfor what other people
(01:01:04):
are doing to then build theseUIs and make all these
decisions for you.
And I find that this isreally interesting because you
don't have to have webdevelopment experience to build
web applications.
And 90% of what I see that'scoming out of these LLMs is web
stuff that'scoming out of these AI
tools. So that is interestingto me. And I think that there
(01:01:24):
are theseopportunities and these gaps
that aren't really filled thatkind of exist, especially when
you're letting a tool make thedecisions for you that doesn't
really have all of the rightinputs. And it leaves all these
opportunities for what happensin between stages. How do you
improve a userexperience? Like morphing
(01:01:46):
animations is one thing thatI'm seeing a lot of animating
between page viewswithin page views,
like thinking about having likethe right sort of easing
between animations.
And so I've been likelooking a lot at what exists
out there, these patternlibraries that like
AI tools are using,also developers are using. And
I'm also taking this greatonline class from
(01:02:07):
Emil Kowalski calledanimations.dev. And that's been
really interesting because itkind of is giving
me this viewpoint of,like perfecting animations,
like the small things. Andthat's an area that I
feel like I'm not reallygood at. So I'm like immersing
myself in it right now becauseI want to improve.
One thing that you mentioned, Ithink is very interesting. And
(01:02:29):
you said that the definitionof web development is kind of
changing right now. And I thinkthis was already
like never reallydefined topic to begin with,
because we had always thesefloating rules of like a
JavaScript developer,UX developer, web developer,
and they're always like kind oflike tangent. And they're like,
if it's like a Venn diagram,they're like all have those
(01:02:50):
overlaps, butthere's also like a certain
distinction. So I'm reallycurious to see or hear your
thoughts on like,what do you, how do you,
how would you define webdevelopment these days?
I think that this is aninteresting question, right?
Especially with AI tools,because you don't
(01:03:12):
even have to have anydevelopment experience. You
don't have to be a UIdeveloper or, you know,
full stack developer, or even aUI designer. Like you can just
open a tool and Idon't know if we want to
like get into specifics, butyou can just open a tool, you
can write a prompt,you could have this tool
generate an entire applicationand UI for you. And then your
(01:03:34):
job as a developeris essentially to
debug, find the gaps. That'swhere like the, I think
development expertise stillcomes into play
because no AI tool is reallyperfect. We'll say perfect, but
also like onceyou go beyond like
the zero prototype, that'swhere the challenges start to
(01:03:55):
pop up. So that's like whereyour development
experience and skills arepretty critical. But what I've
been seeing latelyis people who don't
come from this world that mightcome from the music industry or
come from like thebeauty industry or
something else, be able tobuild apps or sites or things
that are tools forthemselves or for their
(01:04:16):
friends. And like, that's,that's a part of the AI space
that I've been havinga lot of fun with. It's
just like building tools formyself and my friends. So I
think that that's beeninteresting, but like
not necessarily for productionyet. Although I could
definitely see that spacechanging a lot right now.
I'm always fascinated by howthe commodity of those things
change. Like, oh,you have, I don't know,
(01:04:37):
you want like a, I don't know,like poker app, but it is like
$5 on the PlayStore. So you can just
dump something at V0 orsomething and get an app to
play with your friends. I likethe barrier of entry got so
much lower in a way. Thebarrier to entry, at least for
building anapplication is definitely
(01:04:58):
changing. I don't think thatwe're going to necessarily see
a lot of folks who don't havedevelopment experience be
successful in like launching abunch of production products.
I also agree with that.
Because that is, I actuallythink senior level expertise is
more valuable than ever, becausethe thing that AI struggles
with the most is a finesse,which is like this
area that I'm kind ofinterested in right now. Making
(01:05:20):
your application look actuallydifferent than every AI app out
there. And then B debugging,like when you actually are
trying to build a complexfeature, that's where
it seems to get stuck and runin circles because the answers
aren't already outthere. Right? So if
you're working on like somekind of unique value prop or
(01:05:41):
like a unique technicalchallenge, that's where
you're going to needexperience. Yeah. And I think
AI is also a great learningtool for people who
have less experience. Becauseyou can use it to explain a
code base. You can use it tolike understand
how to make certain tech, likewhat direction you should go.
But yeah, there are limitations.
(01:06:02):
And that's, I think on thispodcast, I said this also
before, but I was always hopingfor that. But so far,
everyone I talked to is morelike, it's frustrating for
junior developers, because theydon't understand
what the code generates. Andthey're, they're still lacking
this level of like,ambition, maybe in a sense, but
(01:06:23):
also like, just like expertperiods to like,
okay, I need to understandwhat the code does. And how do
I bridge this gap? How do Iapproach it? So, so far, most
of what I heardfrom the industry, I like, as a
position in developer advocacy,it's a little bit
different. Oh, youprobably know. But so far,
everything, I was also veryexcited. I thought like, hey,
(01:06:45):
this would be a greattool for me to finally learn
Rust, which I've on my to dolist for like,
probably three years at thispoint. Or I still have a Vim
Motions book, like literallylaying in front of me here.
Um, like, I kind of agree withyou, right? I used to come from
that perspective of,this is horrible for juniors,
they're never going to learnhow to code. But I
(01:07:05):
disagree with that now,after having played with AI
tools a lot more in spaces thatI have no
experience in. So like,for example, I recently built
an internal Chrome extensionthat does a task
that was frustrating mefor years. And like, the task
is basically, whenever we doslide decks for Google IO, we
have to use Googledrive, Google slides. To do
(01:07:28):
syntax highlighting for Googleslides, we have to
go into this toolthat somebody else built in a
separate tab, and then take mycode from the
Google slide deck andpaste it over and then change
some values, and then go backto the slide deck and
find your slide againand paste it like all of these
just like annoying steps. So Iwas able to quite
quickly use Gemini,which is just because that was
(01:07:48):
the, you know, the tool that wehave internally, lots of tools.
But the most recent version isactually very, very good. I was
able to build thisChrome extension and
then ask the AI, like, how do Iinstall it? What are the steps
that I need to donext, like, kind of
learn about how to even buildand install and test Chrome
extensions by asking thosequestions. So now I
(01:08:09):
have more than zero knowledgeabout Chrome extensions, but
zero I had none before.
I kind of hope and I had MarkTexan here on the podcast
before and hedescribed LLM to AI tools
kind of like back in the dayswhen people had to learn how to
Google. I hope it'skind of like that,
where we're at this phase rightnow where it's like, yes, we
have to findgood patterns how to
(01:08:30):
utilize this tool and like,yes, getting from not working
to working should always bestep number one,
but understanding why somethingis working should be step
number two, maybestep number three.
Yes. Like, I think anotherthing is this discrepancy now
that I feel as a developerrelations engineer versus like
(01:08:51):
a user of these tools where Ithink the
writing and instructionis going to be more important
than ever to make that veryclear. But people like authors,
developers are going to bereading less than ever because
like another thingthat I did literally
yesterday, I wanted to build apolyfill for something and then
I wanted to test against aplatform test and the docs on a
(01:09:11):
platform tester just kind oflong. So I
installed the repo and thenI just asked Gemini to set it
up for me. So I used like NBScode Klein and then
it does like the autoacting for you. And I just had
it set up the repo withouthaving to like go
through and read theinstructions. And then you can
ask it questions against thereadme. So I could
ask like, how do I runthis in Firefox? How do I run
(01:09:33):
this with a injected script?
And like, that's whatI mean by you can use
these AI tools to improve thespeed of your workflow and also
to like learn howto do something,
like how to test against aplatform test. When you said
developers aregoing to read less,
I thought you meant aboutsource code because I'm fairly
(01:09:53):
sure that the shiftfrom like writing code
to reading code is going to bea lot more going towards
reading code overthe next few years.
Maybe. It's just such aninteresting position that we're
in right now, right?
It kind of feels like being akid in a, how do you say, like
(01:10:14):
candy store,right? Kind of like,
because there are all theseopportunities right now. Like I
think as we asdevelopers have like
the creativity to see now, nowthat we've like proven, okay,
those are viable tools that we,that actually deliver benefit
for us in our daily work. Thereare all these
possibilities. And it'slike, okay, what is going to be
like actually happening? Right.
(01:10:34):
And what's going to seem useful?
Yes. I think that there's timeswhere I don't think AI is the
best tool. Like for example,writing blog posts, I think you
get a lot of derivative typesof phrasing. You, at least in
my line of work, like I usuallyam writing about something that
is new andthere's no documentation
(01:10:55):
yet or like no one else haswritten about it yet. So like,
that's not going towork for me, right?
If I try to use AI for that,it's just going to hallucinate
and make stuff up.
But I think it's reallygreat for like little tools for
yourself. It's great forunderstanding code
bases too. Just asking aquestion as you go. I think
that it's great for improvingthe speed and
(01:11:18):
efficiency of stuff thatyou already know how to do.
Just like asking it toarchitect out something that
you already can kindof go through and sanity check.
So I think that those areplaces where it
shines. And I too kindof like have this weird mixed
feeling about it where onething I did notice
is that when I went onleave, I was, I just had a
baby. We were just talking alittle bit. I went
(01:11:40):
on leave in September.
I came back in May and the AItooling between September and
May justcompletely changed. It got
so much better. Yes. One thingwhere you said like you don't
like AI forwriting. One thing where I
disagree with that is forinternal writing. I had to do
like a lot of executivesummaries recently.
And like for that level, likethe information matter, not the
(01:12:05):
way it's written. So I'm like,okay, I don't need to spend
like two hours writingsomething together when I
already have like allthe key bullet points that need
to be mentioned. Well, that'ssummarizing and
AI is very good atsummarizing. Yes. If you have
notes. Yes. Yes. And you needto put in the work of like,
okay, what are the importantpoints and stuff? But that was
one thing where Iwas like, okay, I can
(01:12:26):
get this out of the door withinlike the next 30 minutes
instead of mesitting down. And also like
writing as a non-native speakertakes me a little longer. So
yes, this isanother, like my parents are
Ukrainian and they're alsonon-native speakers. And my
mom, for example, has a lot of,I think, anxiety
in how she writes emailsspecifically, and will
(01:12:47):
sometimes have me likeproofread just like quickly
time around. I feel like Ireally want her to use these AI
tools just to help hermore confident in sending this
message. And that's a great usecase for it, in my opinion.
Yeah, agree. Okay. This is, Ilove this conversation. But
let's circle back alittle bit. You mentioned
(01:13:09):
that you dove into animationsand like the finesse of it.
Like, what do you do?
Are we talking aboutlike the last 20% of like an a
100% animation or like, whatdoes, what does that look like?
Yeah. So I've kind of beenthinking about how do you make
(01:13:30):
the web feel better?
Like feel more native?
There's something about, it's,this is a big topic. Okay. So
one interesting thingis like on your mobile
device, you have these physicalmetaphors, right? Pressing,
swiping, like gestures,physics, like there's
something physical there thatyou as a user respond to. We
(01:13:51):
don't see that as much on theweb, at least on
desktop and definitely not onmobile web. So like, yeah,
capabilities arestill there. It's the same
form factor for that device.
But we see it less. I've beenlooking at comparing like
mobile websitesto their mobile app counter
parts, trying to figure outwhat the gap is and
why that exists. And ifthere's platform features that
(01:14:12):
we need to ship to make iteasier to make things feel
smoother. But Ialso have noticed that there's
really some unique capabilitiesthat we have on
desktop, like hovering,like cursors, things like that,
that we're also not reallytaking advantage of as the
average developer formaking your site feel more
app-like, even though it's onthe desktop. And so I've been
(01:14:36):
kind of like digging intothat a little bit. As I
mentioned, I'm taking thiscourse by Emil, who
teaches React motion,frame of motion, motion for
React, I think is what it'scalled now. And like that to me
is really interesting to see thechoices that are being made
here. Like some of thesepatterns are things that were
definitely a gap on theplatform that I think now we're
(01:14:57):
starting to ship. Of course, ittakes time for things to go
across browser,like animating things in and
out, right? Like entry nexteffects is like a new platform
feature. Morphing is somethingthat I see here that's also
like highlighted in the courseas a way to make things feel a
lot more fluid,which I agree. Because like one
thing that is a little bitjarring about using
(01:15:19):
any digital experienceis like moving from one place
to another. We don't have likethe same kind of
analogy of like walkingfrom one room to another where
you know where you're comingfrom and going. It
just kind of changes.
But now we have these newcapabilities like view
transitions that really helpmore like either
screen views or we're workingon like scoped view transitions
(01:15:43):
so that itdoesn't freeze like the
rest of the page where you cannow sort of transition these
like micro interactions.
So I've been looking into thata bit more and how we can make
it easier tocreate these like fluid
experiences. And then like Iknow the AI thing is like seems
like a side, butI'm thinking about
that now is this is the way toscale these best practices
(01:16:06):
today because that'swhere developers are
moving to. So yeah, that's kindof where I'm leaning in this
like interaction space.
Okay, I was like probably like15 questions now, but I think I
think the onethat I want to ask,
um, because usually the theapproach that I see so far most
(01:16:27):
framework take tolike teach best practices
to LLM and chat applications isbuilding an MCP. So that's what
the Angular team hasbeen doing. I see
Tailwind, I think has beendoing this recently. And I
think today, the by the timethe podcast goes live,
not today, Chakra UI haspublished an MCP to make sure
(01:16:47):
that they use the latestcomponent that they
publish and those kind ofthings. So do you see the
approach from your end as likeChrome web platform
would be to ship like aplatform MCP? Or what are you?
What are your thoughts on this?
Interesting question. I don'tknow. I don't have the answer
(01:17:08):
for that right now.
But there's a coupleof different ideas that I've
been toying with. And one ofthem is not from
Chrome, but I think a betterplace to do this would be a
standards body or a communitygroup like Open UI.
So I've been workingwith the Open UI community
group to possibly ship a set ofpatterns that would
be like default, likelow level accessible patterns
for things like a login form oralerts like
(01:17:31):
dialogues, things like that,that use these native
components that could bescaled, like maybe,
I don't know, likeRadix or shadcn or whatever
these component librarieslibraries are that maybe they
would use these underlyingpatterns and have this sort of
knowledge or approval from likea web standards body, right? So
(01:17:52):
that's an idea.
I think that thatwould be interesting just like
an accessibilityperspective. Yeah.
And there's this also, youknow, there's MCP, but there's
also like cursorrules and like these
different AI rules files thatlet you as an author specify
how you wantthings to be built and
like specific direction thatyou want the AI to take as it
(01:18:13):
starts togenerate your front end.
So I think that's like anotherdirection that's possible.
There's alwaysthis really unique
challenge from my end of likeactivating new platform
features, whichis browser support.
So what do you do then? Likewe're kind of stuck waiting
sometimes for cross browserimplementations.
(01:18:35):
Yep.
There is this baselineinitiative now that sort of
documents availability crossbrowser and when
things ship to all browsers andthen there's like widely
available. So I'm thinkingabout like how do we
integrate that, you know, aspeople are building on the web.
It's a unique web problembecause on native
OSs you have version locks,right? Where as a person
(01:18:57):
updates you can support acertain set of features.
But yeah, I think like MCP isinteresting. I think rules
files are interesting. I thinkeven just like solid
documentation so that agentscould understand what their
reading is interesting.
Marking things up in aspecific way for AI to better
understand is interesting. Likedo we need to ship web platform
(01:19:20):
features for that?
Yeah.
We have a lot of options.
I'm wondering, can you justknock on the door of the Gemini
team and ask themthose things? Like what
would be the best way to teachan LLM like Gemini those
things? Or isthis more difficult?
(01:19:40):
And I'm intentionally askingbecause like it's a big company
and those things are never aseasy as it seems.
Unfortunately not. And this islike something that we've
thought about too.
Like, oh, can we providethese core accessible like
components that, you know,Gemini could use. But the team
essentially saidthat they don't weight certain
(01:20:03):
resources. Yeah.
Just like from the nature ofit. And I understand that too.
Yeah.
So we couldn't really go downthat route. But what we could
do is try to get moredevelopers and like
activate it that way, get folksto use it. And then the
weighting shouldnaturally increase and Yeah.
Um, kind of have it go morefrom like a program
perspective, especially ifyou're working with
(01:20:24):
like web platformand standards bodies.
Yeah. Yeah. Yeah. That makessense. And, and that's also the
thing on the other hand,like this space is so fast
moving. Like I think the latestis Gemini 2.5 Pro.
I wouldn't bet $5 on the factthat there isn't a Gemini 2.6
in two weeks. So it's just like,I'm not saying there is, and I
(01:20:47):
don't know the details andstuff. I'm just
always surprised byhow fast moving the space is
right now. And it's so hard tokeep up. It's so
difficult to commit on likecertain things. So,
um, totally get that.
And if you want to talk aboutfast moving spaces, CSS is
probably the fastest moving, uh,space web development right now
(01:21:10):
outside of like these AI tools.
Okay. That was very catchy. Ishould probably make this the
title of the episode.
Okay. I'm super curious now.
Why? Because, and again, onshame on me, but I'm
also okay admitting it.
I should spend a lot more timeor investing a lot more time
(01:21:31):
properly learningCSS and spending a lot
more time in that space. So I'mpartially oblivious. Um, but
why do you thinkit's the fastest moving
space? Because usually like, Imean, there, there's still this
running joke that there's a newJavaScript framework each week,
which is not the case probablyanymore since
2019, but this joke isstill floating around. It's
(01:21:55):
funny because I feel likethere's a new CSS feature each
week. That is, um,I think that we're in a really
interesting space right nowwhere we've been
shipping not only platformgaps, but also these features
that create these newcapabilities for
developers. So for example,we talked about V transitions,
couldn't really do that beforein the platform.
(01:22:17):
Um, now we're shippingthings like customizable
select. You can actually stylea dropdown menu
finally after 20 years. Um,that's something that I think
is really exciting. Uh, nowwe're working on,
um, like size attributeand select multiple. Hopefully
next will be combo box. That'sa whole can of worms. So TBD,
(01:22:38):
but that's something that openUI has been discussing for a
while. Um, withcustomizable select,
we shipped native anchorpositioning. So you don't need
to have a third party libraryto anchor elements
together anymore and to animatethem between, um, positions is,
um, something that you can do.
I think that it could beimproved. We also have an
engineer working on newcontainer queries for
(01:23:01):
the anchored position so thatwhen an element moves into
another position, you canrestyle it. So like,
if you have like an arrow, youcan move it around. Uh, we also
have new containerqueries for scroll
state. So if something issnapped or if it's sticky,
there's a CSS hook to style it,uh, which is big,
(01:23:21):
I think, um, in the scrollspace too, we've got scroll
driven animations, which arenew. So you don't
need to have these heavylibraries and like all of this,
like eliminatesneed for like different
observers, right? Which areheavy JavaScript. So you don't
need, um,intersection observers.
You don't need resize observersfor a lot of these things. Uh,
we have containerqueries that landed
(01:23:42):
and is now widely available. Wehave new carousel APIs, which
let you build CSS carousels, butessentially a carousel is just
like a fancy scroller. So youget these new
affordances for navigatingthrough your scroller, like
these previous next buttons andscroll markers. And,
um, what we'll shipprobably right before this
episode is scroll target group,uh, which I just
(01:24:05):
wrote an articleabout where you can make a
scroll spy with just two linesof CSS, where you're
able to specify likethat. I want these links, these
anchor links to be, uh, markersfor different points
in my UI. Um, so youcan create a scroll spy that
way. It's basically like makinga carousel, like your whole
page is a carousel.
And then there's, um, theability to style the active
(01:24:26):
target. So target current isthe pseudo class there.
I feel like I can just keepgoing and going, but there's a
lot of new CSS and UIcapabilities. Um, there's like
declarative dialogues. There's,there's a bunch of stuff.
That is super exciting. And I,one thing I'm a little bit
concerned, or I would like tohear your opinion on,
(01:24:47):
do you feel like those thingsmight landed a little too late
because there is already aJavaScript solution for this so
that like adoption would justbe harder, kind
of like, like if Icompare it to apps, usually the
first app that brings a featureout wins usually like we've seen
this with WhatsApp and that'slike a little bit like very
black and white andlike, kind of like
(01:25:08):
bring this example to like adifferent level. But are you
concerned that the trade-offsoptions are for developers, at
least not apparent enough thatthey would
consider those choices,even though there
are viable options now?
Well, I think that you bring upa great point and this is
something that comes upinternally a lot.
Like why are we building thesefeatures if you could
(01:25:28):
theoretically use aJavaScript library?
Um, from my like perspective assomeone who cares about the
health of the platform,these are real platform gaps
and these are core platformfeatures and we
shouldn't have to relyon some third-party library or
tool to be able to build theseinto the core platform, right?
(01:25:49):
Yeah.
We've seen libraries come andgo. We've seen like Bootstrap
and Mood tools.
We've seen these thingskind of fade in and out of
fashion. Um, I think that theplatform, not I think, the
platform has neverfaded out of fashion. The
capabilities of the platformare just growing and
becoming more powerful.
I think that that's reallyimportant to make it the place
(01:26:09):
that developerswant to build their,
their stuff, their application,their site. So I, I think this
is necessary. I'mhoping that we make
it either easier to build itnatively or that these tools
can integrate the nativefeature because there
are hooks that make it moreperformant. There are things
that make it a littlebit more reliable too,
(01:26:30):
because you don't need like aspecific solution for react
versus angular. Youcould just have the
native solution. And so I thinkthat there are a lot of
benefits ofresolving these gaps from a
platform level. And I just hopethat we can scale it. Okay.
Usually the platformfeatures like that. I
haven't used a new dialogue,but I would assume that things
(01:26:52):
like accessibility areconsidered properly
because accessibility fordialogues is just such a pain
in the ass. Yeah. Um,yeah. Dialogue is an
interesting one because all ofthese UI libraries use or have
dialogues likethey're shipping modal
dialogues, but very few of themactually use the dialogue
component, which I'mreally curious to dig
(01:27:15):
into why, because dialogue doeshave top layer support, which
you can't do inJavaScript. You can't access
the top layer without usingeither a dialogue or a popover.
So that's one nicething you have to
worry about like Z indexmanagement. That also means
that you don't need like reactportals to portal
through or tunnel through likethe top of your app. You can
just use the native thing.
There's a lot ofbenefits to like these core
(01:27:37):
features. One thing that wasmissing until
recently was the ability todeclaratively trigger
dialogues. Like now we havecommand invokers and we have,
um, light dismiss, uh, withclosed by equals any just with
dialogues as an attribute. Soyou don't have to
like add logic toclick test and see if you're
inside of your dialogue oroutside of it. There's
a lot of scripting thatyou could just get rid of and
(01:27:59):
use the native thing. I'mthinking browser support might
be one, uh, for someof these newer features. Could
be. That's, that is a bigthing. Yeah. How is that in
those standard bodies?
Like I know I talked to Danielfrom the TC 39 and for them,
they have like their processwhere it's like,
(01:28:20):
it's basically not fullyaccepted before it's
implemented by more or lessevery major browser.
How is that for CSS and otherstandard bodies? Like what is
the process? Yeah.
Yeah. Yeah. So usuallywe'll, we'll a gather research.
Like what is the gap? Thenpropose an explainer or open
some issues andtalk about it in the groups.
(01:28:41):
Sometimes we'll do a prototypefirst to test the
feature. And thenbased on that, a lot more
discussion can happen. Andthere's a draft spec that's
written that outlineswhat the feature looks like.
And then there's a lot ofdiscussion and it
usually takes a long time.
And in the process, theprototype is updated and I have
to go and update all my demos.
(01:29:02):
And then eventually there'sresolution. The shape of the
API is sort of hardened.
Browsers like across the boardand other invited
experts weigh in.
That's sort of like how the CSSarea works. Like there's
resolution, it's promoted.
There's a wholeseries of like editors draft
(01:29:22):
and like how it kind of movesinto a candidate
recommendation status.
That is a CSS working group. Soit's a web standards working
group. There'salso community groups.
Like I mentioned, open UI,which anyone can join. You
don't have to jointhrough your company.
And the process there is, it'sa lot more discussion. We have
folks that are accessibilityexperts. We have folks who come
(01:29:44):
from like the design systemspace. We have folks
that are UI developers.
And this is where a lot ofconversation is started for
things that kind of livebetween CSS and HTML.
Because HTML is a what workinggroup. And so they have a
process too. Andmeetings and like
resolutions and things for theHTML spec. So open UI will have
(01:30:04):
a lot of this pre-discussion,feedback research, and then
it's graduated to either CSSworking group or the
what working group.
Gotcha.
So hopefully we see crossbrowser support and shipping.
There's also aprogram called Interop,
where we all come together, allthe major browser vendors and
kind of make a decisionaround what we want to focus on
(01:30:28):
as like a wider community andship. And it
started as this effort tolike identify bugs and gaps.
And now it's sort of includednewer features that we want to
see because there'sa wide developer need for it or
they're very popular features.
So that's definitely grown. Andit's great to see folks come
(01:30:49):
together there.
That's an interesting point.
How do our features or ideasbrought up in such a
forum? Because like,I feel like to some extent,
it's hard to identify, okay,this is something that exists
that is commonly used,but this is fully powered by
JavaScript libraries right nowthat should probably be
(01:31:11):
transitioned into the platform.
So how is that identificationand proposal process then?
Anyone can open an issue. Soanyone can go to
the CSS working group,GitHub or the Open UI GitHub
and open an issue anddescribe their problem.
The more detailed, the better.
If you have testcases like gaps,
that's best. Usually this comesfrom, I'm trying to do
(01:31:35):
something and I can't do it.
Mm-hmm.
Uh, this is a, this is a gap.
We need thisfeature in the platform.
Then it'll be aligned to a specand it's usually labeled and
like whether it's, I don't know,layout or whether it's, uh,
anchor. There's like thesedifferent specs.
Mm-hmm.
Um, you know, I'm sure ifyou've ever gone and looked at
(01:31:56):
CSS working groupdrafts, they're,
they're long. Yes.
They're heavy. Uh, maybe youcould use AI to help you read
the draft, uh, spec or.
Yeah. That would be helpful.
Yeah. I think it could helpsummarize it. Actually, I think
it's a good use case.
Um, but yeah, that's, that'show you do it. And anyone can
participate in that process.
Another great way toparticipate in web standards is
(01:32:17):
by taking the state of surveys,like state of CSS, state of
HTML, state of JavaScript,because we look at that,
um, and other browser vendorsand folks who are building for
the web platform,look at the results
of those to help us see wheredevelopers are struggling, what
they're excited about, um,what the gaps are.
(01:32:38):
Do you, do you have like aconcrete example
of something thattransitioned or like that was a
conclusion out of one of those?
Because I'm, I usuallyparticipate in the JavaScript
one and I try now to think back.
I'm trying to like match mymental model. I have been way
more involved in theCSS and HTML space.
(01:32:59):
So I can't really speak toJavaScript, but, um, a lot of
the architectural work that hasshipped in CSS,
like CSS nesting right now,we're looking at functions and
mixins. Um, eventhe ability to style
a dropdown, like customizingform controls, all of that came
from like veryclear developer evidence
that these features are neededbecause you're not going to see
(01:33:19):
it like as a user, right?
But developers are asking forthese things and it's something
that was very useful with Sass.
Um, so yeah, a lot of thesefeatures kind of need evidence.
Like even ifthere's a hypothesis,
like I think developers wantthis great, but I sometimes
often need toprove that there's a
community need,um, to prioritize it.
And funny enough, CSS nestingwas the reason that I finally
(01:33:43):
said, okay, I don't needSCSS SaaS anymore. I can just
use CSS now. And I'm wayhappier since, but I, I, CSS
nesting was alsothe first and so far only CSS
specification that I readbecause I wrote a blog post
about it. And I was like,okay, this is really tough to
(01:34:04):
read. And like LLM at that, itwas like 2023.
So I would, I wasnot convinced about LLMs at
that point. Uh, so I read it upand down. I was like, this is
kind of confusing.
There's a lot of terminology inthere too. That could
be really confusing.
Um, yeah. And, and also it'slike, there are a lot of edge
(01:34:26):
cases covered beforeit's like going to the
actual like meat of it, if thatmakes sense. Right. Cause you
have to cover all of your cases.
If you're writing aspecification, the browser's
different. Forsure. For sure. Um,
okay. What is a platform draftfeature that is in the works
(01:34:48):
right now that you'resuper excited about?
In the works, uh, there's,there's a lot. Um, I think for
me, one that I havehad a lot of investment
in wanting for a while and havebeen a part of from the start
is really like this journey forcustomizable select. Um, that
(01:35:08):
is something that I have neededon the platform for so long,
just like rebuilding the samething over and over. Um, the
core library landed,like the core customizable
select features, but there'sstill a lot of work to do.
Like select multiple, Imentioned even like combo
boxes, things like that. Thoseare things that I
am very excited to see beingworked on. Um, additionally,
(01:35:33):
like a lot of anchor features,for example, I mentioned like
the anchored container queries,like that is something that is
a missing feature for anchorpositioning. People want to be
able to restyle theanchor when it moves
into different positions. Um,so that's still a work in
progress and it's,I don't think it's spec yet, or
there might be, no, it's notspec yet. Cause
(01:35:54):
our engineer has beenout. It's summer right now as
we're recording. Um, but that'slike something I'm
really excited to seeland. And now as I'm digging
more into the interactionspace, like I
think a lot of thesescroll APIs that Adam Argyle
actually worked on a lot. Um,those are really
useful and not just in likefull page scroll, but like
these micro interactions, likemoving around a
(01:36:16):
website is such a corecapability.
Yeah. Um, he had this cool demoalso a couple of weeks ago
where he heavilyused that feature.
And I was just, that's such afun way to interact with the
web. And it's like, yeah.
Yeah. If you don't follow Adam,you definitely should. Also,
Bramus and our team has beendoing a lot of view transitions
stuff and like a lot ofinteractions space
(01:36:37):
stuff. So maybe in the shownotes, we could link everyone.
Yes. Uh, I'll probably hit youup for like all the links and
stuff, but yes, I'll,I'll do my very best to put
everyone and everything in theshow notes. Um, okay.
Another thing that I'mwondering and probably also
will benefit from it myself. Ifwhat is one thing
that you would likepeople to better understand
(01:36:59):
about the web platform?
Oh, interesting.
Um, the cascade.
Oh, I feel like that's an areathat a lot of people get very
caught up like specificity inthe cascade and somebody who's
like core, like low level, howdoes CSS work
stuff? I think a lotof people turn to libraries
(01:37:21):
like tailwind because they wantto ignore the
cascade. Um, so yeah,I'm sorry. No,
you're good. So yes. Yeah.
The cascade.
Yeah. I had a conversationabout that with, uh, Daniel
Rowe on thispodcast where I was like,
well, this is a bug. And he'slike, no, this is CSS
(01:37:42):
cascading. And I'mlike, yeah, okay, fine.
It's embrace the cascade.
That's the thing. Like ifyou're cognizant of the
behavior, it allows forreally powerful implementation,
the way you structure CSS. Ifyou're not
cognizant, then you'rejust getting caught up by it.
And like, yeah, yeah, I don'tneed to explain that to you.
(01:38:06):
So, um, the one thing that Istruggle with because CSS is to
a level intuitivethat you can like write
CSS and get things going prettyquickly. So I never, and again,
should probably spend the time,invest the time really learn
(01:38:26):
CSS. What would you say is agood resource for someone who
has been writing CSS probablyfor 10 years, but never spent
the time to actually learn it?
What would be a good resource?
There's a lot of goodresources out there. Um,
we have a course on web.devcalled learn CSS, and it covers
(01:38:50):
a lot of the basics. Um, ifthat's too basic,
there's also a lot of newarticles about like new stuff
on like, um, MDN is a greatresource. MDN is
awesome for documentation. Alsosome of the newer features like
anchorpositioning have like more
article style, um, posts onthere. Um, and there is an
awesome writer thatdoes a lot of CSS stuff.
(01:39:13):
Um, developer.chrome.com andweb.dev also have like what's
new, um, kind of landing.
Web.dev focuses on likebaseline features. Yeah. Sorry.
My dog is, uh, having a time.
What dog is it? Just out ofcuriosity. He's a golden doodle.
Okay. Yeah. It sounded like abigger dog. Oh, he's like, not
(01:39:33):
that small. He's amedium sized dog.
Medium size. Yeah. Yeah. Um, I,I do have to say web.dev is a
fantastic resource. I,that's probably the best way
for me as like an advocate inthe web space to
keep up with platformfeatures. Um, yeah. Also we do
(01:39:56):
an end of year CSS wrappedwhere we, uh, do like an
overview of allthe things that landed. Um,
that tends to focus on newerfeatures, but we
kind of do our mid-yearlike Google IO stuff and then
end of year CSS wrapped. And soyou can kind of
get like a, every sixmonth's, um, overview of things
to look out for. And people askme all the time,
(01:40:18):
like, oh, do I needto like know all these
features? And I guess my adviceis you don't have to
know how to use all ofthem in detail, but know that
they exist so that you can usethem when it
becomes useful to you.
Yeah. Knowing they exist iscritical because if you don't
know they exist, you can'tactually benefit
from the future. Right. In away, that's what I like about
going toconferences. I don't need to
(01:40:39):
understand every talk orsomething. I probably wouldn't
go to a conference ifI already understand
every talk, but like having itheard that you can like map it
out once you're in thesituation where
it can be applied and thenwatch the talk again, if it's
online, I think it's a, hasworked out for me
the best and in a similar way.
That's one thing I'm curious,how close are you working with
(01:41:02):
like the Chrome team on aday-to-day basis? Very. Okay.
Because I can, yeah. Yeah.
I work very closely with theChromium engineers, the people
who build platformfeatures. Yeah. Okay.
Yeah. That makes sense. It'skind of cool how it works
(01:41:24):
because they areall C++ developers.
Yes. Like they're building theengine. They're not really web
developers who arebuilding websites and
like running into theseproblems themselves. So we get
to be their web developercounterparts that
interface with the developercommunity, are the V0 testers,
are the ones who arelike able to provide
a lot of real world feedbackand help prioritize some of
(01:41:46):
these features and likeidentify the gaps and
test if they actually solveproblems. So it's very, we work
very closely in this lot oflike symbiosis.
Yeah. This is also perfectbecause if things work out
correctly, this episode goesout after one that I
recorded with the creator ofLadybird, the open source
(01:42:07):
browser engine. So, and hementioned similar
things. Like he's like, yeah,I'm not a JavaScript developer.
I have no idea. Right.
Okay. But so I was askingbecause I could also see you
like being verydistinctly more focused on
like the platform features andyeah. So I was just curious how
(01:42:28):
that, that isorganized. But that's a
cool approach. But that meansyou're more working with the
Chromium engineforks, not with the Chrome
forks particular that make likedev tools and those kinds of
things. Is that?
I do work with the dev toolsteam too. Okay. We sometimes
interface with other teams,like where it comes to like, if
(01:42:50):
we want to add a feature thatmight adjust like Chrome browser
stuff, but that's rare. That'skind of coming up now that
we're working onthis feature called
interest for, which lets you dolike hover cards and show
interest in linksor buttons and like
have things pop up, which isalso something that I'm really,
really excited tosee in the browser.
(01:43:11):
But that has a component wherefor mobile, it might add a
context menuitem. So that's up for
discussion. We have had to talkto like Chrome browser folks
because that wouldaffect the browser
Chrome for, for lack of abetter word. But with the dev
tools team, we work quiteclosely to make
(01:43:32):
sure that dev tools supportslike these CSS features. So at
a minimum level, are there nobugs in dev tools for
the new features we add? Andthen sometimes we get the
opportunity to add some moreadvanced features
for dev tools, like fordifferent types of positioning.
Like you might have noticedthere's like grid
and flex tooling.
Yeah. A bunch of thesecapabilities have a little bit
(01:43:54):
of an advanced tooling. Soright now I'm working on
anchor positioning tools fordev tools, where you could move
things in differentanchor positions and
test those. And also a tool forlike popovers to like force
them open so thatwhen you have something
like this interest triggeredpopover, you can actually debug
it because it doesn'tgo away every time you
(01:44:15):
hover. Oh, that's cool. What doyou mean with this interest
link? This is thefirst time I hear about
this. So I was like trying toget a mental model in my head,
but couldn't quite get it there.
Yeah, sorry. There's so muchthat is shipping. Like I
mentioned, CSS isthe most interesting
place in web development rightnow. That's, that's another
(01:44:38):
feature I should havementioned earlier, but
interest invokers essentiallylet you build hover triggered
or tab triggeredcontent. So like on
GitHub or on blue sky orTwitter or any site really that
has any kind of like preview,like Wikipedia,
(01:44:58):
you often will get a popoverthat's anchored to either a
link or a buttonwith more information.
Yeah. That capability is reallyhard to do right now and really
hard to build accessibly.
Yeah. So like we talked todifferent teams in big tech,
for example, andthey said they spent six
months building that one hovertriggered feature and had three
different engineersworking on just that
(01:45:20):
for six months. Like it's justreally hard to build it
accessibly. And then like evenafter all that work,
they don't know if they got theaccessibility right. Everything
that opens and closesdynamically is just hard for
accessibility. Yes. Butespecially things that are
triggered soephemerally. Yeah. Oh yeah.
You might have this like hoverand then what do you do in
(01:45:41):
different modalities?
And then how does thatspeak into the accessibility
tree? Like what differentstates should be provided?
That's also why people usethese libraries understandably
to build a lot of componentsbecause all of the
accessibility stuff isbuilt in already. It's way too
hard to do that. That's likeone of these like
(01:46:03):
blue sky goals thatwe have for the web platform is
that you don't have to thinkabout that. It's
already built in.
Like think about it, but youdon't have to go and add all of
your ARIA roles andall of your labels and
like all that stuff should bebuilt into the platform. Sadly,
a lot of people still don'tthink about it at
all, but that's a differentconversation. That's the
problem. Like,and as much advocacy
(01:46:26):
that we want to do about, youknow, care about accessibility,
it's still waytoo hard to do it.
Yes. Yes. I agree with that.
One thing I'm wondering andgoing a little bit
full circle back to theAI conversation we had in the
beginning, do you, because wekind of see this
shift happen from like,okay, instead of browsing for
(01:46:46):
information, I just go to achat application
that, where I put in thesame query that I would usually
put into like a search engineand I get
immediate result instead ofme searching for it manually.
Do you think user interactionslike that are going
to be changed by therise of LLMs? And that's a very
(01:47:08):
broad question. Like end usersand how they
interact? Yes. The web.
With the web, for sure. I mean,we're already seeing it in
search data, right? Like if youhave the AI overview.
Yeah. I think on websites, Idon't know because I currently
(01:47:29):
hate interactingwith chat for a question
that I have like on a commercesite and it sends me to some AI
and I have to talkto this AI and then
I have to figure out how to optout of the AI and talk to a
human. But nowthere's fewer humans because
they laid them all off becausethey wanted to talk to the AI.
I hate this trend.
(01:47:49):
And so I really hopethat we start to normalize a
little bit and kind of go backto what's actually good.
Yeah. Use AI where it makessense. So for example,
understanding a codebase that you're new to.
You've got a closed set ofinformation there that you can
query. That's likeyour own custom search.
I think that's a great use casefor AI. Yeah. Even with dev
(01:48:10):
tools likedebugging your site. Like,
but I, I hate this, this riseof just everything is an AI
chat. Everything is anAI. Like that is not a
good feature. And I think thatwe're going to start to see a
pendulum swingaway from that soon.
I, I don't think chat isnecessarily a very natural
(01:48:32):
interaction modelfor us as humans,
even though like conversationalit is, but so I'm, I'm very
curious because Ican see it swing either
way where like, I can see a lotof website traffic go away
because there's not,not just a need for it,
for me to go directly there,but an LLM can go there for me
(01:48:53):
more or less alittle simplified.
But on the other hand, we alsooften want to have that user
experience. We wantto, so it's kind of,
I kind of feel it's like atrade off between like
experience and efficiency. SoI'm just very curious
to see where this goes, but Itotally get what you're saying.
Like if, if there's like a chat,I'm curious too.
(01:49:15):
Yeah. If there's a chat, I'mlike immediately like, send me
to a representative, send me toa representative, send me to a
representative. Right. Yeah.
I think it depends on what youneed to do. So if you're trying
to figure out like,what is the tree law in the
county I live in when itpertains to X, Y, and Z, I
(01:49:36):
don't want to bedigging through county websites
and finding the right page andreading some PDF. Like I don't,
I want the LLM to give me theright answer and hopefully cite
its resources, like cite thesources that I can verify. But
if it's something like shoppingfor shoes, I'm
not going to use anAI tool. I want to have a nice
e-commerce shopping experiencewhere I'm browsing.
(01:49:57):
Yeah.
And you know, I don't thinkthat the web and
websites are going away.
Yes.
I'm not going to be using an AIto look at photos of
my friends on Instagram.
Yeah.
Yeah.
I'm going to be using the webfor what it's good for. And
sometimes you need a UI.
Yeah. Okay. Yeah. I think thisis just very exciting times. I
(01:50:19):
think. I don't think I've beenthis excited about like our
industry and the what's goingaround for like at least the
last six, seven years.
I certainly think it'sinteresting. I think it's
exciting and scary.
Yes.
I don't really know how I feelabout it overall, but it's
definitelychanging how we build.
(01:50:40):
And people who are trying tokind of ignore it, I don't
think you're going to be ableto ignore it for much longer.
Yes. Yes. I agree with that too.
Thank you.
This was a great closingremark. So I think it's going
to be hard to have like abetter end statement. Thank you
(01:51:04):
so much for joining me forthis. I want to particular
thank you for this becauseyou're one of the few that
agree to this without everknowing me. So you just
randomly showed up to astranger on the internet. So I
very much appreciate that.
I thought it was fun. I know ittook like a little time to
(01:51:25):
actually get the schedule.
It was. Yeah. No,thank you so much.
I'm always happy to like chat.
I feel like there's so muchgoing on in the web space right
now. And I like really careabout it. I care about the
future of the web. So alwayshappy to chat, hear
your thoughts too.
I think you're one of thoseperfect guests for this format
(01:51:45):
of this podcast because you'reso excited about those things.
So I can immediately tell likeyour level of enthusiasm.
So it's just like perfect forlike, okay, let's put more into
this. Let's talk more aboutthis. It was great.
Thank you so much.
Yeah, of course.
Thank you again.
And to y'all outthere, see you soon. Bye.
Bye.
Welcome everyone to anotherepisode of the Weekly
Dev's Brew. I'm superexcited to sit here today
with Una. With Una. Yes. Weare going to talk about
interaction patterns today,besides probably a lot of other
stuff. And before this podcast,you mentioned
that you've learned alittle bit and researched a
(01:00:20):
little bit and thinking aboutinteraction pattern that we
apply these days to the in theweb, but also how they're going
to change, probably withthings like AI and those
things. So what are yourthoughts so far? Okay. An area
that I have workedin for the past few years has
been CSS, HTML, JavaScript,things that are
(01:00:44):
core to the platform,right? That help you build UIs,
make it easier to build theseengaging web
experiences. But right now,we're at this interesting point
where this whole definition ofwhat a web
developer is, is changing.
And we have these AI tools thatare using LLMs that are
searching the internetfor what other people
(01:01:04):
are doing to then build theseUIs and make all these
decisions for you.
And I find that this isreally interesting because you
don't have to have webdevelopment experience to build
web applications.
And 90% of what I see that'scoming out of these LLMs is web
stuff that'scoming out of these AI
tools. So that is interestingto me. And I think that there
(01:01:24):
are theseopportunities and these gaps
that aren't really filled thatkind of exist, especially when
you're letting a tool make thedecisions for you that doesn't
really have all of the rightinputs. And it leaves all these
opportunities for what happensin between stages. How do you
improve a userexperience? Like morphing
(01:01:46):
animations is one thing thatI'm seeing a lot of animating
between page viewswithin page views,
like thinking about having likethe right sort of easing
between animations.
And so I've been likelooking a lot at what exists
out there, these patternlibraries that like
AI tools are using,also developers are using. And
I'm also taking this greatonline class from
(01:02:07):
Emil Kowalski calledanimations.dev. And that's been
really interesting because itkind of is giving
me this viewpoint of,like perfecting animations,
like the small things. Andthat's an area that I
feel like I'm not reallygood at. So I'm like immersing
myself in it right now becauseI want to improve.
One thing that you mentioned, Ithink is very interesting. And
(01:02:29):
you said that the definitionof web development is kind of
changing right now. And I thinkthis was already
like never reallydefined topic to begin with,
because we had always thesefloating rules of like a
JavaScript developer,UX developer, web developer,
and they're always like kind oflike tangent. And they're like,
if it's like a Venn diagram,they're like all have those
(01:02:50):
overlaps, butthere's also like a certain
distinction. So I'm reallycurious to see or hear your
thoughts on like,what do you, how do you,
how would you define webdevelopment these days?
I think that this is aninteresting question, right?
Especially with AI tools,because you don't
(01:03:12):
even have to have anydevelopment experience. You
don't have to be a UIdeveloper or, you know,
full stack developer, or even aUI designer. Like you can just
open a tool and Idon't know if we want to
like get into specifics, butyou can just open a tool, you
can write a prompt,you could have this tool
generate an entire applicationand UI for you. And then your
(01:03:34):
job as a developeris essentially to
debug, find the gaps. That'swhere like the, I think
development expertise stillcomes into play
because no AI tool is reallyperfect. We'll say perfect, but
also like onceyou go beyond like
the zero prototype, that'swhere the challenges start to
(01:03:55):
pop up. So that's like whereyour development
experience and skills arepretty critical. But what I've
been seeing latelyis people who don't
come from this world that mightcome from the music industry or
come from like thebeauty industry or
something else, be able tobuild apps or sites or things
that are tools forthemselves or for their
(01:04:16):
friends. And like, that's,that's a part of the AI space
that I've been havinga lot of fun with. It's
just like building tools formyself and my friends. So I
think that that's beeninteresting, but like
not necessarily for productionyet. Although I could
definitely see that spacechanging a lot right now.
I'm always fascinated by howthe commodity of those things
change. Like, oh,you have, I don't know,
(01:04:37):
you want like a, I don't know,like poker app, but it is like
$5 on the PlayStore. So you can just
dump something at V0 orsomething and get an app to
play with your friends. I likethe barrier of entry got so
much lower in a way. Thebarrier to entry, at least for
building anapplication is definitely
(01:04:58):
changing. I don't think thatwe're going to necessarily see
a lot of folks who don't havedevelopment experience be
successful in like launching abunch of production products.
I also agree with that.
Because that is, I actuallythink senior level expertise is
more valuable than ever, becausethe thing that AI struggles
with the most is a finesse,which is like this
area that I'm kind ofinterested in right now. Making
(01:05:20):
your application look actuallydifferent than every AI app out
there. And then B debugging,like when you actually are
trying to build a complexfeature, that's where
it seems to get stuck and runin circles because the answers
aren't already outthere. Right? So if
you're working on like somekind of unique value prop or
(01:05:41):
like a unique technicalchallenge, that's where
you're going to needexperience. Yeah. And I think
AI is also a great learningtool for people who
have less experience. Becauseyou can use it to explain a
code base. You can use it tolike understand
how to make certain tech, likewhat direction you should go.
But yeah, there are limitations.
(01:06:02):
And that's, I think on thispodcast, I said this also
before, but I was always hopingfor that. But so far,
everyone I talked to is morelike, it's frustrating for
junior developers, because theydon't understand
what the code generates. Andthey're, they're still lacking
this level of like,ambition, maybe in a sense, but
(01:06:23):
also like, just like expertperiods to like,
okay, I need to understandwhat the code does. And how do
I bridge this gap? How do Iapproach it? So, so far, most
of what I heardfrom the industry, I like, as a
position in developer advocacy,it's a little bit
different. Oh, youprobably know. But so far,
everything, I was also veryexcited. I thought like, hey,
(01:06:45):
this would be a greattool for me to finally learn
Rust, which I've on my to dolist for like,
probably three years at thispoint. Or I still have a Vim
Motions book, like literallylaying in front of me here.
Um, like, I kind of agree withyou, right? I used to come from
that perspective of,this is horrible for juniors,
they're never going to learnhow to code. But I
(01:07:05):
disagree with that now,after having played with AI
tools a lot more in spaces thatI have no
experience in. So like,for example, I recently built
an internal Chrome extensionthat does a task
that was frustrating mefor years. And like, the task
is basically, whenever we doslide decks for Google IO, we
have to use Googledrive, Google slides. To do
(01:07:28):
syntax highlighting for Googleslides, we have to
go into this toolthat somebody else built in a
separate tab, and then take mycode from the
Google slide deck andpaste it over and then change
some values, and then go backto the slide deck and
find your slide againand paste it like all of these
just like annoying steps. So Iwas able to quite
quickly use Gemini,which is just because that was
(01:07:48):
the, you know, the tool that wehave internally, lots of tools.
But the most recent version isactually very, very good. I was
able to build thisChrome extension and
then ask the AI, like, how do Iinstall it? What are the steps
that I need to donext, like, kind of
learn about how to even buildand install and test Chrome
extensions by asking thosequestions. So now I
(01:08:09):
have more than zero knowledgeabout Chrome extensions, but
zero I had none before.
I kind of hope and I had MarkTexan here on the podcast
before and hedescribed LLM to AI tools
kind of like back in the dayswhen people had to learn how to
Google. I hope it'skind of like that,
where we're at this phase rightnow where it's like, yes, we
have to findgood patterns how to
(01:08:30):
utilize this tool and like,yes, getting from not working
to working should always bestep number one,
but understanding why somethingis working should be step
number two, maybestep number three.
Yes. Like, I think anotherthing is this discrepancy now
that I feel as a developerrelations engineer versus like
(01:08:51):
a user of these tools where Ithink the
writing and instructionis going to be more important
than ever to make that veryclear. But people like authors,
developers are going to bereading less than ever because
like another thingthat I did literally
yesterday, I wanted to build apolyfill for something and then
I wanted to test against aplatform test and the docs on a
(01:09:11):
platform tester just kind oflong. So I
installed the repo and thenI just asked Gemini to set it
up for me. So I used like NBScode Klein and then
it does like the autoacting for you. And I just had
it set up the repo withouthaving to like go
through and read theinstructions. And then you can
ask it questions against thereadme. So I could
ask like, how do I runthis in Firefox? How do I run
(01:09:33):
this with a injected script?
And like, that's whatI mean by you can use
these AI tools to improve thespeed of your workflow and also
to like learn howto do something,
like how to test against aplatform test. When you said
developers aregoing to read less,
I thought you meant aboutsource code because I'm fairly
(01:09:53):
sure that the shiftfrom like writing code
to reading code is going to bea lot more going towards
reading code overthe next few years.
Maybe. It's just such aninteresting position that we're
in right now, right?
It kind of feels like being akid in a, how do you say, like
(01:10:14):
candy store,right? Kind of like,
because there are all theseopportunities right now. Like I
think as we asdevelopers have like
the creativity to see now, nowthat we've like proven, okay,
those are viable tools that we,that actually deliver benefit
for us in our daily work. Thereare all these
possibilities. And it'slike, okay, what is going to be
like actually happening? Right.
(01:10:34):
And what's going to seem useful?
Yes. I think that there's timeswhere I don't think AI is the
best tool. Like for example,writing blog posts, I think you
get a lot of derivative typesof phrasing. You, at least in
my line of work, like I usuallyam writing about something that
is new andthere's no documentation
(01:10:55):
yet or like no one else haswritten about it yet. So like,
that's not going towork for me, right?
If I try to use AI for that,it's just going to hallucinate
and make stuff up.
But I think it's reallygreat for like little tools for
yourself. It's great forunderstanding code
bases too. Just asking aquestion as you go. I think
that it's great for improvingthe speed and
(01:11:18):
efficiency of stuff thatyou already know how to do.
Just like asking it toarchitect out something that
you already can kindof go through and sanity check.
So I think that those areplaces where it
shines. And I too kindof like have this weird mixed
feeling about it where onething I did notice
is that when I went onleave, I was, I just had a
baby. We were just talking alittle bit. I went
(01:11:40):
on leave in September.
I came back in May and the AItooling between September and
May justcompletely changed. It got
so much better. Yes. One thingwhere you said like you don't
like AI forwriting. One thing where I
disagree with that is forinternal writing. I had to do
like a lot of executivesummaries recently.
And like for that level, likethe information matter, not the
(01:12:05):
way it's written. So I'm like,okay, I don't need to spend
like two hours writingsomething together when I
already have like allthe key bullet points that need
to be mentioned. Well, that'ssummarizing and
AI is very good atsummarizing. Yes. If you have
notes. Yes. Yes. And you needto put in the work of like,
okay, what are the importantpoints and stuff? But that was
one thing where Iwas like, okay, I can
(01:12:26):
get this out of the door withinlike the next 30 minutes
instead of mesitting down. And also like
writing as a non-native speakertakes me a little longer. So
yes, this isanother, like my parents are
Ukrainian and they're alsonon-native speakers. And my
mom, for example, has a lot of,I think, anxiety
in how she writes emailsspecifically, and will
(01:12:47):
sometimes have me likeproofread just like quickly
time around. I feel like Ireally want her to use these AI
tools just to help hermore confident in sending this
message. And that's a great usecase for it, in my opinion.
Yeah, agree. Okay. This is, Ilove this conversation. But
let's circle back alittle bit. You mentioned
(01:13:09):
that you dove into animationsand like the finesse of it.
Like, what do you do?
Are we talking aboutlike the last 20% of like an a
100% animation or like, whatdoes, what does that look like?
Yeah. So I've kind of beenthinking about how do you make
(01:13:30):
the web feel better?
Like feel more native?
There's something about, it's,this is a big topic. Okay. So
one interesting thingis like on your mobile
device, you have these physicalmetaphors, right? Pressing,
swiping, like gestures,physics, like there's
something physical there thatyou as a user respond to. We
(01:13:51):
don't see that as much on theweb, at least on
desktop and definitely not onmobile web. So like, yeah,
capabilities arestill there. It's the same
form factor for that device.
But we see it less. I've beenlooking at comparing like
mobile websitesto their mobile app counter
parts, trying to figure outwhat the gap is and
why that exists. And ifthere's platform features that
(01:14:12):
we need to ship to make iteasier to make things feel
smoother. But Ialso have noticed that there's
really some unique capabilitiesthat we have on
desktop, like hovering,like cursors, things like that,
that we're also not reallytaking advantage of as the
average developer formaking your site feel more
app-like, even though it's onthe desktop. And so I've been
(01:14:36):
kind of like digging intothat a little bit. As I
mentioned, I'm taking thiscourse by Emil, who
teaches React motion,frame of motion, motion for
React, I think is what it'scalled now. And like that to me
is really interesting to see thechoices that are being made
here. Like some of thesepatterns are things that were
definitely a gap on theplatform that I think now we're
(01:14:57):
starting to ship. Of course, ittakes time for things to go
across browser,like animating things in and
out, right? Like entry nexteffects is like a new platform
feature. Morphing is somethingthat I see here that's also
like highlighted in the courseas a way to make things feel a
lot more fluid,which I agree. Because like one
thing that is a little bitjarring about using
(01:15:19):
any digital experienceis like moving from one place
to another. We don't have likethe same kind of
analogy of like walkingfrom one room to another where
you know where you're comingfrom and going. It
just kind of changes.
But now we have these newcapabilities like view
transitions that really helpmore like either
screen views or we're workingon like scoped view transitions
(01:15:43):
so that itdoesn't freeze like the
rest of the page where you cannow sort of transition these
like micro interactions.
So I've been looking into thata bit more and how we can make
it easier tocreate these like fluid
experiences. And then like Iknow the AI thing is like seems
like a side, butI'm thinking about
that now is this is the way toscale these best practices
(01:16:06):
today because that'swhere developers are
moving to. So yeah, that's kindof where I'm leaning in this
like interaction space.
Okay, I was like probably like15 questions now, but I think I
think the onethat I want to ask,
um, because usually the theapproach that I see so far most
(01:16:27):
framework take tolike teach best practices
to LLM and chat applications isbuilding an MCP. So that's what
the Angular team hasbeen doing. I see
Tailwind, I think has beendoing this recently. And I
think today, the by the timethe podcast goes live,
not today, Chakra UI haspublished an MCP to make sure
(01:16:47):
that they use the latestcomponent that they
publish and those kind ofthings. So do you see the
approach from your end as likeChrome web platform
would be to ship like aplatform MCP? Or what are you?
What are your thoughts on this?
Interesting question. I don'tknow. I don't have the answer
(01:17:08):
for that right now.
But there's a coupleof different ideas that I've
been toying with. And one ofthem is not from
Chrome, but I think a betterplace to do this would be a
standards body or a communitygroup like Open UI.
So I've been workingwith the Open UI community
group to possibly ship a set ofpatterns that would
be like default, likelow level accessible patterns
for things like a login form oralerts like
(01:17:31):
dialogues, things like that,that use these native
components that could bescaled, like maybe,
I don't know, likeRadix or shadcn or whatever
these component librarieslibraries are that maybe they
would use these underlyingpatterns and have this sort of
knowledge or approval from likea web standards body, right? So
(01:17:52):
that's an idea.
I think that thatwould be interesting just like
an accessibilityperspective. Yeah.
And there's this also, youknow, there's MCP, but there's
also like cursorrules and like these
different AI rules files thatlet you as an author specify
how you wantthings to be built and
like specific direction thatyou want the AI to take as it
(01:18:13):
starts togenerate your front end.
So I think that's like anotherdirection that's possible.
There's alwaysthis really unique
challenge from my end of likeactivating new platform
features, whichis browser support.
So what do you do then? Likewe're kind of stuck waiting
sometimes for cross browserimplementations.
(01:18:35):
Yep.
There is this baselineinitiative now that sort of
documents availability crossbrowser and when
things ship to all browsers andthen there's like widely
available. So I'm thinkingabout like how do we
integrate that, you know, aspeople are building on the web.
It's a unique web problembecause on native
OSs you have version locks,right? Where as a person
(01:18:57):
updates you can support acertain set of features.
But yeah, I think like MCP isinteresting. I think rules
files are interesting. I thinkeven just like solid
documentation so that agentscould understand what their
reading is interesting.
Marking things up in aspecific way for AI to better
understand is interesting. Likedo we need to ship web platform
(01:19:20):
features for that?
Yeah.
We have a lot of options.
I'm wondering, can you justknock on the door of the Gemini
team and ask themthose things? Like what
would be the best way to teachan LLM like Gemini those
things? Or isthis more difficult?
(01:19:40):
And I'm intentionally askingbecause like it's a big company
and those things are never aseasy as it seems.
Unfortunately not. And this islike something that we've
thought about too.
Like, oh, can we providethese core accessible like
components that, you know,Gemini could use. But the team
essentially saidthat they don't weight certain
(01:20:03):
resources. Yeah.
Just like from the nature ofit. And I understand that too.
Yeah.
So we couldn't really go downthat route. But what we could
do is try to get moredevelopers and like
activate it that way, get folksto use it. And then the
weighting shouldnaturally increase and Yeah.
Um, kind of have it go morefrom like a program
perspective, especially ifyou're working with
(01:20:24):
like web platformand standards bodies.
Yeah. Yeah. Yeah. That makessense. And, and that's also the
thing on the other hand,like this space is so fast
moving. Like I think the latestis Gemini 2.5 Pro.
I wouldn't bet $5 on the factthat there isn't a Gemini 2.6
in two weeks. So it's just like,I'm not saying there is, and I
(01:20:47):
don't know the details andstuff. I'm just
always surprised byhow fast moving the space is
right now. And it's so hard tokeep up. It's so
difficult to commit on likecertain things. So,
um, totally get that.
And if you want to talk aboutfast moving spaces, CSS is
probably the fastest moving, uh,space web development right now
(01:21:10):
outside of like these AI tools.
Okay. That was very catchy. Ishould probably make this the
title of the episode.
Okay. I'm super curious now.
Why? Because, and again, onshame on me, but I'm
also okay admitting it.
I should spend a lot more timeor investing a lot more time
(01:21:31):
properly learningCSS and spending a lot
more time in that space. So I'mpartially oblivious. Um, but
why do you thinkit's the fastest moving
space? Because usually like, Imean, there, there's still this
running joke that there's a newJavaScript framework each week,
which is not the case probablyanymore since
2019, but this joke isstill floating around. It's
(01:21:55):
funny because I feel likethere's a new CSS feature each
week. That is, um,I think that we're in a really
interesting space right nowwhere we've been
shipping not only platformgaps, but also these features
that create these newcapabilities for
developers. So for example,we talked about V transitions,
couldn't really do that beforein the platform.
(01:22:17):
Um, now we're shippingthings like customizable
select. You can actually stylea dropdown menu
finally after 20 years. Um,that's something that I think
is really exciting. Uh, nowwe're working on,
um, like size attributeand select multiple. Hopefully
next will be combo box. That'sa whole can of worms. So TBD,
(01:22:38):
but that's something that openUI has been discussing for a
while. Um, withcustomizable select,
we shipped native anchorpositioning. So you don't need
to have a third party libraryto anchor elements
together anymore and to animatethem between, um, positions is,
um, something that you can do.
I think that it could beimproved. We also have an
engineer working on newcontainer queries for
(01:23:01):
the anchored position so thatwhen an element moves into
another position, you canrestyle it. So like,
if you have like an arrow, youcan move it around. Uh, we also
have new containerqueries for scroll
state. So if something issnapped or if it's sticky,
there's a CSS hook to style it,uh, which is big,
(01:23:21):
I think, um, in the scrollspace too, we've got scroll
driven animations, which arenew. So you don't
need to have these heavylibraries and like all of this,
like eliminatesneed for like different
observers, right? Which areheavy JavaScript. So you don't
need, um,intersection observers.
You don't need resize observersfor a lot of these things. Uh,
we have containerqueries that landed
(01:23:42):
and is now widely available. Wehave new carousel APIs, which
let you build CSS carousels, butessentially a carousel is just
like a fancy scroller. So youget these new
affordances for navigatingthrough your scroller, like
these previous next buttons andscroll markers. And,
um, what we'll shipprobably right before this
episode is scroll target group,uh, which I just
(01:24:05):
wrote an articleabout where you can make a
scroll spy with just two linesof CSS, where you're
able to specify likethat. I want these links, these
anchor links to be, uh, markersfor different points
in my UI. Um, so youcan create a scroll spy that
way. It's basically like makinga carousel, like your whole
page is a carousel.
And then there's, um, theability to style the active
(01:24:26):
target. So target current isthe pseudo class there.
I feel like I can just keepgoing and going, but there's a
lot of new CSS and UIcapabilities. Um, there's like
declarative dialogues. There's,there's a bunch of stuff.
That is super exciting. And I,one thing I'm a little bit
concerned, or I would like tohear your opinion on,
(01:24:47):
do you feel like those thingsmight landed a little too late
because there is already aJavaScript solution for this so
that like adoption would justbe harder, kind
of like, like if Icompare it to apps, usually the
first app that brings a featureout wins usually like we've seen
this with WhatsApp and that'slike a little bit like very
black and white andlike, kind of like
(01:25:08):
bring this example to like adifferent level. But are you
concerned that the trade-offsoptions are for developers, at
least not apparent enough thatthey would
consider those choices,even though there
are viable options now?
Well, I think that you bring upa great point and this is
something that comes upinternally a lot.
Like why are we building thesefeatures if you could
(01:25:28):
theoretically use aJavaScript library?
Um, from my like perspective assomeone who cares about the
health of the platform,these are real platform gaps
and these are core platformfeatures and we
shouldn't have to relyon some third-party library or
tool to be able to build theseinto the core platform, right?
(01:25:49):
Yeah.
We've seen libraries come andgo. We've seen like Bootstrap
and Mood tools.
We've seen these thingskind of fade in and out of
fashion. Um, I think that theplatform, not I think, the
platform has neverfaded out of fashion. The
capabilities of the platformare just growing and
becoming more powerful.
I think that that's reallyimportant to make it the place
(01:26:09):
that developerswant to build their,
their stuff, their application,their site. So I, I think this
is necessary. I'mhoping that we make
it either easier to build itnatively or that these tools
can integrate the nativefeature because there
are hooks that make it moreperformant. There are things
that make it a littlebit more reliable too,
(01:26:30):
because you don't need like aspecific solution for react
versus angular. Youcould just have the
native solution. And so I thinkthat there are a lot of
benefits ofresolving these gaps from a
platform level. And I just hopethat we can scale it. Okay.
Usually the platformfeatures like that. I
haven't used a new dialogue,but I would assume that things
(01:26:52):
like accessibility areconsidered properly
because accessibility fordialogues is just such a pain
in the ass. Yeah. Um,yeah. Dialogue is an
interesting one because all ofthese UI libraries use or have
dialogues likethey're shipping modal
dialogues, but very few of themactually use the dialogue
component, which I'mreally curious to dig
(01:27:15):
into why, because dialogue doeshave top layer support, which
you can't do inJavaScript. You can't access
the top layer without usingeither a dialogue or a popover.
So that's one nicething you have to
worry about like Z indexmanagement. That also means
that you don't need like reactportals to portal
through or tunnel through likethe top of your app. You can
just use the native thing.
There's a lot ofbenefits to like these core
(01:27:37):
features. One thing that wasmissing until
recently was the ability todeclaratively trigger
dialogues. Like now we havecommand invokers and we have,
um, light dismiss, uh, withclosed by equals any just with
dialogues as an attribute. Soyou don't have to
like add logic toclick test and see if you're
inside of your dialogue oroutside of it. There's
a lot of scripting thatyou could just get rid of and
(01:27:59):
use the native thing. I'mthinking browser support might
be one, uh, for someof these newer features. Could
be. That's, that is a bigthing. Yeah. How is that in
those standard bodies?
Like I know I talked to Danielfrom the TC 39 and for them,
they have like their processwhere it's like,
(01:28:20):
it's basically not fullyaccepted before it's
implemented by more or lessevery major browser.
How is that for CSS and otherstandard bodies? Like what is
the process? Yeah.
Yeah. Yeah. So usuallywe'll, we'll a gather research.
Like what is the gap? Thenpropose an explainer or open
some issues andtalk about it in the groups.
(01:28:41):
Sometimes we'll do a prototypefirst to test the
feature. And thenbased on that, a lot more
discussion can happen. Andthere's a draft spec that's
written that outlineswhat the feature looks like.
And then there's a lot ofdiscussion and it
usually takes a long time.
And in the process, theprototype is updated and I have
to go and update all my demos.
(01:29:02):
And then eventually there'sresolution. The shape of the
API is sort of hardened.
Browsers like across the boardand other invited
experts weigh in.
That's sort of like how the CSSarea works. Like there's
resolution, it's promoted.
There's a wholeseries of like editors draft
(01:29:22):
and like how it kind of movesinto a candidate
recommendation status.
That is a CSS working group. Soit's a web standards working
group. There'salso community groups.
Like I mentioned, open UI,which anyone can join. You
don't have to jointhrough your company.
And the process there is, it'sa lot more discussion. We have
folks that are accessibilityexperts. We have folks who come
(01:29:44):
from like the design systemspace. We have folks
that are UI developers.
And this is where a lot ofconversation is started for
things that kind of livebetween CSS and HTML.
Because HTML is a what workinggroup. And so they have a
process too. Andmeetings and like
resolutions and things for theHTML spec. So open UI will have
(01:30:04):
a lot of this pre-discussion,feedback research, and then
it's graduated to either CSSworking group or the
what working group.
Gotcha.
So hopefully we see crossbrowser support and shipping.
There's also aprogram called Interop,
where we all come together, allthe major browser vendors and
kind of make a decisionaround what we want to focus on
(01:30:28):
as like a wider community andship. And it
started as this effort tolike identify bugs and gaps.
And now it's sort of includednewer features that we want to
see because there'sa wide developer need for it or
they're very popular features.
So that's definitely grown. Andit's great to see folks come
(01:30:49):
together there.
That's an interesting point.
How do our features or ideasbrought up in such a
forum? Because like,I feel like to some extent,
it's hard to identify, okay,this is something that exists
that is commonly used,but this is fully powered by
JavaScript libraries right nowthat should probably be
(01:31:11):
transitioned into the platform.
So how is that identificationand proposal process then?
Anyone can open an issue. Soanyone can go to
the CSS working group,GitHub or the Open UI GitHub
and open an issue anddescribe their problem.
The more detailed, the better.
If you have testcases like gaps,
that's best. Usually this comesfrom, I'm trying to do
(01:31:35):
something and I can't do it.
Mm-hmm.
Uh, this is a, this is a gap.
We need thisfeature in the platform.
Then it'll be aligned to a specand it's usually labeled and
like whether it's, I don't know,layout or whether it's, uh,
anchor. There's like thesedifferent specs.
Mm-hmm.
Um, you know, I'm sure ifyou've ever gone and looked at
(01:31:56):
CSS working groupdrafts, they're,
they're long. Yes.
They're heavy. Uh, maybe youcould use AI to help you read
the draft, uh, spec or.
Yeah. That would be helpful.
Yeah. I think it could helpsummarize it. Actually, I think
it's a good use case.
Um, but yeah, that's, that'show you do it. And anyone can
participate in that process.
Another great way toparticipate in web standards is
(01:32:17):
by taking the state of surveys,like state of CSS, state of
HTML, state of JavaScript,because we look at that,
um, and other browser vendorsand folks who are building for
the web platform,look at the results
of those to help us see wheredevelopers are struggling, what
they're excited about, um,what the gaps are.
(01:32:38):
Do you, do you have like aconcrete example
of something thattransitioned or like that was a
conclusion out of one of those?
Because I'm, I usuallyparticipate in the JavaScript
one and I try now to think back.
I'm trying to like match mymental model. I have been way
more involved in theCSS and HTML space.
(01:32:59):
So I can't really speak toJavaScript, but, um, a lot of
the architectural work that hasshipped in CSS,
like CSS nesting right now,we're looking at functions and
mixins. Um, eventhe ability to style
a dropdown, like customizingform controls, all of that came
from like veryclear developer evidence
that these features are neededbecause you're not going to see
(01:33:19):
it like as a user, right?
But developers are asking forthese things and it's something
that was very useful with Sass.
Um, so yeah, a lot of thesefeatures kind of need evidence.
Like even ifthere's a hypothesis,
like I think developers wantthis great, but I sometimes
often need toprove that there's a
community need,um, to prioritize it.
And funny enough, CSS nestingwas the reason that I finally
(01:33:43):
said, okay, I don't needSCSS SaaS anymore. I can just
use CSS now. And I'm wayhappier since, but I, I, CSS
nesting was alsothe first and so far only CSS
specification that I readbecause I wrote a blog post
about it. And I was like,okay, this is really tough to
(01:34:04):
read. And like LLM at that, itwas like 2023.
So I would, I wasnot convinced about LLMs at
that point. Uh, so I read it upand down. I was like, this is
kind of confusing.
There's a lot of terminology inthere too. That could
be really confusing.
Um, yeah. And, and also it'slike, there are a lot of edge
(01:34:26):
cases covered beforeit's like going to the
actual like meat of it, if thatmakes sense. Right. Cause you
have to cover all of your cases.
If you're writing aspecification, the browser's
different. Forsure. For sure. Um,
okay. What is a platform draftfeature that is in the works
(01:34:48):
right now that you'resuper excited about?
In the works, uh, there's,there's a lot. Um, I think for
me, one that I havehad a lot of investment
in wanting for a while and havebeen a part of from the start
is really like this journey forcustomizable select. Um, that
(01:35:08):
is something that I have neededon the platform for so long,
just like rebuilding the samething over and over. Um, the
core library landed,like the core customizable
select features, but there'sstill a lot of work to do.
Like select multiple, Imentioned even like combo
boxes, things like that. Thoseare things that I
am very excited to see beingworked on. Um, additionally,
(01:35:33):
like a lot of anchor features,for example, I mentioned like
the anchored container queries,like that is something that is
a missing feature for anchorpositioning. People want to be
able to restyle theanchor when it moves
into different positions. Um,so that's still a work in
progress and it's,I don't think it's spec yet, or
there might be, no, it's notspec yet. Cause
(01:35:54):
our engineer has beenout. It's summer right now as
we're recording. Um, but that'slike something I'm
really excited to seeland. And now as I'm digging
more into the interactionspace, like I
think a lot of thesescroll APIs that Adam Argyle
actually worked on a lot. Um,those are really
useful and not just in likefull page scroll, but like
these micro interactions, likemoving around a
(01:36:16):
website is such a corecapability.
Yeah. Um, he had this cool demoalso a couple of weeks ago
where he heavilyused that feature.
And I was just, that's such afun way to interact with the
web. And it's like, yeah.
Yeah. If you don't follow Adam,you definitely should. Also,
Bramus and our team has beendoing a lot of view transitions
stuff and like a lot ofinteractions space
(01:36:37):
stuff. So maybe in the shownotes, we could link everyone.
Yes. Uh, I'll probably hit youup for like all the links and
stuff, but yes, I'll,I'll do my very best to put
everyone and everything in theshow notes. Um, okay.
Another thing that I'mwondering and probably also
will benefit from it myself. Ifwhat is one thing
that you would likepeople to better understand
(01:36:59):
about the web platform?
Oh, interesting.
Um, the cascade.
Oh, I feel like that's an areathat a lot of people get very
caught up like specificity inthe cascade and somebody who's
like core, like low level, howdoes CSS work
stuff? I think a lotof people turn to libraries
(01:37:21):
like tailwind because they wantto ignore the
cascade. Um, so yeah,I'm sorry. No,
you're good. So yes. Yeah.
The cascade.
Yeah. I had a conversationabout that with, uh, Daniel
Rowe on thispodcast where I was like,
well, this is a bug. And he'slike, no, this is CSS
(01:37:42):
cascading. And I'mlike, yeah, okay, fine.
It's embrace the cascade.
That's the thing. Like ifyou're cognizant of the
behavior, it allows forreally powerful implementation,
the way you structure CSS. Ifyou're not
cognizant, then you'rejust getting caught up by it.
And like, yeah, yeah, I don'tneed to explain that to you.
(01:38:06):
So, um, the one thing that Istruggle with because CSS is to
a level intuitivethat you can like write
CSS and get things going prettyquickly. So I never, and again,
should probably spend the time,invest the time really learn
(01:38:26):
CSS. What would you say is agood resource for someone who
has been writing CSS probablyfor 10 years, but never spent
the time to actually learn it?
What would be a good resource?
There's a lot of goodresources out there. Um,
we have a course on web.devcalled learn CSS, and it covers
(01:38:50):
a lot of the basics. Um, ifthat's too basic,
there's also a lot of newarticles about like new stuff
on like, um, MDN is a greatresource. MDN is
awesome for documentation. Alsosome of the newer features like
anchorpositioning have like more
article style, um, posts onthere. Um, and there is an
awesome writer thatdoes a lot of CSS stuff.
(01:39:13):
Um, developer.chrome.com andweb.dev also have like what's
new, um, kind of landing.
Web.dev focuses on likebaseline features. Yeah. Sorry.
My dog is, uh, having a time.
What dog is it? Just out ofcuriosity. He's a golden doodle.
Okay. Yeah. It sounded like abigger dog. Oh, he's like, not
(01:39:33):
that small. He's amedium sized dog.
Medium size. Yeah. Yeah. Um, I,I do have to say web.dev is a
fantastic resource. I,that's probably the best way
for me as like an advocate inthe web space to
keep up with platformfeatures. Um, yeah. Also we do
(01:39:56):
an end of year CSS wrappedwhere we, uh, do like an
overview of allthe things that landed. Um,
that tends to focus on newerfeatures, but we
kind of do our mid-yearlike Google IO stuff and then
end of year CSS wrapped. And soyou can kind of
get like a, every sixmonth's, um, overview of things
to look out for. And people askme all the time,
(01:40:18):
like, oh, do I needto like know all these
features? And I guess my adviceis you don't have to
know how to use all ofthem in detail, but know that
they exist so that you can usethem when it
becomes useful to you.
Yeah. Knowing they exist iscritical because if you don't
know they exist, you can'tactually benefit
from the future. Right. In away, that's what I like about
going toconferences. I don't need to
(01:40:39):
understand every talk orsomething. I probably wouldn't
go to a conference ifI already understand
every talk, but like having itheard that you can like map it
out once you're in thesituation where
it can be applied and thenwatch the talk again, if it's
online, I think it's a, hasworked out for me
the best and in a similar way.
That's one thing I'm curious,how close are you working with
(01:41:02):
like the Chrome team on aday-to-day basis? Very. Okay.
Because I can, yeah. Yeah.
I work very closely with theChromium engineers, the people
who build platformfeatures. Yeah. Okay.
Yeah. That makes sense. It'skind of cool how it works
(01:41:24):
because they areall C++ developers.
Yes. Like they're building theengine. They're not really web
developers who arebuilding websites and
like running into theseproblems themselves. So we get
to be their web developercounterparts that
interface with the developercommunity, are the V0 testers,
are the ones who arelike able to provide
a lot of real world feedbackand help prioritize some of
(01:41:46):
these features and likeidentify the gaps and
test if they actually solveproblems. So it's very, we work
very closely in this lot oflike symbiosis.
Yeah. This is also perfectbecause if things work out
correctly, this episode goesout after one that I
recorded with the creator ofLadybird, the open source
(01:42:07):
browser engine. So, and hementioned similar
things. Like he's like, yeah,I'm not a JavaScript developer.
I have no idea. Right.
Okay. But so I was askingbecause I could also see you
like being verydistinctly more focused on
like the platform features andyeah. So I was just curious how
(01:42:28):
that, that isorganized. But that's a
cool approach. But that meansyou're more working with the
Chromium engineforks, not with the Chrome
forks particular that make likedev tools and those kinds of
things. Is that?
I do work with the dev toolsteam too. Okay. We sometimes
interface with other teams,like where it comes to like, if
(01:42:50):
we want to add a feature thatmight adjust like Chrome browser
stuff, but that's rare. That'skind of coming up now that
we're working onthis feature called
interest for, which lets you dolike hover cards and show
interest in linksor buttons and like
have things pop up, which isalso something that I'm really,
really excited tosee in the browser.
(01:43:11):
But that has a component wherefor mobile, it might add a
context menuitem. So that's up for
discussion. We have had to talkto like Chrome browser folks
because that wouldaffect the browser
Chrome for, for lack of abetter word. But with the dev
tools team, we work quiteclosely to make
(01:43:32):
sure that dev tools supportslike these CSS features. So at
a minimum level, are there nobugs in dev tools for
the new features we add? Andthen sometimes we get the
opportunity to add some moreadvanced features
for dev tools, like fordifferent types of positioning.
Like you might have noticedthere's like grid
and flex tooling.
Yeah. A bunch of thesecapabilities have a little bit
(01:43:54):
of an advanced tooling. Soright now I'm working on
anchor positioning tools fordev tools, where you could move
things in differentanchor positions and
test those. And also a tool forlike popovers to like force
them open so thatwhen you have something
like this interest triggeredpopover, you can actually debug
it because it doesn'tgo away every time you
(01:44:15):
hover. Oh, that's cool. What doyou mean with this interest
link? This is thefirst time I hear about
this. So I was like trying toget a mental model in my head,
but couldn't quite get it there.
Yeah, sorry. There's so muchthat is shipping. Like I
mentioned, CSS isthe most interesting
place in web development rightnow. That's, that's another
(01:44:38):
feature I should havementioned earlier, but
interest invokers essentiallylet you build hover triggered
or tab triggeredcontent. So like on
GitHub or on blue sky orTwitter or any site really that
has any kind of like preview,like Wikipedia,
(01:44:58):
you often will get a popoverthat's anchored to either a
link or a buttonwith more information.
Yeah. That capability is reallyhard to do right now and really
hard to build accessibly.
Yeah. So like we talked todifferent teams in big tech,
for example, andthey said they spent six
months building that one hovertriggered feature and had three
different engineersworking on just that
(01:45:20):
for six months. Like it's justreally hard to build it
accessibly. And then like evenafter all that work,
they don't know if they got theaccessibility right. Everything
that opens and closesdynamically is just hard for
accessibility. Yes. Butespecially things that are
triggered soephemerally. Yeah. Oh yeah.
You might have this like hoverand then what do you do in
(01:45:41):
different modalities?
And then how does thatspeak into the accessibility
tree? Like what differentstates should be provided?
That's also why people usethese libraries understandably
to build a lot of componentsbecause all of the
accessibility stuff isbuilt in already. It's way too
hard to do that. That's likeone of these like
(01:46:03):
blue sky goals thatwe have for the web platform is
that you don't have to thinkabout that. It's
already built in.
Like think about it, but youdon't have to go and add all of
your ARIA roles andall of your labels and
like all that stuff should bebuilt into the platform. Sadly,
a lot of people still don'tthink about it at
all, but that's a differentconversation. That's the
problem. Like,and as much advocacy
(01:46:26):
that we want to do about, youknow, care about accessibility,
it's still waytoo hard to do it.
Yes. Yes. I agree with that.
One thing I'm wondering andgoing a little bit
full circle back to theAI conversation we had in the
beginning, do you, because wekind of see this
shift happen from like,okay, instead of browsing for
(01:46:46):
information, I just go to achat application
that, where I put in thesame query that I would usually
put into like a search engineand I get
immediate result instead ofme searching for it manually.
Do you think user interactionslike that are going
to be changed by therise of LLMs? And that's a very
(01:47:08):
broad question. Like end usersand how they
interact? Yes. The web.
With the web, for sure. I mean,we're already seeing it in
search data, right? Like if youhave the AI overview.
Yeah. I think on websites, Idon't know because I currently
(01:47:29):
hate interactingwith chat for a question
that I have like on a commercesite and it sends me to some AI
and I have to talkto this AI and then
I have to figure out how to optout of the AI and talk to a
human. But nowthere's fewer humans because
they laid them all off becausethey wanted to talk to the AI.
I hate this trend.
(01:47:49):
And so I really hopethat we start to normalize a
little bit and kind of go backto what's actually good.
Yeah. Use AI where it makessense. So for example,
understanding a codebase that you're new to.
You've got a closed set ofinformation there that you can
query. That's likeyour own custom search.
I think that's a great use casefor AI. Yeah. Even with dev
(01:48:10):
tools likedebugging your site. Like,
but I, I hate this, this riseof just everything is an AI
chat. Everything is anAI. Like that is not a
good feature. And I think thatwe're going to start to see a
pendulum swingaway from that soon.
I, I don't think chat isnecessarily a very natural
(01:48:32):
interaction modelfor us as humans,
even though like conversationalit is, but so I'm, I'm very
curious because Ican see it swing either
way where like, I can see a lotof website traffic go away
because there's not,not just a need for it,
for me to go directly there,but an LLM can go there for me
(01:48:53):
more or less alittle simplified.
But on the other hand, we alsooften want to have that user
experience. We wantto, so it's kind of,
I kind of feel it's like atrade off between like
experience and efficiency. SoI'm just very curious
to see where this goes, but Itotally get what you're saying.
Like if, if there's like a chat,I'm curious too.
(01:49:15):
Yeah. If there's a chat, I'mlike immediately like, send me
to a representative, send me toa representative, send me to a
representative. Right. Yeah.
I think it depends on what youneed to do. So if you're trying
to figure out like,what is the tree law in the
county I live in when itpertains to X, Y, and Z, I
(01:49:36):
don't want to bedigging through county websites
and finding the right page andreading some PDF. Like I don't,
I want the LLM to give me theright answer and hopefully cite
its resources, like cite thesources that I can verify. But
if it's something like shoppingfor shoes, I'm
not going to use anAI tool. I want to have a nice
e-commerce shopping experiencewhere I'm browsing.
(01:49:57):
Yeah.
And you know, I don't thinkthat the web and
websites are going away.
Yes.
I'm not going to be using an AIto look at photos of
my friends on Instagram.
Yeah.
Yeah.
I'm going to be using the webfor what it's good for. And
sometimes you need a UI.
Yeah. Okay. Yeah. I think thisis just very exciting times. I
(01:50:19):
think. I don't think I've beenthis excited about like our
industry and the what's goingaround for like at least the
last six, seven years.
I certainly think it'sinteresting. I think it's
exciting and scary.
Yes.
I don't really know how I feelabout it overall, but it's
definitelychanging how we build.
(01:50:40):
And people who are trying tokind of ignore it, I don't
think you're going to be ableto ignore it for much longer.
Yes. Yes. I agree with that too.
Thank you.
This was a great closingremark. So I think it's going
to be hard to have like abetter end statement. Thank you
(01:51:04):
so much for joining me forthis. I want to particular
thank you for this becauseyou're one of the few that
agree to this without everknowing me. So you just
randomly showed up to astranger on the internet. So I
very much appreciate that.
I thought it was fun. I know ittook like a little time to
(01:51:25):
actually get the schedule.
It was. Yeah. No,thank you so much.
I'm always happy to like chat.
I feel like there's so muchgoing on in the web space right
now. And I like really careabout it. I care about the
future of the web. So alwayshappy to chat, hear
your thoughts too.
I think you're one of thoseperfect guests for this format
(01:51:45):
of this podcast because you'reso excited about those things.
So I can immediately tell likeyour level of enthusiasm.
So it's just like perfect forlike, okay, let's put more into
this. Let's talk more aboutthis. It was great.
Thank you so much.
Yeah, of course.
Thank you again.
And to y'all outthere, see you soon. Bye.
Bye.
Popular Podcasts
On Purpose with Jay Shetty
I’m Jay Shetty host of On Purpose the worlds #1 Mental Health podcast and I’m so grateful you found us. I started this podcast 5 years ago to invite you into conversations and workshops that are designed to help make you happier, healthier and more healed. I believe that when you (yes you) feel seen, heard and understood you’re able to deal with relationship struggles, work challenges and life’s ups and downs with more ease and grace. I interview experts, celebrities, thought leaders and athletes so that we can grow our mindset, build better habits and uncover a side of them we’ve never seen before. New episodes every Monday and Friday. Your support means the world to me and I don’t take it for granted — click the follow button and leave a review to help us spread the love with On Purpose. I can’t wait for you to listen to your first or 500th episode!
Stuff You Should Know
If you've ever wanted to know about champagne, satanism, the Stonewall Uprising, chaos theory, LSD, El Nino, true crime and Rosa Parks, then look no further. Josh and Chuck have you covered.
The Joe Rogan Experience
The official podcast of comedian Joe Rogan.