1
00:00:01,193 --> 00:00:01,493
Carl: All right.

2
00:00:01,503 --> 00:00:01,903
Hello.

3
00:00:01,913 --> 00:00:05,473
Thank you for joining us for the
June edition of This Month in React.

4
00:00:05,503 --> 00:00:09,233
We're coming to you live from
Reactiflux, the best place for

5
00:00:09,233 --> 00:00:10,753
professional developers using React.

6
00:00:11,173 --> 00:00:12,253
I am Carl.

7
00:00:12,323 --> 00:00:15,553
I'm a staff product developer and
freelance community leader here at,

8
00:00:15,553 --> 00:00:20,083
Reactiflux, where I do things like
build Euno, a moderation bot that

9
00:00:20,083 --> 00:00:21,533
helps us keep the community operating.

10
00:00:22,145 --> 00:00:22,925
Mark: I'm Mark Erikson.

11
00:00:22,935 --> 00:00:26,375
My day job is at Replay.io where
we use time travel debugging to

12
00:00:26,375 --> 00:00:30,755
build things like automated QA
tools and awesome React analysis.

13
00:00:30,805 --> 00:00:33,985
And outside of that, I run
around at conferences, give

14
00:00:33,985 --> 00:00:35,735
talks, and work on Redux.

15
00:00:36,089 --> 00:00:36,879
Carl: Heck yeah.

16
00:00:36,879 --> 00:00:41,629
The big news that we wanna discuss
this month, is around some changes

17
00:00:41,629 --> 00:00:43,209
that shipped for the React compiler.

18
00:00:43,299 --> 00:00:44,129
it's in Rust now.

19
00:00:44,533 --> 00:00:44,903
There you go.

20
00:00:44,903 --> 00:00:45,263
It's the news.

21
00:00:45,263 --> 00:00:45,753
You don't have to listen.

22
00:00:45,753 --> 00:00:46,073
Yeah.

23
00:00:46,359 --> 00:00:49,216
we're gonna talk about Meta and we're
gonna talk about its engineering

24
00:00:49,216 --> 00:00:52,856
culture, b- framed around a blog
post from Gergely Orosz, who is

25
00:00:52,856 --> 00:00:53,866
wonderful and a great writer.

26
00:00:54,196 --> 00:00:54,769
yeah.

27
00:00:54,769 --> 00:00:58,146
Talk a little bit more about AI,
'cause of course we are, and some

28
00:00:58,146 --> 00:00:59,896
broad best practices and stuff.

29
00:01:00,266 --> 00:01:02,026
Carl (editing): And I'm trying
something we haven't done before today.

30
00:01:02,056 --> 00:01:03,876
I'm gonna self-sponsor this
'cause we don't have anyone

31
00:01:03,876 --> 00:01:04,966
else paying our bills right now.

32
00:01:05,416 --> 00:01:08,106
Uh, we are sponsored by Euno,
a moderator support tool for

33
00:01:08,106 --> 00:01:11,346
Discord, offering one-click setup
for spam defense, moderation audit

34
00:01:11,346 --> 00:01:12,946
logs, and decision-making tools.

35
00:01:13,216 --> 00:01:14,506
That's euno.

36
00:01:14,506 --> 00:01:17,376
reactiflux.com, uh, Euno is
named after the goddess of good

37
00:01:17,376 --> 00:01:18,636
order and lawful governance.

38
00:01:18,706 --> 00:01:22,346
Uh, it helps moderators make decisions
about bans together while automatically

39
00:01:22,346 --> 00:01:23,986
filtering out compromised account spam.

40
00:01:24,226 --> 00:01:27,336
A single setup/command gets you
anonymous user reports, shared

41
00:01:27,336 --> 00:01:30,896
moderation history and resolution
voting, a private ticketing channel,

42
00:01:30,896 --> 00:01:32,996
and anti-spam based on message velocity.

43
00:01:33,436 --> 00:01:36,526
With a 90-day trial, you can get a
feel for it before deciding if $100

44
00:01:36,566 --> 00:01:39,596
per year is worth the time you'll save
banning spammers and deleting garbage.

45
00:01:39,986 --> 00:01:41,966
If you have a Discord server,
give it a shot and let me know.

46
00:01:42,666 --> 00:01:48,479
That's euno.reactiflux.com,
E-U-N-O.react iflux.com.

47
00:01:49,109 --> 00:01:49,329
Mark: Yep.

48
00:01:49,363 --> 00:01:50,723
congrats to you, Carl.

49
00:01:50,723 --> 00:01:54,540
Thank you for all the work you've put in
on this, and I can, vouch that this has

50
00:01:54,540 --> 00:01:56,360
been very thoroughly tested on our end.

51
00:01:56,864 --> 00:01:58,704
Carl (editing): We're also
sponsored by me, Carl.

52
00:01:59,054 --> 00:02:03,094
Uh, these episodes cost me about 300
bucks out of pocket each episode,

53
00:02:03,154 --> 00:02:04,834
uh, for editing and supporting tools.

54
00:02:05,354 --> 00:02:07,674
If you'd like to learn more about
anything Mark and I discuss,

55
00:02:07,754 --> 00:02:10,674
let's talk about consulting or a
contract software engineering gig.

56
00:02:11,434 --> 00:02:14,324
You probably know where to find me, but
Discord or email is the most reliable.

57
00:02:14,414 --> 00:02:20,314
I'm at vcarl, that's Victor Charlie
Alpha Romeo Lima, @reactiflux.com.

58
00:02:20,912 --> 00:02:21,222
Let me know

59
00:02:22,008 --> 00:02:23,988
Carl: But yeah, first the new releases.

60
00:02:24,098 --> 00:02:27,108
First up, React Router v8 shipped.

61
00:02:27,378 --> 00:02:28,328
We got that now.

62
00:02:28,960 --> 00:02:29,170
yeah.

63
00:02:29,460 --> 00:02:33,161
This… they talk a lot about the
early days of React Router, and it…

64
00:02:33,431 --> 00:02:36,771
they're, like, proactively trying to
manage the pain that people experience

65
00:02:36,791 --> 00:02:40,031
because, I… React Router got a
reputation for shipping a lot of

66
00:02:40,031 --> 00:02:42,158
breaking changes with  every new release.

67
00:02:42,578 --> 00:02:45,868
I guess specifically they got a reputation
of flip-flopping back and forth between

68
00:02:45,868 --> 00:02:49,824
two different paradigms, like every
other release, and it just frustrated a

69
00:02:49,824 --> 00:02:53,954
lot of people with, "Why do we have to
refactor again?" So it's funny how much

70
00:02:53,994 --> 00:02:57,774
of this blog post is dedicated to saying,
"We're not doing that anymore, we swear.

71
00:02:57,934 --> 00:02:58,714
Please don't hate us."

72
00:02:59,744 --> 00:03:04,164
But yeah, generally it looks
like this is essentially a no-op

73
00:03:04,214 --> 00:03:07,194
versus the latest version of v7.

74
00:03:07,404 --> 00:03:09,934
if you are already using the
latest version of seven with

75
00:03:09,934 --> 00:03:12,474
no,  deprecated features, it…

76
00:03:12,504 --> 00:03:13,884
This should be a drop-in replacement.

77
00:03:14,331 --> 00:03:17,801
yeah, I think this, As far as I know,
the mo- most of what th- this is bringing

78
00:03:17,801 --> 00:03:20,531
out is, emphasis on the framework mode.

79
00:03:21,924 --> 00:03:24,324
Mark: I know that they've done a
lot of work on trying to use feature

80
00:03:24,324 --> 00:03:28,924
flags to make new features available,
essentially following the, majors

81
00:03:28,924 --> 00:03:32,454
don't introduce new stuff, they
just remove old stuff kind of a

82
00:03:32,454 --> 00:03:32,864
Carl: pattern.

83
00:03:34,682 --> 00:03:37,712
And see, so the feature flags are
the way that they implemented the

84
00:03:37,722 --> 00:03:40,542
better, major version releases.

85
00:03:40,552 --> 00:03:45,353
So th- now by the time, by the end of
the previous major version release, they

86
00:03:45,393 --> 00:03:48,853
will have introduced new feature flags
for everything that they are about to

87
00:03:48,853 --> 00:03:50,503
release in the next breaking change.

88
00:03:51,613 --> 00:03:52,693
which is, it's really smart.

89
00:03:52,693 --> 00:03:55,143
I actually really admire
that method of changing.

90
00:03:55,613 --> 00:03:58,678
managing feature flags, I have
experienced, adds a lot of

91
00:03:58,678 --> 00:04:00,888
complexity to day-to-day development.

92
00:04:01,145 --> 00:04:05,287
and I have a ton of respect for
them for landing on this process for

93
00:04:05,287 --> 00:04:09,237
releasing new changes, new features,
new abilities to their widely used

94
00:04:09,237 --> 00:04:13,197
library, and here they are still, eight
years later after they started using

95
00:04:13,197 --> 00:04:15,207
this, still putting it to practice.

96
00:04:15,697 --> 00:04:19,767
Mark: Couple interesting notes
from the support matrix here.

97
00:04:19,837 --> 00:04:21,927
Node 22, okay, that's fine.

98
00:04:23,107 --> 00:04:26,497
they now require at least React 19.2

99
00:04:27,597 --> 00:04:28,047
Carl: as

100
00:04:28,067 --> 00:04:32,527
Mark: a minimum version, so that…
I, don't know if version 7 expected

101
00:04:32,527 --> 00:04:34,967
19.0 or 18, I would have to check.

102
00:04:35,017 --> 00:04:39,917
But just noting that React Router now
requires the latest and greatest React 19.

103
00:04:40,447 --> 00:04:45,087
And also the package is shipping
as ESM only, we are very clearly

104
00:04:45,087 --> 00:04:50,417
now on the trend of lots of tools
and libraries going ESM only.

105
00:04:51,347 --> 00:04:54,707
there was the early wave of tools
that went ESM only and everyone else

106
00:04:54,707 --> 00:04:56,267
complained because it didn't work right.

107
00:04:57,457 --> 00:05:01,017
And now with, some of the
improvements to Node itself,

108
00:05:01,047 --> 00:05:05,587
we're seeing a lot of packages
say now is the time to go ESM only

109
00:05:06,078 --> 00:05:09,998
Carl: Yeah, we've got another
release that went ESM only next.

110
00:05:11,168 --> 00:05:13,788
I wanna flag, I just found… I was
clicking through the blog post and they

111
00:05:13,788 --> 00:05:18,068
have a link to their governance document,
which explains their new feature process.

112
00:05:18,331 --> 00:05:21,545
and actually this whole document is
very well thought out and I would

113
00:05:21,555 --> 00:05:25,305
highly recommend that you familiarize
yourself with this governance document,

114
00:05:25,315 --> 00:05:28,375
'cause, it's just a bunch of really
high quality engineering practices.

115
00:05:28,455 --> 00:05:29,135
Definitely check it out.

116
00:05:29,862 --> 00:05:34,682
Mark: So on the, ESM note, Babel
8 just shipped, and the, big

117
00:05:34,692 --> 00:05:40,292
highlights there, the Babel packages
themselves are also now ESM only.

118
00:05:41,242 --> 00:05:45,712
TypeScript types are built in, and
the default compilation settings

119
00:05:45,712 --> 00:05:51,512
for building your projects no
longer target ES5 or CommonJS.

120
00:05:51,522 --> 00:05:55,702
So essentially they're saying we've,
rather than necessarily being about

121
00:05:55,922 --> 00:06:01,152
backwards compatibility by default and
always trying to cross-compile your code

122
00:06:01,162 --> 00:06:08,502
to, support, IE 11 or whatever, now we're
targeting the modern JavaScript ecosystem.

123
00:06:08,932 --> 00:06:13,072
Which is also pretty much what,
TypeScript 7 is doing as well.

124
00:06:13,671 --> 00:06:15,591
Carl: I am extremely
here for that transition.

125
00:06:15,621 --> 00:06:17,541
I wish that it had
happened several years ago.

126
00:06:18,691 --> 00:06:23,101
Babel as a compatibility layer I think is
really good and really great, but we've

127
00:06:23,121 --> 00:06:28,568
been on evergreen browsers for most of my
career at this point, and I, yeah, just,

128
00:06:29,008 --> 00:06:34,018
the long tail of what it means to support
ESM 5 and Require is just, it's really…

129
00:06:34,228 --> 00:06:36,248
That tail's really long at this point.

130
00:06:36,248 --> 00:06:37,038
It's very far away.

131
00:06:37,508 --> 00:06:37,868
I don't know.

132
00:06:38,088 --> 00:06:41,248
I, think the, trade-offs
are not quite there.

133
00:06:42,968 --> 00:06:43,308
Yeah.

134
00:06:44,698 --> 00:06:45,628
Yeah, Babel 7.

135
00:06:45,668 --> 00:06:46,048
I don't know.

136
00:06:46,278 --> 00:06:49,438
I've, Are people still manually
installing and managing Ba-

137
00:06:49,508 --> 00:06:50,778
Babel versions themselves?

138
00:06:50,808 --> 00:06:54,468
This feels like something I haven't
wrangled with personally in a long time.

139
00:06:54,478 --> 00:06:56,508
It's all downstream of the
rest of the tools I use

140
00:06:57,108 --> 00:07:00,598
Mark: Yeah, I'm disconnected enough
from day-to-day app development that I

141
00:07:00,598 --> 00:07:01,838
don't have an answer to that question.

142
00:07:02,070 --> 00:07:02,300
Carl: fair.

143
00:07:02,310 --> 00:07:03,960
Ha Okay.

144
00:07:04,000 --> 00:07:04,880
Anyway, moving on.

145
00:07:05,157 --> 00:07:09,167
We've got Astro v7,
major release of Astro.

146
00:07:10,607 --> 00:07:15,177
Astro's a project that I have always meant
to explore more deeply than I really have.

147
00:07:15,197 --> 00:07:17,887
I have used it for a, trivial
project here or there.

148
00:07:19,007 --> 00:07:24,287
If you're building a static portfolio
site, brochure, marketing, whatever

149
00:07:24,297 --> 00:07:26,097
you wanna call it, it's really good.

150
00:07:26,287 --> 00:07:31,897
it hits a good balance between engineering
ability, it gives you escape hatches

151
00:07:31,907 --> 00:07:35,857
to manually control stuff, while
still being largely content oriented.

152
00:07:35,927 --> 00:07:39,657
So it's very good if what you're managing
is what's on the page rather than, like,

153
00:07:39,657 --> 00:07:41,497
how it behaves or what data's available.

154
00:07:42,047 --> 00:07:44,787
so it, not as great for a full app.

155
00:07:45,180 --> 00:07:46,690
there are certain types of
apps that work great in that

156
00:07:46,690 --> 00:07:49,163
environment, but an application less

157
00:07:49,683 --> 00:07:53,613
Mark: Like my mental model of Astro
is it essentially replaces Gatsby

158
00:07:53,885 --> 00:07:54,235
Carl: Yes

159
00:07:54,493 --> 00:07:57,413
Mark: in terms of, we, we pull in
data sources, we build sites that

160
00:07:57,413 --> 00:08:02,153
are static by default, but can
have lots of dynamic content with

161
00:08:02,223 --> 00:08:03,923
your rendering framework of choice

162
00:08:04,453 --> 00:08:06,943
Carl: Would agree with that,
with all the same caveats of

163
00:08:06,993 --> 00:08:09,623
a lot of apps need something a
lot more complicated than that.

164
00:08:09,673 --> 00:08:12,760
But if you're building co- a content
site, it's a really great tool for that.

165
00:08:13,880 --> 00:08:14,500
Yeah.

166
00:08:14,990 --> 00:08:19,440
Looks like mostly they're touting, s-
build improvements, upgraded internal

167
00:08:19,440 --> 00:08:21,990
dependencies, V8, new roll down bundler.

168
00:08:23,048 --> 00:08:24,008
Mark: Faster markdown parsing.

169
00:08:24,290 --> 00:08:24,700
Carl: Yeah.

170
00:08:24,980 --> 00:08:28,840
Advanced routing to give you
a single entry point with full

171
00:08:28,840 --> 00:08:30,670
control over the request pipeline.

172
00:08:31,287 --> 00:08:33,967
They can detect coding agents
automatically that looks like

173
00:08:33,967 --> 00:08:35,257
a local development feature.

174
00:08:35,257 --> 00:08:37,887
It's, you can run the dev server in
the background and output structured

175
00:08:38,507 --> 00:08:40,907
JSON for machine-readable feedback.

176
00:08:40,917 --> 00:08:41,707
That's really smart, actually.

177
00:08:41,707 --> 00:08:42,267
I love that.

178
00:08:42,517 --> 00:08:46,617
there's a ton of cases where,
just like in testing and such,

179
00:08:46,627 --> 00:08:51,047
raw human readable HTML and CSS,
it… that's just a lot of content.

180
00:08:51,087 --> 00:08:51,867
It's a lot of bytes.

181
00:08:52,127 --> 00:08:52,757
It's a lot of tokens.

182
00:08:53,657 --> 00:08:58,317
so giving machine-readable outputs at
the framework level is really helpful.

183
00:08:58,327 --> 00:08:58,937
I like that a lot.

184
00:08:58,937 --> 00:09:01,047
That seems like a really smart
feature, and I think we're gonna

185
00:09:01,047 --> 00:09:02,497
start seeing that for more.

186
00:09:03,877 --> 00:09:06,727
Mark: And I mentioned this a minute
ago and we've mentioned it in previous

187
00:09:06,727 --> 00:09:10,947
episodes, but TypeScript version
7 is now at release candidate.

188
00:09:11,647 --> 00:09:16,007
think the biggest change here from
a user point of view is that p- the

189
00:09:16,017 --> 00:09:21,717
previous releases had shipped as a
separate native preview package and

190
00:09:21,717 --> 00:09:29,220
now it's the actual TypeScript package
itself, the RC tag has all new binary

191
00:09:29,220 --> 00:09:30,900
and faster compilation stuff in there.

192
00:09:31,930 --> 00:09:37,510
One other thing to note is that the,
7.0 release, number one, it builds

193
00:09:37,520 --> 00:09:43,890
off 6.0 where they change the default
settings to favor modern compatibility

194
00:09:43,960 --> 00:09:45,590
instead of backwards compatibility.

195
00:09:46,450 --> 00:09:53,100
but then also 7.0 will not
ship with a programmatic API.

196
00:09:53,480 --> 00:09:58,110
So tools that depend on the c- on
the TypeScript compiler package to

197
00:09:59,550 --> 00:10:04,630
programmatically drive compilation,
parse files, do that sort of thing,

198
00:10:05,040 --> 00:10:07,750
will not work out of the box with 7.

199
00:10:08,250 --> 00:10:14,010
The idea was get the full working compiler
in people's hands now and they're still

200
00:10:14,010 --> 00:10:18,030
trying to nail down the details of what
the programmatic API will be like, and

201
00:10:18,030 --> 00:10:19,760
they're hoping to have that out in a 7.1

202
00:10:21,072 --> 00:10:21,202
Carl: Cool.

203
00:10:22,122 --> 00:10:22,542
Nice.

204
00:10:22,682 --> 00:10:26,022
Yeah, and we discussed that at more
length last month, so I don't know

205
00:10:26,022 --> 00:10:27,512
that I wanna rehash all of that again.

206
00:10:28,012 --> 00:10:29,882
Difference between beta and
RC is just not that big.

207
00:10:31,219 --> 00:10:33,949
Mark: Okay, the, the next
one's very interesting.

208
00:10:37,229 --> 00:10:41,779
Colin, the creator of Zod, just
announced something called nub.

209
00:10:42,249 --> 00:10:48,099
Those of you with keen eyes will notice
that this is bun backwards, in the

210
00:10:48,099 --> 00:10:51,659
same way that Deno is Node rearranged.

211
00:10:52,189 --> 00:10:54,659
clearly there's only so many
letters we can use in naming

212
00:10:54,659 --> 00:10:56,429
JavaScript runtimes at this point.

213
00:10:57,729 --> 00:11:03,749
The s- the sales pitch for this,
Node was run JavaScript on the

214
00:11:03,749 --> 00:11:05,669
file system outside the browser.

215
00:11:06,139 --> 00:11:10,159
Deno was, "Oops, we made a bunch
of mistakes designing Node.

216
00:11:10,589 --> 00:11:15,009
Let's completely redesign the security
and the process architecture and bake

217
00:11:15,019 --> 00:11:22,979
a bunch more stuff in." Bun was, "Let's
build Node compatibility on a different

218
00:11:22,989 --> 00:11:28,789
JavaScript engine, and also add every
other built-in programming method and

219
00:11:28,799 --> 00:11:32,779
API we can think of while we're at
it so it does everything at once."

220
00:11:33,899 --> 00:11:42,069
Nub, on the other hand, is, "Let's start
with actual Node, let's override a bunch

221
00:11:42,069 --> 00:11:47,699
of its configuration options, and let's
build in a more modern environment, things

222
00:11:47,699 --> 00:11:53,629
like better TypeScript stripping and
better, package JSON handling and a bunch

223
00:11:53,629 --> 00:12:02,679
of other pieces into Node directly so it
feels like Node much better rather than

224
00:12:03,009 --> 00:12:04,609
one of the, one of the other options."

225
00:12:05,659 --> 00:12:06,569
I, like this idea.

226
00:12:07,609 --> 00:12:11,219
we've been using things like
ts-node and TSX and all these

227
00:12:11,219 --> 00:12:12,599
other type-stripping approaches.

228
00:12:13,429 --> 00:12:16,829
Node has a type-stripping option built in.

229
00:12:17,389 --> 00:12:21,319
This apparently goes up to the
level of being able to output the

230
00:12:21,319 --> 00:12:26,769
non-strippable pieces of TS syntax,
so like e- enums and things like that.

231
00:12:27,689 --> 00:12:30,839
But then it bakes in a whole
bunch of other features as well.

232
00:12:31,905 --> 00:12:32,705
I like this idea.

233
00:12:32,835 --> 00:12:35,005
I, it, makes a lot of sense to me

234
00:12:35,289 --> 00:12:35,969
Carl: I'd agree.

235
00:12:36,009 --> 00:12:36,879
It's interesting.

236
00:12:37,359 --> 00:12:40,369
I was always skeptical about
Bun because of what you said, it

237
00:12:40,369 --> 00:12:43,689
starts from a brand-new runtime,
and runtimes are difficult.

238
00:12:43,799 --> 00:12:44,369
It's hard.

239
00:12:44,379 --> 00:12:45,949
It's… Getting it right is tricky.

240
00:12:46,769 --> 00:12:50,309
clearly it's worked well enough
for many people, but I've

241
00:12:50,309 --> 00:12:51,159
struggled with it a little bit.

242
00:12:52,239 --> 00:12:55,082
Sure, There's plenty of room
for opportunity in the tools

243
00:12:55,092 --> 00:12:57,112
surrounding Node.js as well.

244
00:12:58,272 --> 00:13:01,132
But I'm skeptical of this package manager.

245
00:13:01,452 --> 00:13:06,738
It says a pnpm-compatible manager built
in, and it, reads whatever lock file you

246
00:13:06,738 --> 00:13:09,398
already have, writes to the same format.

247
00:13:09,964 --> 00:13:10,354
I don't know.

248
00:13:10,354 --> 00:13:11,334
I'm skeptical of that.

249
00:13:12,364 --> 00:13:15,324
look, we made a magic package
manager that is cross-compatible

250
00:13:15,324 --> 00:13:16,814
with every existing package manager.

251
00:13:17,854 --> 00:13:18,744
sure, I'm sure you did.

252
00:13:19,904 --> 00:13:21,214
Can't wait to find out
what bugs you missed.

253
00:13:23,272 --> 00:13:28,832
Mark: I saw a tweet from Colin where
he said that this was all implemented

254
00:13:28,842 --> 00:13:33,462
with AI, not surprisingly given today's
no but it, but there was a lot of

255
00:13:33,732 --> 00:13:37,132
very careful planning and, defining
the feature set and working out the

256
00:13:37,132 --> 00:13:41,182
requirements and then, using the
agents to actually do the work on it

257
00:13:42,140 --> 00:13:44,730
Carl: And, like we s- we were talking
about last month, if you've got an

258
00:13:44,730 --> 00:13:49,170
existing set of tests to make sure that
your code works against which all of these

259
00:13:49,200 --> 00:13:53,120
open source package managers are going
to, then it's definitely a lot easier

260
00:13:53,120 --> 00:13:55,320
to create a functioning replacement.

261
00:13:56,390 --> 00:13:56,970
yeah, I don't know.

262
00:13:57,050 --> 00:13:57,530
It's interesting.

263
00:13:57,780 --> 00:13:59,330
Curious, we'll, we'll
see how it shakes out.

264
00:13:59,330 --> 00:14:00,060
We'll see if it works.

265
00:14:00,060 --> 00:14:00,740
see how it does for people

266
00:14:01,488 --> 00:14:01,688
Mark: Yep.

267
00:14:03,178 --> 00:14:04,338
Another release announcement.

268
00:14:04,688 --> 00:14:09,958
Legend List 3.0 came out, and this
is originally, I think the original

269
00:14:09,968 --> 00:14:12,108
version of this was React Native only.

270
00:14:12,738 --> 00:14:17,168
Jay Misiorek's also the creator of
the Legend State Signals library.

271
00:14:17,878 --> 00:14:23,478
but apparently he's figured out how to
port the underlying list virtualization

272
00:14:23,488 --> 00:14:29,028
logic over to React DOM as well, and
says that it's one of the fastest,

273
00:14:29,028 --> 00:14:33,368
if n- if not the actual fastest
virtualized list implementation out there

274
00:14:35,375 --> 00:14:38,195
.
And then, other follow-up note, I think
it was last month we had mentioned

275
00:14:38,195 --> 00:14:43,125
something called TSRX, where Dominic
Ganaway and the Ripple project had said,

276
00:14:44,195 --> 00:14:51,725
"We're, annoyed at the JSX specification
being stuck for, the last 10 to 12 years.

277
00:14:52,315 --> 00:14:56,895
We have come up with what we think
is a better syntax, that, adds

278
00:14:56,895 --> 00:15:00,745
more flexibility." And, after
they announced it, they got a

279
00:15:00,745 --> 00:15:05,315
bunch of feedback on, people not
liking some of what they designed.

280
00:15:05,785 --> 00:15:08,995
And so th- they did a couple different
blog posts about how they've stepped

281
00:15:09,005 --> 00:15:11,675
back and rethought what the syntax is.

282
00:15:11,745 --> 00:15:18,945
Things like, the original TSRX wanted you
to put quotes around every bit of text

283
00:15:19,215 --> 00:15:25,095
that you had in there, whereas JSX just
is angle bracket, words, angle bracket.

284
00:15:25,345 --> 00:15:28,905
And so they've, gone back to
that as a syntax for text.

285
00:15:29,405 --> 00:15:32,885
So to be honest, I don't have a
good mental picture of what the

286
00:15:32,885 --> 00:15:37,395
actual differences are between this
and JSX at this point, 'cause I,

287
00:15:37,395 --> 00:15:38,665
haven't gone through it in detail.

288
00:15:39,485 --> 00:15:45,195
But they, looks like they do have some
control flow syntax embedded as well.

289
00:15:46,195 --> 00:15:49,985
so they're somewhere in between
their original p- proposal

290
00:15:50,205 --> 00:15:52,205
and standard JSX at this point

291
00:15:52,644 --> 00:15:52,974
Carl: Neat.

292
00:15:53,074 --> 00:15:53,984
It's a big swing.

293
00:15:54,304 --> 00:15:58,634
I said last month that I think it's
interesting that now in the AI era

294
00:15:58,634 --> 00:16:03,034
you can just update documentation and
the tool knows how to use it, which

295
00:16:03,034 --> 00:16:04,944
was not the case for previously.

296
00:16:04,974 --> 00:16:07,874
So that might make it easier for tools
like this to succeed, because you

297
00:16:07,874 --> 00:16:13,614
can just drop in a different markdown
document and the tools will know how

298
00:16:13,614 --> 00:16:16,294
to write the new code, so to an extent.

299
00:16:16,684 --> 00:16:17,474
It's not perfect.

300
00:16:18,244 --> 00:16:22,044
Let's get into the main content
with some React core updates first?

301
00:16:22,444 --> 00:16:27,164
Mark: All right, so the biggest thing
this month is that the React compiler

302
00:16:27,244 --> 00:16:32,264
port into Rust has officially been
merged, and there's been a whole flurry

303
00:16:32,264 --> 00:16:36,604
of activity of different build tools
now trying to actually integrate this.

304
00:16:37,334 --> 00:16:42,714
so the React teams had said, "We have been
trying out the port at Meta. It appears to

305
00:16:42,714 --> 00:16:48,154
emit identical results with the TypeScript
implementation of the compiler." they did

306
00:16:48,154 --> 00:16:53,144
a bunch of work to optimize it and handle
some more cases, and the PR itself got

307
00:16:53,144 --> 00:16:56,034
merged, about a week-ish ago, I think.

308
00:16:56,844 --> 00:17:01,974
So now that it's at least more or
less available, then the question

309
00:17:01,974 --> 00:17:03,404
is, how do you actually use it?

310
00:17:04,324 --> 00:17:09,744
I don't know if you can actually
just install the Rust version

311
00:17:09,744 --> 00:17:10,874
of the compiler right now.

312
00:17:10,874 --> 00:17:11,834
I'd have to double-check that.

313
00:17:12,274 --> 00:17:15,994
But n- since we have a whole bunch
of build tools, and most of today's

314
00:17:16,024 --> 00:17:20,084
build tools are now written in
Rust, a lot of different teams have

315
00:17:20,084 --> 00:17:24,514
been exploring how do we actually
integrate this into the build tools.

316
00:17:24,934 --> 00:17:32,694
So Oxlint, SWC, RSpack, Next, and
Bun have all been trying to figure

317
00:17:32,694 --> 00:17:37,614
out how do we integrate with this,
make it a, an option or built-in

318
00:17:37,654 --> 00:17:38,744
or something along those lines.

319
00:17:40,354 --> 00:17:45,154
One interesting note is that Rolldown
tried to actually add this into their

320
00:17:45,154 --> 00:17:50,954
system, so there would just be a built-in
turn on the React compiler option.

321
00:17:51,834 --> 00:17:56,144
And what they saw was that it increased
the binary size from, 28 megs to 33

322
00:17:56,144 --> 00:18:00,744
megs, and they decided that was too
much extra size to force everybody

323
00:18:00,744 --> 00:18:04,904
to download, actually reverted
it, and they're exploring further

324
00:18:04,904 --> 00:18:06,824
options on how they can integrate it.

325
00:18:08,144 --> 00:18:17,004
On the other hand, Bun taking the Rust
code and tried to both integrate it and

326
00:18:17,004 --> 00:18:23,564
also see can we improve the Rust code
itself to make the compiler run faster.

327
00:18:23,744 --> 00:18:27,194
I think a couple of the other teams
have also been seeing, now that the

328
00:18:27,194 --> 00:18:32,104
Rust code for the compiler exists,
can we also make it faster as well?

329
00:18:32,544 --> 00:18:36,374
So there's clearly still a lot of
development opportunities for different

330
00:18:36,374 --> 00:18:40,354
teams to explore in terms of how is
it integrated into the build step,

331
00:18:40,824 --> 00:18:45,284
how fast does it run, but we now
at least have the merged PR as a

332
00:18:45,294 --> 00:18:46,864
baseline for all that different work

333
00:18:47,420 --> 00:18:48,750
Couple other things I noticed.

334
00:18:49,120 --> 00:18:53,370
one is that the React team has
been working on something called

335
00:18:53,390 --> 00:18:55,520
Fragment Refs for a while.

336
00:18:55,740 --> 00:18:57,920
We, might have mentioned this
once or twice in the past.

337
00:18:58,466 --> 00:19:00,406
Carl: Yeah, I think
not a long time though.

338
00:19:00,416 --> 00:19:01,296
It's b- it's been a minute

339
00:19:01,750 --> 00:19:03,030
Mark: it's been a while.

340
00:19:03,040 --> 00:19:07,200
The PRs were sitting out there
or getting quietly iterated on.

341
00:19:07,587 --> 00:19:11,687
So the idea for a Fragment Ref is that
a React fragment by design does not

342
00:19:11,687 --> 00:19:17,527
have any single DOM node associated
with it, because it's meant to be like

343
00:19:17,527 --> 00:19:20,377
a virtual container for many children.

344
00:19:20,387 --> 00:19:23,337
That's why we wrap them in a
fragment in the first place.

345
00:19:24,527 --> 00:19:28,947
but what happens if you want to
do something like listen to a

346
00:19:28,967 --> 00:19:34,567
DOM event for any of the children
directly underneath the fragment,

347
00:19:34,897 --> 00:19:37,287
or perform some other DOM operation?

348
00:19:38,027 --> 00:19:46,187
So Fragment Refs are a, I think, now in
Canary feature where you can put a ref

349
00:19:46,197 --> 00:19:53,077
prop onto a fragment and you get back
something that looks like a DOM node in

350
00:19:53,077 --> 00:19:57,667
terms of the methods you can call, add
event listener and that sort of thing.

351
00:19:58,377 --> 00:20:03,667
and under the hood, React just does
the work to pass the references on

352
00:20:03,687 --> 00:20:06,317
to all of its children automatically.

353
00:20:06,747 --> 00:20:11,997
So it looks to your code like you're
dealing with an actual DOM node, and

354
00:20:11,997 --> 00:20:16,987
under the hood, React takes care of,
oh, there's 15 children directly under

355
00:20:16,987 --> 00:20:20,957
this fragment, let me just collect
the interactions with all of them.

356
00:20:21,667 --> 00:20:25,367
So, that is apparently now in Canary,
and they've actually updated the

357
00:20:25,377 --> 00:20:29,787
documentation page on fragments to
say that you can use refs on them

358
00:20:30,385 --> 00:20:30,715
Carl: Nice.

359
00:20:30,815 --> 00:20:31,255
Cool.

360
00:20:31,675 --> 00:20:36,836
the value here I think is really
specific, and, it might, be unintuitive.

361
00:20:37,246 --> 00:20:39,936
it… let's say you wanted all of
those DOM methods you just talked

362
00:20:39,946 --> 00:20:44,336
about, you wanted to be able to
measure the size of this block of

363
00:20:44,406 --> 00:20:46,836
nodes or add an event or whatever.

364
00:20:47,186 --> 00:20:49,066
Another way you could do
that is to wrap it in a div.

365
00:20:49,186 --> 00:20:51,346
If you have a div, cool,
great, free DOM node.

366
00:20:51,596 --> 00:20:52,606
You can do all those things.

367
00:20:54,566 --> 00:20:56,437
but that doesn't work in certain layouts.

368
00:20:56,727 --> 00:21:03,489
if you wanted to have a grid where
all of them share a single, drag end

369
00:21:03,609 --> 00:21:08,669
event, you can't just wrap that in a
div because that breaks the grid layout.

370
00:21:09,009 --> 00:21:15,059
So this is a situation for, flex or
grid, where there's an implied mandatory

371
00:21:15,059 --> 00:21:21,159
hierarchy of the DOM nodes itself, and
you are rendering those s- containers,

372
00:21:21,159 --> 00:21:24,109
those children, s- let's say from a map.

373
00:21:24,139 --> 00:21:27,659
You're mapping over data, then this
is super helpful for adding a whole

374
00:21:27,659 --> 00:21:31,169
bunch of different types of behaviors,
which is why it's worth the effort.

375
00:21:31,989 --> 00:21:36,259
Mark: And then one other thing that I
have a vested interest in, the re- there's

376
00:21:36,259 --> 00:21:43,559
been a series of PRs posted to improve
the React Dev Tools by adding MCP tools

377
00:21:43,669 --> 00:21:45,879
so that agents can query and inspect it.

378
00:21:46,499 --> 00:21:52,109
some form of imperative API so that
you can programmatically ask, what

379
00:21:52,109 --> 00:21:57,899
is the component tree, and even turn
performance profiling on and off.

380
00:21:58,859 --> 00:22:02,489
and then some, some additional
wrappers to expose that data.

381
00:22:03,369 --> 00:22:06,119
I've spent a bunch of time doing
React performance analysis work.

382
00:22:06,129 --> 00:22:08,409
I am doing some of that
at my day job right now.

383
00:22:08,949 --> 00:22:12,989
so I'm, I am also keeping a very
close eye on this because it's very

384
00:22:12,989 --> 00:22:14,719
heav- heavily related to my interests.

385
00:22:16,313 --> 00:22:16,843
Carl: Yes, it is.

386
00:22:17,443 --> 00:22:18,623
Yeah, and we've got…

387
00:22:18,873 --> 00:22:23,543
we mentioned briefly the React Foundation
last month, and most of what we said

388
00:22:23,543 --> 00:22:26,123
was that we haven't been able to
see very much of what's happening.

389
00:22:26,293 --> 00:22:27,233
We can see things.

390
00:22:27,763 --> 00:22:29,523
Visible change is happening.

391
00:22:29,703 --> 00:22:33,966
The React repos have moved, there's
also a new website being developed.

392
00:22:34,176 --> 00:22:35,926
I've seen some chatter about that.

393
00:22:36,006 --> 00:22:40,056
Mark: Like the, foundation page
exists, but the, uh the current

394
00:22:40,076 --> 00:22:42,666
form of the page is very vibe coded.

395
00:22:43,176 --> 00:22:49,366
And so, a- they're, like what's there
is accurate, but not well designed.

396
00:22:49,466 --> 00:22:51,106
Carl: Yeah, it is
definitely vibe coded vibes.

397
00:22:51,816 --> 00:22:53,466
but yeah, so that, that,
should change soon.

398
00:22:55,388 --> 00:22:58,408
Mark: The, couple of the interesting
bits for me, if you look at the,

399
00:22:58,408 --> 00:23:02,988
React Foundation website right now,
there's a strong emphasis on helping

400
00:23:02,988 --> 00:23:04,828
support the community financially.

401
00:23:05,198 --> 00:23:08,808
Some of that is they're apparently
intending to sell swag, shirts, and

402
00:23:08,808 --> 00:23:16,078
whatever, they intend money fairly
to maintainers of some of the most

403
00:23:16,128 --> 00:23:18,618
common React ecosystem libraries.

404
00:23:19,588 --> 00:23:22,438
They also talk- they've also talked
both in the past and I think on the

405
00:23:22,438 --> 00:23:26,908
website about helping financially
support different, communities,

406
00:23:26,948 --> 00:23:29,118
meetups, conferences as well.

407
00:23:29,408 --> 00:23:35,538
And then I think they are taking over
running the official React Conf as well

408
00:23:35,908 --> 00:23:39,078
Carl: Yeah, I know that they've
actually been having some

409
00:23:39,108 --> 00:23:41,345
struggles getting meetups.

410
00:23:41,625 --> 00:23:45,602
they wanna support local React-based
meetups, people aren't doing

411
00:23:45,602 --> 00:23:47,182
local React-based meetups anymore.

412
00:23:47,182 --> 00:23:48,592
It's all AI stuff or whatever.

413
00:23:49,192 --> 00:23:53,022
it's… I think the… I, think
my intuition here a little bit is

414
00:23:53,022 --> 00:23:57,732
that some of their mental model for
how the React community exists is

415
00:23:57,732 --> 00:24:03,235
still, maybe not fully reacted to
the shifts over the last two years.

416
00:24:04,282 --> 00:24:09,462
I love the idea of collecting nonprofit
donations and then distributing

417
00:24:09,462 --> 00:24:11,232
them out to library maintainers.

418
00:24:11,262 --> 00:24:13,792
I think that is super, super good.

419
00:24:13,792 --> 00:24:18,712
And doing it with a, proper
foundation with, governance and a

420
00:24:18,712 --> 00:24:20,272
board of directors is super good.

421
00:24:20,272 --> 00:24:23,802
I've ac- I actually thought quite a bit
about trying to do a business adjacent

422
00:24:23,822 --> 00:24:25,572
to this, just, hey, we got a community.

423
00:24:25,572 --> 00:24:28,982
What if we did, a bunch of little
events and had a membership

424
00:24:28,992 --> 00:24:32,485
subscription or whatever, and then
funneled 80% of that money to the

425
00:24:32,485 --> 00:24:34,755
people who make the community exist.

426
00:24:35,545 --> 00:24:38,495
and I, ended up not just
'cause it's it was hard.

427
00:24:38,535 --> 00:24:39,145
It's a lot of work.

428
00:24:39,335 --> 00:24:39,915
It's a ton.

429
00:24:40,555 --> 00:24:41,505
Access also helps.

430
00:24:42,065 --> 00:24:46,235
starting from I am the manager of
the React core team is a very strong

431
00:24:46,245 --> 00:24:47,695
position to create a foundation.

432
00:24:48,105 --> 00:24:51,772
Mark: the flip side of all this is
that as I discussed last month, I

433
00:24:51,772 --> 00:24:55,842
have no idea what's going on with
the development of React itself.

434
00:24:56,152 --> 00:24:58,812
the- there's PRs around the
compiler and the dev tools.

435
00:24:59,332 --> 00:25:04,002
I really haven't seen much activity on
the core library in the last few months.

436
00:25:04,498 --> 00:25:08,348
Joe Savona c- and put up a post
confirming that he is no longer

437
00:25:08,378 --> 00:25:09,878
on the React team at Meta.

438
00:25:09,898 --> 00:25:12,008
He's now working on something AI related.

439
00:25:12,868 --> 00:25:16,558
and then that kind of ties into what
we'll talk about in a minute with

440
00:25:16,588 --> 00:25:19,448
what is going on at Meta anyway.

441
00:25:19,878 --> 00:25:26,958
So here feels like the development
process on React itself is rather

442
00:25:27,048 --> 00:25:28,658
fragmented and confused right now

443
00:25:29,259 --> 00:25:30,249
Carl: Which is unfortunate.

444
00:25:30,959 --> 00:25:35,429
But if you wanna talk to the core team
or, some members of the foundation,

445
00:25:35,819 --> 00:25:39,219
or generally people close to the
development of React, they will have

446
00:25:39,219 --> 00:25:44,279
a booth at Chain React, July 30th,
which it's a React Native conference

447
00:25:44,289 --> 00:25:46,666
specifically, And it is, where is it?

448
00:25:47,061 --> 00:25:48,011
And it is in Portland.

449
00:25:48,814 --> 00:25:51,784
So yeah, if you're, around the
Pacific Northwest or willing to

450
00:25:51,784 --> 00:25:53,834
travel, so yeah, check it out.

451
00:25:54,730 --> 00:25:56,420
Okay, moving on a little bit.

452
00:25:56,680 --> 00:26:00,830
jumping off your tangent you
just teed me up for, thank you.

453
00:26:01,230 --> 00:26:05,170
Why is Meta destroying its
engineering organization?

454
00:26:05,560 --> 00:26:09,430
this is a newsletter post put
out by Gergely Orosz, who's

455
00:26:10,410 --> 00:26:11,550
very influential, I would say.

456
00:26:11,550 --> 00:26:13,730
He puts out a, pragmatic
engineering newsletter.

457
00:26:13,950 --> 00:26:14,530
It's very good.

458
00:26:14,530 --> 00:26:16,040
I read it occasionally.

459
00:26:16,100 --> 00:26:17,300
I read posts from him.

460
00:26:17,474 --> 00:26:18,484
Mark: well written and sourced

461
00:26:18,850 --> 00:26:20,720
Carl: Very well-sourced, very timely.

462
00:26:20,730 --> 00:26:22,050
He does a good job of being timely.

463
00:26:22,583 --> 00:26:25,980
so y- this is a, this, is again,
a well-written, well-researched,

464
00:26:25,990 --> 00:26:31,153
well-presented post, talking about the
engineering values of Meta historically.

465
00:26:32,033 --> 00:26:34,880
it brings in the, original
Facebook little red book, which

466
00:26:34,880 --> 00:26:38,396
is a little, culture document
describing the values of the company.

467
00:26:38,874 --> 00:26:43,899
Mark: move fast and break things,
but also like a, lot of stuff

468
00:26:43,899 --> 00:26:47,039
about how we want to think about
building stuff for the customer

469
00:26:47,286 --> 00:26:47,576
Carl: Yeah.

470
00:26:47,852 --> 00:26:50,222
okay, so Move Fast and
Break Things is notorious.

471
00:26:50,572 --> 00:26:55,179
here are eight, no seven other
values from the same book.

472
00:26:55,689 --> 00:26:57,069
Done is better than perfect,

473
00:26:57,179 --> 00:26:58,069
fail harder,

474
00:26:58,519 --> 00:27:00,199
what would you do if you weren't afraid,

475
00:27:00,809 --> 00:27:01,989
every day feels like a week,

476
00:27:02,429 --> 00:27:04,599
the Wright brothers did
not have pilot licenses,

477
00:27:04,939 --> 00:27:07,299
the foolish wait and
fortune favors the bold.

478
00:27:07,579 --> 00:27:10,769
And I don't know, a lot of those
are values I can, agree with.

479
00:27:12,651 --> 00:27:15,411
Mark: It's better to get something
done and see what happens than to

480
00:27:15,411 --> 00:27:18,431
waste all of our time discussing
if we should try doing something

481
00:27:18,883 --> 00:27:19,113
Carl: Yeah.

482
00:27:19,643 --> 00:27:19,983
Yeah.

483
00:27:20,213 --> 00:27:22,393
So I don't know, it's, it's a good doc.

484
00:27:23,093 --> 00:27:27,653
This is good speaking about the
engineering cultural history and some

485
00:27:27,653 --> 00:27:32,873
of the actual timelines of improvements
and, releases that they made.

486
00:27:33,284 --> 00:27:35,694
and it's, it lists a number of problems.

487
00:27:36,334 --> 00:27:39,054
th- they started tracking
engineers' keystrokes with no

488
00:27:39,054 --> 00:27:41,584
way to opt out on work laptops.

489
00:27:42,384 --> 00:27:46,284
it says "30 to 50% of engineers and core
teams have been forcefully reassigned to

490
00:27:46,284 --> 00:27:50,824
data labeling." You think you're gonna
be a core AI engineer and oops, you're

491
00:27:50,824 --> 00:27:54,972
just n- t- you're a competent, skilled
professional tagging data the same as

492
00:27:55,202 --> 00:27:59,342
a legion of other competent, skilled
professionals training your replacement.

493
00:27:59,985 --> 00:28:03,735
I have a, friend of mine who was
recently laid off from Meta who has

494
00:28:03,735 --> 00:28:07,628
been involved in, basically, just
trying to resist this type of pressure.

495
00:28:07,709 --> 00:28:11,079
like for being forcefully reassigned
to a team that you are not

496
00:28:11,116 --> 00:28:13,556
interested in being on, that sucks.

497
00:28:14,666 --> 00:28:15,706
and it's part of your contract.

498
00:28:15,706 --> 00:28:19,246
It's ultimately, at the end of the day,
you're in a hierarchical corporate system.

499
00:28:19,886 --> 00:28:24,479
They have hired you to perform work at
their leisure, at their desire, and it is

500
00:28:24,479 --> 00:28:28,879
entirely within their legal contractual
right to say, "You work on this now."

501
00:28:30,196 --> 00:28:33,136
and that doesn't, What if it,
wasn't their contractual right?

502
00:28:33,136 --> 00:28:35,296
What if they did have to actually
negotiate with you and put you

503
00:28:35,296 --> 00:28:37,656
somewhere that was mutually compatible?

504
00:28:37,666 --> 00:28:38,136
So I don't know.

505
00:28:38,146 --> 00:28:43,516
That's, that's the pushback that they
have been trying to support and organize.

506
00:28:43,546 --> 00:28:46,829
But, meta is maybe not doing so great.

507
00:28:47,369 --> 00:28:53,509
I guess, one, one concrete engineering
point that this, draws attention to was

508
00:28:53,519 --> 00:28:56,369
the r- disappointing AI model development.

509
00:28:56,789 --> 00:28:58,709
Like losing momentum effectively.

510
00:28:58,709 --> 00:29:02,969
Like Llama 1, 2, 3 were all very
cutting-edge and competitive, and

511
00:29:02,969 --> 00:29:07,569
Llama 4 released over a year ago now,
which I guess was the last release.

512
00:29:07,599 --> 00:29:10,119
I don't know of another release from them.

513
00:29:10,779 --> 00:29:13,479
so yeah, I don't… as a
symptom of declining engineering

514
00:29:13,479 --> 00:29:17,819
culture, their frontier AI
model is no longer competitive.

515
00:29:18,136 --> 00:29:18,346
Mark: Yeah.

516
00:29:18,346 --> 00:29:21,616
So some of the points it makes is
that they, they, used to have v-

517
00:29:21,946 --> 00:29:24,566
pretty good engineering culture
based on we're, trying to build the

518
00:29:24,566 --> 00:29:26,436
right things the right way at scale.

519
00:29:26,976 --> 00:29:29,576
The question of, whether the apps
that they're building are useful

520
00:29:29,576 --> 00:29:32,466
for society is a different question,
but at least they were mostly

521
00:29:32,466 --> 00:29:33,686
trying to build them the right way.

522
00:29:34,246 --> 00:29:39,046
And now it seems like in the last year or
two they have shifted to a focus on AI.

523
00:29:39,076 --> 00:29:40,416
They've had a bunch of layoffs.

524
00:29:40,876 --> 00:29:46,989
Engineers have been forcefully reassigned,
and the, I know the performance review

525
00:29:46,989 --> 00:29:51,749
topic c- has come up repeatedly when I've
talked to even, React core team members.

526
00:29:52,039 --> 00:29:56,899
They, they want to spend their time doing
things that will benefit the greater

527
00:29:56,899 --> 00:30:02,639
React community, but they have to, in
order to get good performance reviews,

528
00:30:02,639 --> 00:30:06,299
they have to show, like, how is this
actually benefiting Meta the company.

529
00:30:06,839 --> 00:30:10,089
And so whether that's something like,
"We're gonna build this new React feature

530
00:30:10,129 --> 00:30:15,079
because it makes Ads Manager faster,"
or, just, interactions in some way.

531
00:30:15,609 --> 00:30:19,569
So that I know has been a struggle
just for the React team, and it's

532
00:30:19,569 --> 00:30:22,649
clearly a major problem for everyone
else at the company at this point.

533
00:30:22,889 --> 00:30:24,239
How justify my existence?

534
00:30:25,415 --> 00:30:29,214
Carl: there's a book that I love
called Moral Mazes that speaks a

535
00:30:29,214 --> 00:30:31,954
lot about this type of problem.

536
00:30:32,755 --> 00:30:34,635
we, we're talking about
engineering culture.

537
00:30:34,645 --> 00:30:39,134
That's… Culture is the downstream
result of a vast group of people

538
00:30:39,134 --> 00:30:40,224
interacting with each other.

539
00:30:40,234 --> 00:30:42,844
The culture is the emergent
property of how those individuals

540
00:30:42,864 --> 00:30:43,994
interact with each other.

541
00:30:44,363 --> 00:30:48,683
And Moral Mazes is a really wonderful
sociological study of the firm,

542
00:30:48,693 --> 00:30:50,423
the c- the American corporation.

543
00:30:50,903 --> 00:30:55,423
And so it ends up speaking a lot about
subjects like performance reviews.

544
00:30:55,463 --> 00:31:00,794
And here in this blog post, the Pragmatic
Engineer Newsletter, it says, "The biggest

545
00:31:00,794 --> 00:31:03,934
problem, people stop caring about real
work and focus on performative work."

546
00:31:04,611 --> 00:31:08,651
and like what you just said about how
they can't do what's best for the overall

547
00:31:08,651 --> 00:31:12,731
growth of the library because that's not
the criteria upon which they're judged.

548
00:31:13,031 --> 00:31:17,341
They are judged on their impact
within the company, and specifically

549
00:31:18,431 --> 00:31:22,751
the impact on the company as judged
by their immediate supervisor

550
00:31:22,851 --> 00:31:24,211
with, with the supervisor chain.

551
00:31:24,211 --> 00:31:28,241
So it, ultimately you're… The,
incentives flow down in that kind of way.

552
00:31:28,241 --> 00:31:29,991
So it's actually…

553
00:31:31,231 --> 00:31:36,207
there's, a deep fundamental misalignment
between open source and, the American

554
00:31:36,207 --> 00:31:40,285
corporation, I'm not gonna go into
capitalism a w- But, that's very true.

555
00:31:40,285 --> 00:31:41,995
Open source is a c- is a public good.

556
00:31:42,075 --> 00:31:43,635
It's a, it's, it's a public square.

557
00:31:43,635 --> 00:31:48,168
It's a shared resource that
they're, people don't pay for.

558
00:31:48,808 --> 00:31:52,079
and those types of resources
they're the economic concept

559
00:31:52,079 --> 00:31:53,269
of the tragedy of the commons.

560
00:31:53,289 --> 00:31:58,149
It's a well-known principle that people
don't just casually take care of stuff.

561
00:31:58,859 --> 00:32:04,949
If it's a public common, it's going to
get more extraction than it is investment.

562
00:32:05,019 --> 00:32:06,564
So it's… I don't know.

563
00:32:06,574 --> 00:32:09,914
It's, it, there, the, th- that's
a fundamental tension, and I feel

564
00:32:09,914 --> 00:32:13,484
like any time we're talking about
companies under-investing in,

565
00:32:15,174 --> 00:32:17,064
open source, that's kinda why.

566
00:32:17,074 --> 00:32:18,064
It's because they can't.

567
00:32:18,204 --> 00:32:19,044
They're not allowed to.

568
00:32:19,084 --> 00:32:22,994
If you're a big publicly traded company
that has gone to IPO and has shareholders,

569
00:32:23,694 --> 00:32:27,524
you have a fiduciary duty to those
shareholders, and fiduciary duty does not

570
00:32:27,524 --> 00:32:30,424
include volunteer effort to public goods.

571
00:32:30,434 --> 00:32:32,814
So it's, that's, there you go.

572
00:32:32,814 --> 00:32:33,364
That's the tension.

573
00:32:34,474 --> 00:32:35,424
Anyway, let's move on

574
00:32:36,827 --> 00:32:42,699
Great post from Charity Majors who,
somebody who I've … They, are such

575
00:32:42,699 --> 00:32:48,278
a well-spoken, phenomenal writer
speaking about engineering culture.

576
00:32:48,653 --> 00:32:52,629
And I, especially they talk about
opera- or, yeah, I was gonna say

577
00:32:52,659 --> 00:32:54,979
operationalizing, production environments.

578
00:32:55,159 --> 00:32:58,429
they run a company that makes
its money on observability,

579
00:32:58,822 --> 00:32:59,843
Mark: Honeycomb

580
00:33:00,049 --> 00:33:00,579
Carl: Honeycomb.

581
00:33:01,314 --> 00:33:05,364
great company, great mission,
great blogger, great writer.

582
00:33:05,974 --> 00:33:09,734
so i- she's put out a post, AI Demands
More Engineering Discipline, Not Less.

583
00:33:10,287 --> 00:33:14,077
Charity says in her post, "What happened
in 2025 was this, the economics of

584
00:33:14,107 --> 00:33:17,417
code production were turned upside
down. Instead of being very hard,

585
00:33:17,447 --> 00:33:20,397
time-consuming, and expensive to
generate code, it became effectively

586
00:33:20,397 --> 00:33:23,757
free and instant. Lines of code went from
being treasured, reused, cared for and

587
00:33:23,757 --> 00:33:26,957
carefully curated to being disposable
and regenerable practically overnight."

588
00:33:28,207 --> 00:33:32,177
And something I've said on
this podcast before is that,

589
00:33:33,327 --> 00:33:34,537
code's kind of a liability.

590
00:33:34,967 --> 00:33:39,007
over time code is not
an asset, it is a drain.

591
00:33:39,007 --> 00:33:40,347
It is something to be maintained.

592
00:33:40,357 --> 00:33:41,637
It is a cost center.

593
00:33:42,341 --> 00:33:43,261
so I agree with that.

594
00:33:43,261 --> 00:33:44,581
I think that read is correct.

595
00:33:44,831 --> 00:33:46,941
The, economics of code production
were turned upside down.

596
00:33:47,171 --> 00:33:53,424
it's m- because code is not an asset,
because code is a liability, the ability

597
00:33:53,424 --> 00:33:58,834
to discard it and replace it with
something new that is, has differ- has

598
00:33:58,834 --> 00:34:02,494
a different risk profile is massive.

599
00:34:02,624 --> 00:34:07,614
Mark: It's, ironic because, as developers
we have historically resisted, taking

600
00:34:07,614 --> 00:34:13,314
the time to write documentation or
writing tests or actually planning out

601
00:34:13,314 --> 00:34:17,764
our work, and suddenly it turns out that
in order to get good results from AI,

602
00:34:17,784 --> 00:34:20,144
we actually need to do all of the above.

603
00:34:20,435 --> 00:34:26,241
Carl: Yeah, and it's like I have always
known what the right choice to make was.

604
00:34:26,561 --> 00:34:30,301
it's y- several years ago when
I was working as a tech lead,

605
00:34:30,311 --> 00:34:32,301
it's okay, we have this feature.

606
00:34:32,321 --> 00:34:36,751
I know that it is deficient
in these , these areas.

607
00:34:37,271 --> 00:34:38,881
no, we don't have end-to-end tests.

608
00:34:39,001 --> 00:34:42,721
no, we don't have functional
integration tests for all corner cases.

609
00:34:43,561 --> 00:34:46,531
Because we don't have an existing
end-to-end harness, because we don't have

610
00:34:46,531 --> 00:34:51,671
a framework for mocking network responses
for requests initiated from components

611
00:34:51,671 --> 00:34:53,141
deep in the tree, deep in the hierarchy.

612
00:34:53,911 --> 00:34:59,561
there, it's, it… Engineering
excellence is a momentum-based metric.

613
00:35:00,271 --> 00:35:02,371
You cannot skip ahead

614
00:35:02,421 --> 00:35:07,621
You can't write end-to-end tests if you
haven't built a reliable framework upon

615
00:35:07,621 --> 00:35:10,191
which to run end-to-end test suites.

616
00:35:11,168 --> 00:35:13,265
and so it's hard to do.

617
00:35:13,548 --> 00:35:16,638
It's hard to keep that momentum up
over a long enough time span to where

618
00:35:16,638 --> 00:35:19,438
you start observing the benefits,
and so most companies didn't.

619
00:35:20,518 --> 00:35:24,198
the number of times where I would get
feedback on something, and it's like, why

620
00:35:24,198 --> 00:35:27,328
don't we have this already?" It's, 'cause
that would've taken two weeks, and I can

621
00:35:27,328 --> 00:35:31,655
do it now, but I didn't have two weeks."
and I gotta say, I'm finding it much

622
00:35:31,675 --> 00:35:34,265
easier to find those two weeks with AI.

623
00:35:35,505 --> 00:35:38,965
AI is an amnesiac, so it needs
to start from scratch every time.

624
00:35:40,015 --> 00:35:43,585
if you're working on a new feature or
just built something brand new, I just

625
00:35:43,605 --> 00:35:48,285
ask Claude, "Hey, familiarize yourself
with this code base, how much of that

626
00:35:48,285 --> 00:35:49,895
did you get from docs versus the code?"

627
00:35:50,115 --> 00:35:53,405
And it does a little analysis, and
it comes back and says, "Oh, the

628
00:35:53,415 --> 00:35:56,115
documentation is out of date in
these locations, and these concepts

629
00:35:56,115 --> 00:35:57,175
should be pulled in." "Great.

630
00:35:57,245 --> 00:35:58,725
Can you do that work for
me?" It's like, "Oh, yeah.

631
00:35:58,725 --> 00:35:58,935
Cool, cool.

632
00:35:59,695 --> 00:36:04,595
And so then instead of, what, six hours
of, reading code and putting together

633
00:36:04,595 --> 00:36:08,875
my own notes and understanding what
documentation is currently available

634
00:36:08,875 --> 00:36:14,485
and synthesizing it to get, a fact-based
update and then writing brand-new prose

635
00:36:14,485 --> 00:36:19,895
to fill in those docs, I, I, I can do that
in 10 minutes in a background process.

636
00:36:20,615 --> 00:36:24,165
Mark: Yeah, I, love generating
architecture exploration

637
00:36:24,325 --> 00:36:26,205
e- explanation type docs.

638
00:36:26,475 --> 00:36:27,705
I've, found that extremely useful.

639
00:36:27,705 --> 00:36:30,045
In fact, that was my gateway
that eventually led to me

640
00:36:30,055 --> 00:36:31,725
using aI to write code.

641
00:36:32,525 --> 00:36:35,685
It does feel like I'm leaving
some understanding on the table,

642
00:36:35,735 --> 00:36:38,675
that my understanding is can be
very much more surface level.

643
00:36:39,248 --> 00:36:42,768
some of it is, there's ar- areas
of our code base and our projects

644
00:36:42,768 --> 00:36:46,408
I just haven't looked at, and
operating off of a vague mental model.

645
00:36:47,358 --> 00:36:50,241
I, skimmed through a handful
of architecture docs.

646
00:36:50,711 --> 00:36:54,041
that's certainly not, that's certainly not
enough to actually understand what's going

647
00:36:54,223 --> 00:36:55,071
Yeah place.

648
00:36:55,205 --> 00:36:59,195
It's, easier entry, but
maybe not as much depth

649
00:36:59,571 --> 00:37:00,251
Carl: That's very true.

650
00:37:00,251 --> 00:37:06,881
I assuage my own guilt in that, the like,
"Oh no, I, know that I'm only seeing

651
00:37:07,111 --> 00:37:12,607
30% of this." ' Cause for one, every
code base is too large for your brain.

652
00:37:13,057 --> 00:37:16,007
you are never going to fully
understand all of it at the same time.

653
00:37:16,571 --> 00:37:22,167
And  any time that I did fully
understand something, the, amount

654
00:37:22,167 --> 00:37:25,097
of time it took to get to that
understanding, and then the only time

655
00:37:25,097 --> 00:37:26,737
I ever did that was to change it,

656
00:37:27,313 --> 00:37:27,593
Mark: Mm.

657
00:37:27,927 --> 00:37:30,197
Carl: So then as soon as I'm
done with that, as soon as I have

658
00:37:30,417 --> 00:37:33,957
gotten my understanding up to
100%, cool, great, I'm changing it.

659
00:37:33,967 --> 00:37:34,867
That's now out of date.

660
00:37:34,877 --> 00:37:36,227
That knowledge is now useless.

661
00:37:36,757 --> 00:37:38,767
Mark: I'm, sure I've mentioned
this in previous episodes.

662
00:37:38,797 --> 00:37:42,967
I am a huge fan of the concept
that programming is building a

663
00:37:42,967 --> 00:37:44,777
working mental model of the system.

664
00:37:45,057 --> 00:37:46,757
it's a, it's about theory building.

665
00:37:47,167 --> 00:37:53,287
So you understand what we are trying
to build as a domain, as a project.

666
00:37:53,407 --> 00:37:57,097
You understand the current system, the
architecture, the quirks, the concepts,

667
00:37:57,397 --> 00:38:02,047
so that for any task you work on, whether
it's a feature, a bug, whatever, you are

668
00:38:02,047 --> 00:38:04,537
starting from my current understanding.

669
00:38:04,567 --> 00:38:08,247
You break down the new problem
based on your understanding.

670
00:38:08,817 --> 00:38:12,977
You come up with a plan, you implement
it, you spend six hours trying to make

671
00:38:12,977 --> 00:38:16,747
it work, and by the time you're done,
you not only have working code, you have

672
00:38:17,117 --> 00:38:19,247
updated your mental model on the system.

673
00:38:19,257 --> 00:38:21,997
So I would say it's not that
you've made your previous knowledge

674
00:38:22,037 --> 00:38:26,577
useless, but we are continually
modifying that understanding

675
00:38:26,815 --> 00:38:28,195
Carl: Yes, sure.

676
00:38:28,255 --> 00:38:29,635
I agree with that.

677
00:38:29,965 --> 00:38:34,995
I agree with that, but I also discount it
a little bit more than I think you are.

678
00:38:35,405 --> 00:38:40,225
Like, I'd agree that, developing
an, accurate mental model is core.

679
00:38:40,625 --> 00:38:43,505
You need to do that as writing,
as part of writing code.

680
00:38:44,405 --> 00:38:49,432
I, at least, am satisfied at
the level that I am able to

681
00:38:49,432 --> 00:38:51,332
develop a mental model w- via AI.

682
00:38:53,422 --> 00:38:55,022
I guess th- this is, a feedback cycle.

683
00:38:55,022 --> 00:38:59,242
You have to develop your mental
model, check it against what the AI

684
00:38:59,242 --> 00:39:02,542
is telling you, and then make sure
it's what you intended, and then

685
00:39:02,542 --> 00:39:06,052
make sure that what you intended is
compatible with a functioning projec-

686
00:39:06,292 --> 00:39:08,312
will it achieve what you meant it to?

687
00:39:09,012 --> 00:39:15,645
And those are all really hard, oh,
another thing I wanna say your mental

688
00:39:15,645 --> 00:39:19,035
model, are, the building blocks
that you have available to develop

689
00:39:19,035 --> 00:39:23,355
your mental model, are those complex
enough to, capture what you're making?

690
00:39:23,875 --> 00:39:25,215
That's something I run into fairly often.

691
00:39:25,445 --> 00:39:30,035
It's like the system architecture, the
system design inter- interview questions.

692
00:39:30,035 --> 00:39:32,605
Like, how would you build
Twitter to be re- resilient?

693
00:39:33,785 --> 00:39:34,855
Those are hard problems.

694
00:39:34,855 --> 00:39:38,585
That's re- you know, de- developing
a system that can manage hundreds

695
00:39:38,585 --> 00:39:44,505
of millions of requests is, yeah,
it's really tough, and AI is really

696
00:39:44,505 --> 00:39:46,585
helpful for me for exploring that.

697
00:39:48,015 --> 00:39:52,255
it ends up being… Okay, oh, wait, here
let me try and frame this in a sentence.

698
00:39:52,305 --> 00:39:57,085
It used to be critically essential to
develop an accurate mental model through

699
00:39:57,085 --> 00:40:03,025
the process of reading and writing code
yourself, and now it's much more important

700
00:40:03,075 --> 00:40:08,845
to be able to ask the correct question
at the correct time of the code base.

701
00:40:08,875 --> 00:40:12,945
Because now you can… The, frontier
models are smart enough and the tools

702
00:40:12,945 --> 00:40:17,315
are capable enough, they can pretty
meaningfully answer any question that

703
00:40:17,315 --> 00:40:19,955
you have about a fixed set of code.

704
00:40:20,385 --> 00:40:24,315
If you, bound it to like, "Here's the
code, here's your world, tell me about

705
00:40:24,315 --> 00:40:27,285
it. Answer this question for me," it can.

706
00:40:28,025 --> 00:40:32,845
And so now it's up to you to know what
the right questions are to ask given

707
00:40:32,845 --> 00:40:36,235
the present state of the existing code

708
00:40:36,735 --> 00:40:36,985
Mark: Yeah.

709
00:40:37,545 --> 00:40:40,635
So let's tie that then into
the next link in the list.

710
00:40:41,345 --> 00:40:44,995
so Krzysztof Nakazawa is a long
time figure in the React ecosystem.

711
00:40:45,005 --> 00:40:48,145
He's worked on Jest and graphQL
and a whole bunch of other tools.

712
00:40:48,815 --> 00:40:53,795
more recently, he shipped a data
fetching library called Fate.

713
00:40:54,355 --> 00:40:57,655
he's built a game with
JavaScript called Athena Crisis.

714
00:40:58,155 --> 00:41:01,435
He got hired by Void Zero, which
we'll talk about in a second.

715
00:41:02,235 --> 00:41:08,545
so like re- like really smart,
capable long-term engineer, and he is

716
00:41:08,545 --> 00:41:11,195
now fully doing everything with AI.

717
00:41:11,517 --> 00:41:11,837
Carl: Yep.

718
00:41:11,885 --> 00:41:15,965
Mark: He put up a post on modern
engineering values where he talk about

719
00:41:15,975 --> 00:41:21,755
how he uses AI effectively, but also
then what are the principles that he's

720
00:41:21,755 --> 00:41:24,195
using in trying to build projects.

721
00:41:24,215 --> 00:41:29,775
And he talks about, ownership and
taste and strict guardrails and

722
00:41:29,775 --> 00:41:32,605
fast feedbacks loops, which is
what we were hitting on a minute

723
00:41:32,817 --> 00:41:32,957
Carl: Yep.

724
00:41:34,475 --> 00:41:37,885
Mark: Being able, to know what
is the right context that I feed

725
00:41:37,885 --> 00:41:41,155
into the agents so that they are
able to come up with the answers.

726
00:41:42,195 --> 00:41:45,975
maybe actually, owning some
more your own code instead of

727
00:41:45,975 --> 00:41:47,635
depending on third-party libraries.

728
00:41:48,735 --> 00:41:52,525
Thinking differently about how you
build prototypes and ship things.

729
00:41:53,505 --> 00:41:58,095
so very relevant to like we're,
doing the same work, but maybe at

730
00:41:58,425 --> 00:42:01,095
a higher level, and you do have
to know where you're trying to go

731
00:42:02,557 --> 00:42:03,057
Carl: Yes.

732
00:42:03,207 --> 00:42:04,257
Yeah, agree.

733
00:42:04,807 --> 00:42:09,737
Yeah, I like this, bit from Christoph's
post, "I've found that coding agents now

734
00:42:09,737 --> 00:42:12,757
write code that is as good or better than
what I could write," which I would agree.

735
00:42:12,797 --> 00:42:13,837
I find that true as well.

736
00:42:14,207 --> 00:42:16,837
"And they do it in minutes instead of
weeks. Since coding is no longer the

737
00:42:16,837 --> 00:42:19,587
bottleneck, I get a lot of work done that
otherwise wouldn't have happened at all."

738
00:42:20,227 --> 00:42:21,467
100% agree with that.

739
00:42:21,487 --> 00:42:24,877
That is… I have started and
finished so many more projects than

740
00:42:24,877 --> 00:42:27,617
I would have before because I, can
do it in a day instead of in a week.

741
00:42:28,147 --> 00:42:29,937
it's a 7X speed multiplier for me.

742
00:42:30,088 --> 00:42:31,112
So it's good.

743
00:42:32,342 --> 00:42:38,792
Mark: In industry news, Void Zero, the
company behind VitePlus and a couple other

744
00:42:38,792 --> 00:42:46,232
pieces, has been bought by Cloudflare,
this continues the trend of a bunch of

745
00:42:46,262 --> 00:42:51,932
open source build tool developers try
to get funding, try to make a company,

746
00:42:52,662 --> 00:42:56,192
and then they probably get swallowed up
by someone bigger because there is no

747
00:42:56,192 --> 00:42:59,322
money in running open source build tools.

748
00:43:00,782 --> 00:43:04,532
Bun and a whole bunch of
others all getting bought out.

749
00:43:05,162 --> 00:43:08,282
nobody is making money off
of open source build tools.

750
00:43:08,282 --> 00:43:13,135
There is no build m- there is no financial
model, hosting, or anything else.

751
00:43:13,475 --> 00:43:15,235
So we'll see how it plays out.

752
00:43:15,575 --> 00:43:20,165
to be clear, this is about
the team and the VitePlus and

753
00:43:20,395 --> 00:43:22,345
Void tool sets and frameworks.

754
00:43:22,385 --> 00:43:27,635
This does not affect Vite, the open source
bundler, at all, other than these are

755
00:43:27,635 --> 00:43:29,025
some of the same people working on it.

756
00:43:29,522 --> 00:43:33,302
but it continues the pattern, and I don't
see that pattern changing anytime soon

757
00:43:34,191 --> 00:43:36,821
Carl: We got some more
security updates from NPM.

758
00:43:37,154 --> 00:43:38,154
Great.

759
00:43:38,654 --> 00:43:45,424
GitHub Actions now supports blocking
and pinning actions to a specific SHA.

760
00:43:46,124 --> 00:43:47,704
So that's, that's really good.

761
00:43:47,704 --> 00:43:52,164
If you… So this is helpful
for avoiding vulnerable actions.

762
00:43:52,434 --> 00:43:57,234
if you're aware that some specific
release of an action was compromised,

763
00:43:57,264 --> 00:43:59,084
you can now block that one specifically.

764
00:43:59,104 --> 00:44:03,954
Or say, "We know this one is
good. Only use this version." wow.

765
00:44:04,714 --> 00:44:08,044
Ability to select precisely
what code you're running.

766
00:44:08,647 --> 00:44:09,757
This feels like table stakes to me.

767
00:44:09,757 --> 00:44:11,107
It's shocking that we're
only just getting it

768
00:44:11,710 --> 00:44:13,970
Mark: there's, a guy named Andrew
Nesbitt, I think we may have linked

769
00:44:13,970 --> 00:44:17,680
one or two of his articles previously,
but he has become an expert on package

770
00:44:17,680 --> 00:44:21,280
managers and packaging systems,
and I think he wrote an, a couple

771
00:44:21,280 --> 00:44:24,810
articles talking about, yep, GitHub
Actions is totally a package manager.

772
00:44:24,950 --> 00:44:27,780
It doesn't look like one,
but it is, and it's bad

773
00:44:29,322 --> 00:44:29,812
Carl: Yes.

774
00:44:30,112 --> 00:44:33,302
Yeah, people shit on NPM for a
lot of reasons, but you know what?

775
00:44:34,092 --> 00:44:38,859
The w- most most of the ecosystem problems
in JavaScript around dependencies are

776
00:44:38,859 --> 00:44:43,049
because NPM is one of the only functional
package managers in programming.

777
00:44:43,679 --> 00:44:48,549
Cargo or NuGet or, like,
all of the other…

778
00:44:48,899 --> 00:44:52,059
Every other language has a
shitty dependency manager.

779
00:44:52,079 --> 00:44:57,269
It does not support what I would call
core features of a dependency manager.

780
00:44:58,019 --> 00:44:59,859
For instance, pinning versions.

781
00:45:00,379 --> 00:45:04,369
Just, it's shocking to me how
ineffective we are at sharing code

782
00:45:04,449 --> 00:45:06,189
in the vast majority of programming.

783
00:45:07,639 --> 00:45:08,269
anyway, yeah.

784
00:45:08,359 --> 00:45:08,999
So great.

785
00:45:09,399 --> 00:45:13,969
So many things are terrible dependency
managers, and GitHub Actions is now a

786
00:45:13,969 --> 00:45:15,989
slightly less terrible pa- package manager

787
00:45:17,131 --> 00:45:20,521
GitHub also put out some
breaking changes for npm 12.

788
00:45:20,541 --> 00:45:25,981
They are not going to run install
scripts and Git dependencies by default.

789
00:45:27,091 --> 00:45:30,371
that is… This is literally
something I've seen discussed as a

790
00:45:30,371 --> 00:45:32,801
security vulnerability for 10 years.

791
00:45:33,151 --> 00:45:36,591
So it finally got exploited enough
times that they're like, "Nope, okay,

792
00:45:36,591 --> 00:45:39,101
we gotta get rid of it." great, cool.

793
00:45:39,131 --> 00:45:41,711
They're getting rid of the thing that
has been discussed as something that

794
00:45:41,711 --> 00:45:43,834
should be gotten rid of for a long time

795
00:45:44,458 --> 00:45:48,558
specifically it's, NPM will no
longer run pre-install, install, or

796
00:45:48,558 --> 00:45:53,068
post-install scripts from dependencies
unless you allow list them.

797
00:45:53,078 --> 00:45:55,098
So no builds basically

798
00:45:55,176 --> 00:45:57,156
Mark: what I think pnpm als- already does

799
00:45:58,242 --> 00:46:01,062
Carl: Plenty of package managers already
do that because running untrustworthy

800
00:46:01,062 --> 00:46:03,242
code from a network is really dangerous.

801
00:46:03,242 --> 00:46:03,872
Don't do it.

802
00:46:04,882 --> 00:46:07,912
This is what I mean, like, I just
said, NPM is one of the most advanced

803
00:46:07,912 --> 00:46:11,482
package managers in all of programming,
and it still gets basic shit wrong.

804
00:46:11,722 --> 00:46:12,372
Stop it.

805
00:46:12,982 --> 00:46:13,922
Security models.

806
00:46:15,146 --> 00:46:16,956
Mark: All right, last
major item for the day.

807
00:46:17,866 --> 00:46:21,326
topic, a related topic,
but, bit of a grab bag.

808
00:46:21,956 --> 00:46:26,276
There's a whole bunch of good articles
about code optimization that came out

809
00:46:26,436 --> 00:46:31,146
in the last few weeks, and I've spent a
lot of time doing performance profiling.

810
00:46:31,146 --> 00:46:35,006
I have literally given a talk this year
on how to do performance profiling.

811
00:46:35,056 --> 00:46:39,616
So we had several articles on, and
from people who did performance

812
00:46:39,616 --> 00:46:42,806
optimization work on tools and libraries.

813
00:46:43,586 --> 00:46:48,316
First off, there's a couple articles
from the TanStack Table folks where

814
00:46:48,316 --> 00:46:53,346
they talked about how they were able
to save a bunch of memory within

815
00:46:53,346 --> 00:46:58,446
TanStack Table by switching out the
JavaScript prototypes that were being

816
00:46:58,446 --> 00:47:03,786
used, as well as how they optimized,
the TypeScript compilation performance.

817
00:47:04,206 --> 00:47:07,336
Now, yes, TypeScript's version
seven's gonna make all our TypeScript

818
00:47:07,346 --> 00:47:11,336
faster, whatever, but it's still
good to actually try to improve

819
00:47:11,616 --> 00:47:13,966
the, type checking time if possible.

820
00:47:15,396 --> 00:47:20,346
next, there's something called the
Pierre Computer Company, which is

821
00:47:20,376 --> 00:47:24,956
making essentially like a, GitHub for,
as a service kind of a, set of tools.

822
00:47:25,476 --> 00:47:30,156
And they've put out a couple JavaScript
libraries, one for rendering tree views

823
00:47:30,326 --> 00:47:35,546
in the UI, but they also put out one
that is a diffs rendering library.

824
00:47:36,316 --> 00:47:41,196
And so they've put up a post on
how they heavily optimized all the

825
00:47:41,196 --> 00:47:45,376
list virtualization and the syntax
highlighting and all the other

826
00:47:45,376 --> 00:47:49,426
complexities of trying to render
diffs efficiently in the browser.

827
00:47:49,816 --> 00:47:55,566
And I've seen several other applications
pop up which use that library in the UI.

828
00:47:56,526 --> 00:48:01,766
part of me make, wonders if GitHub
perhaps consider using that library

829
00:48:01,786 --> 00:48:08,319
in their UI given the, how slow their
React based, PR view is at this point

830
00:48:10,557 --> 00:48:11,057
Carl (editing): oh, shoot.

831
00:48:11,227 --> 00:48:12,207
We had an audio problem.

832
00:48:12,557 --> 00:48:16,157
For some reason, we lost about
the last 10 minutes of my audio.

833
00:48:16,197 --> 00:48:17,557
Mark's came through just fine.

834
00:48:17,617 --> 00:48:19,947
Uh, and luckily he did most of the
talking in the last little bit here.

835
00:48:20,337 --> 00:48:24,537
Uh, but unfortunately we lost
about four to five minutes of me

836
00:48:24,537 --> 00:48:26,147
responding to things that Mark said.

837
00:48:26,527 --> 00:48:27,527
Uh, oops, sorry.

838
00:48:28,212 --> 00:48:29,492
Mark: A couple more of these.

839
00:48:29,502 --> 00:48:32,922
So someone recently started a
site called Performance.dev.

840
00:48:32,932 --> 00:48:38,652
Their first article previously was on
how the linear UI is fast using sync

841
00:48:38,652 --> 00:48:44,212
engines, and they just put up another
post on how a tool called Conductor

842
00:48:44,462 --> 00:48:48,424
implemented a bunch of optimizations,
handling some of the UI layer interaction

843
00:48:48,424 --> 00:48:52,154
with Tari, list virtualization,
and a bunch of other pieces.

844
00:48:53,385 --> 00:48:57,449
so those are, apps and
libraries making things faster.

845
00:48:57,668 --> 00:49:01,345
I saw a couple, winks
on something different.

846
00:49:01,745 --> 00:49:05,808
So we all use minifiers
in our bundling process.

847
00:49:06,088 --> 00:49:07,988
It's, part of all modern
build tool chains.

848
00:49:08,041 --> 00:49:15,111
minifiers do things like they don't just
rename variables from my variable to A.

849
00:49:15,241 --> 00:49:16,951
They, they strip white space.

850
00:49:17,271 --> 00:49:22,871
They turn true and false into bang
zero and bang one be- because it

851
00:49:22,871 --> 00:49:24,571
takes up fewer characters, et cetera.

852
00:49:25,081 --> 00:49:27,941
But they also do things like
stripping out dead code.

853
00:49:28,291 --> 00:49:32,661
So if a library has only r- has a,
an if statement that says, "Only

854
00:49:32,661 --> 00:49:37,431
run this in development," it will
convert that to if false, and then it

855
00:49:37,431 --> 00:49:39,231
will say, "Oh, that code can't run.

856
00:49:39,351 --> 00:49:42,921
Just delete that code from the
bundle and optimize the output."

857
00:49:43,201 --> 00:49:48,011
And so every time you run a build,
a minifier is optimizing the output.

858
00:49:48,566 --> 00:49:51,716
And the major mini- the major
minifiers, optimizers have been things

859
00:49:51,716 --> 00:49:57,296
like Terser and, ESBuild has had one
built in, Rolldown has one built in.

860
00:49:57,739 --> 00:50:01,029
there's be- there's one that's
been around for a very long time

861
00:50:01,029 --> 00:50:03,769
called the Google Closure Compiler.

862
00:50:04,649 --> 00:50:10,753
this dates back to when Google first built
a lot of their early web spa type tooling.

863
00:50:11,077 --> 00:50:12,796
2008, 2009, somewhere in that timeframe.

864
00:50:13,606 --> 00:50:17,856
it's, extremely powerful and has a
lot of very advanced optimizations

865
00:50:17,866 --> 00:50:23,486
that other minifiers still don't have,
but it's also big and complicated and

866
00:50:23,486 --> 00:50:24,846
maybe a little bit on the slow side.

867
00:50:25,676 --> 00:50:32,596
interestingly, the React team still uses
the Closure Compiler to build the React

868
00:50:32,636 --> 00:50:38,606
library so that the production version of
React is as fast as it can possibly be.

869
00:50:39,416 --> 00:50:44,342
So I saw two different announcements
of teams that are attempting to write

870
00:50:44,352 --> 00:50:47,682
their own advanced optimizer tools.

871
00:50:48,342 --> 00:50:52,624
one person built something called
CompileCat, and then the other one's

872
00:50:52,624 --> 00:50:56,684
a mention of an internal tool that's
not released yet, but the, RSPACK

873
00:50:56,714 --> 00:51:01,064
team at ByteDance said they're
also working on a similar tool.

874
00:51:01,174 --> 00:51:04,314
So presumably doing things like
actually looking at not just the

875
00:51:04,314 --> 00:51:09,674
JavaScript, but the TypeScript types
in order to be able to, be smarter and

876
00:51:09,674 --> 00:51:12,644
produce better output code as well.

877
00:51:12,809 --> 00:51:17,250
And then I guess we'll wrap up this
section with three things for me.

878
00:51:18,240 --> 00:51:22,510
so I, think I briefly mentioned
last month that I was working

879
00:51:22,530 --> 00:51:28,000
on a proof of concept to try to
optimize React-Redux's subscription

880
00:51:28,010 --> 00:51:30,370
notifications for our large applications.

881
00:51:31,180 --> 00:51:35,000
so I have a draft PR, and I've
put that up, and the early numbers

882
00:51:35,000 --> 00:51:39,560
look promising, like 20% to 30%
faster depending on the situation.

883
00:51:40,204 --> 00:51:46,284
as part of that, I also updated my
React-Redux benchmarks repo so that I've

884
00:51:46,284 --> 00:51:51,824
got better metrics that I'm capturing
and, a better, more realistic set of

885
00:51:51,824 --> 00:51:54,524
example scenarios to be measuring against.

886
00:51:55,194 --> 00:51:59,484
And then one of the conference talks that
I've been doing this year is literally on

887
00:51:59,494 --> 00:52:01,604
the basics of performance optimization.

888
00:52:02,024 --> 00:52:06,717
there's a set of general scientific
principles to apply, descriptions of

889
00:52:06,767 --> 00:52:11,347
actual tools that you would use to measure
JavaScript performance and fi- try to

890
00:52:11,347 --> 00:52:14,994
figure out which lines of code are slow,
and I talk about some of the examples

891
00:52:15,034 --> 00:52:17,384
I did while working on Immer last fall

892
00:52:18,072 --> 00:52:21,132
I think this is all very important
even in the age of an AI because

893
00:52:21,172 --> 00:52:23,072
AI tends to write the obvious code.

894
00:52:23,102 --> 00:52:24,902
It doesn't necessarily
write the fast code.

895
00:52:25,352 --> 00:52:29,102
And we collectively were already
very bad at asking, "Is this

896
00:52:29,102 --> 00:52:33,052
code fast?" in the first place
when we were the ones writing it.

897
00:52:33,632 --> 00:52:36,962
And now that n- we're not the ones
writing it, it's even easier to

898
00:52:36,962 --> 00:52:39,632
never ask the question, "Is it fast?"

899
00:52:41,824 --> 00:52:42,134
Carl (editing): Yep.

900
00:52:42,164 --> 00:52:44,244
So right here is where we
lost about four minutes.

901
00:52:44,284 --> 00:52:47,624
Uh, unfortunately, I, I
definitely cannot reproduce what

902
00:52:47,624 --> 00:52:49,223
I said, which is a big bummer.

903
00:52:49,233 --> 00:52:52,453
I think it was probably really
smart and really clever and really

904
00:52:52,453 --> 00:52:55,063
wrapped up the whole thing of
what we talked about all episode.

905
00:52:55,083 --> 00:52:56,963
But unfortunately, it's
gone into the ether.

906
00:52:57,593 --> 00:53:00,808
I tried re-extracting the audio
as recorded from the original

907
00:53:00,808 --> 00:53:02,608
source, and it was just blank.

908
00:53:02,628 --> 00:53:04,018
We're just completely missing 10 minutes.

909
00:53:04,178 --> 00:53:04,648
sorry.

910
00:53:05,064 --> 00:53:08,494
All I really know is that I was
introducing Aurora Sharf's blog

911
00:53:08,494 --> 00:53:13,364
post titled "Component Architecture
for React Server Components" as her

912
00:53:13,404 --> 00:53:15,894
preferred RSC component architecture.

913
00:53:16,364 --> 00:53:19,314
And I know that because Mark said after

914
00:53:19,719 --> 00:53:19,889
Mark AI filler: yeah.

915
00:53:20,279 --> 00:53:23,579
And, Aurora really is the expert
on this kind of stuff right now

916
00:53:24,482 --> 00:53:28,782
And then one, one other interesting
data point to wrap up, announced

917
00:53:28,852 --> 00:53:33,072
that all of their Vibe-coded app
projects are now going to be built

918
00:53:33,072 --> 00:53:35,412
with TanStack Start by default.

919
00:53:36,062 --> 00:53:39,322
I don't remember whether they
were just using plain Vite React

920
00:53:39,322 --> 00:53:40,832
router or something previously.

921
00:53:41,492 --> 00:53:45,202
but this feels it, it's a
very interesting data point.

922
00:53:46,532 --> 00:53:50,992
A sign of the maturity of TanStack Start,
and that they're, and they're happy to

923
00:53:50,992 --> 00:53:54,652
actually adopt this as the default setup
for all their projects going forward.

924
00:53:55,593 --> 00:53:57,063
Carl (editing): And that is
all we've got for you today.

925
00:53:57,193 --> 00:54:00,803
I am re-recording this afterwards
just like all the other things

926
00:54:00,803 --> 00:54:02,463
I said in the last 10 minutes.

927
00:54:02,473 --> 00:54:05,373
So I'm not gonna do the usual
full sign-off 'cause this is

928
00:54:05,373 --> 00:54:07,853
totally fake and I'm just sitting
at my desk talking to myself.

929
00:54:08,673 --> 00:54:11,303
Sorry for taking a few extra
days to get the podcast out.

930
00:54:11,453 --> 00:54:13,203
I am just tired and it's summer

931
00:54:13,989 --> 00:54:16,329
Thanks so much for listening
all the way to the end even.

932
00:54:16,829 --> 00:54:17,619
talk to you next month